Skip to content
This repository has been archived by the owner on May 1, 2024. It is now read-only.

[Bug] [Grid] BindableLayout.ItemsSource bound to ObservableCollection misbehaviors #12929

Open
rubiomiguel06 opened this issue Nov 20, 2020 · 0 comments

Comments

@rubiomiguel06
Copy link

Description

Having the following XAML for a Grid Layout:

<Grid x:Name="MainGrid"
          BindableLayout.ItemsSource="{Binding Containers}"
          VerticalOptions="FillAndExpand"
          HorizontalOptions="FillAndExpand">
        <BindableLayout.ItemTemplate>
            <DataTemplate>
                <Frame>
                    <StackLayout>
                        <Label Text = "{Binding ContainerName}"/>
                        ...
                    </StackLayout>
                </Frame>
            </DataTemplate>
        </BindableLayout.ItemTemplate>
</Grid>

where Containers is an ObservableCollection<ContainerViewModel>.

Having the following ViewModel:

public class MainPageViewModel : 
    {
        public MainPageViewModel()
        {
            Containers.Add(new ContainerViewModel() { ContainerName = "Container 1", imgFile = new PlatformImageExtension() { SourceImage = "Cat" }.ProvideValue(null) });
            Containers.Add(new ContainerViewModel() { ContainerName = "Container 2", imgFile = new PlatformImageExtension() { SourceImage = "Dog" }.ProvideValue(null) });
            Containers.Add(new ContainerViewModel() { ContainerName = "Container 3", imgFile = new PlatformImageExtension() { SourceImage = "Horse" }.ProvideValue(null) });
            Containers.Add(new ContainerViewModel() { ContainerName = "Container 4", imgFile = new PlatformImageExtension() { SourceImage = "Human" }.ProvideValue(null) });

            RemoveLast = new Command(
                () => 
                {
                    var removingContainer = Containers.Last();
                    Containers.Remove(removingContainer);
                },
                () => true);
            Add = new Command(
                () =>
                {
                    Containers.Add(new ContainerViewModel() { ContainerName = "Container " + (Containers.Count() + 1) });
                },
                () => true);
        }

        public ObservableCollection<ContainerViewModel> Containers { get; set; } = new ObservableCollection<ContainerViewModel>();
        
        public Command RemoveLast { get; }
        public Command Add { get; }
    }

The behavior when pressing the Remove last and Add button is the following:
ezgif com-gif-maker (19)

Which is the expected behavior.

Now, if a rearrangement of the position of the containers in the Grid is done before pressing the Remove Last button (by setting the Grid.Row and Grid.Column to a different value on some of the Containers) things start to get weird. The Container that is removed from the Grid when pressing Remove Last is not anymore the Last element of the Containers ObservableCollection, but the last one to have it's properties set (Row and Column).

See the following example where containers exchange their position (exchanging their Grid.Row and Grid.Column values) when one container is dragged and dropped over another one:
ezgif com-gif-maker (20)

In the first hit of Remove Last Container 3 was the one whose properties were set last, so Container 3 is removed from the view. This is strange because, if a breakpoint is put inside RemoveLast Command, right before Containers.Remove line, the variable removingContainer has Container 4 as the container to be removed (the expected behavior!)
image

I attach the sample project at the end.

Steps to Reproduce

  1. Launch the project on iOS, Windows or Android
  2. Perform some rearrangements by dragging and dropping the containers into each other
  3. Press Remove Last button and check if the expected Container was removed

Expected Behavior

The Containers should be removed in order even when the positions in the view are changed (since they don't change order inside the collection during the process of rearrangement)

Basic Information

  • Version with issue: XF 4.8.0.1451
  • Platform Target Frameworks:
    • iOS: 14.2
    • Android: 10
    • UWP: 18362

Environment

Microsoft Visual Studio Community 2019
Version 16.8.1
VisualStudio.16.Release/16.8.1+30711.63
Microsoft .NET Framework
Version 4.8.03752

Installed Version: Community

Visual C++ 2019   00435-60000-00000-AA048
Microsoft Visual C++ 2019

Azure App Service Tools v3.0.0   16.8.550.19892
Azure App Service Tools v3.0.0

C# Tools   3.8.0-5.20519.18+4c195c3ac1974edcefa76774d7a59a2350ec55fa
C# components used in the IDE. Depending on your project type and settings, a different version of the compiler may be used.

Common Azure Tools   1.10
Provides common services for use by Azure Mobile Services and Microsoft Azure Tools.

Extensibility Message Bus   1.2.6 (master@34d6af2)
Provides common messaging-based MEF services for loosely coupled Visual Studio extension components communication and integration.

IntelliCode Extension   1.0
IntelliCode Visual Studio Extension Detailed Info

Microsoft JVM Debugger   1.0
Provides support for connecting the Visual Studio debugger to JDWP compatible Java Virtual Machines

Microsoft MI-Based Debugger   1.0
Provides support for connecting Visual Studio to MI compatible debuggers

Microsoft Visual C++ Wizards   1.0
Microsoft Visual C++ Wizards

Microsoft Visual Studio VC Package   1.0
Microsoft Visual Studio VC Package

Mono Debugging for Visual Studio   16.8.43 (00471f8)
Support for debugging Mono processes with Visual Studio.

NuGet Package Manager   5.8.0
NuGet Package Manager in Visual Studio. For more information about NuGet, visit https://docs.nuget.org/

ProjectServicesPackage Extension   1.0
ProjectServicesPackage Visual Studio Extension Detailed Info

Syncfusion Xamarin Project Templates   13.4.0.53
A multi-project template for building iOS, Android, and Windows apps using Syncfusion Xamarin components.

Syncfusion Xamarin Toolbox   16.2.0.19
Syncfusion Essential Studio for Xamarin Toolbox Visual Studio extension.

SyncfusionMenu Extension   1.0
SyncfusionMenu Visual Studio Extension Detailed Info

Visual Basic Tools   3.8.0-5.20519.18+4c195c3ac1974edcefa76774d7a59a2350ec55fa
Visual Basic components used in the IDE. Depending on your project type and settings, a different version of the compiler may be used.

Visual F# Tools   16.8.0-beta.20507.4+da6be68280c89131cdba2045525b80890401defd
Microsoft Visual F# Tools

Visual Studio Code Debug Adapter Host Package   1.0
Interop layer for hosting Visual Studio Code debug adapters in Visual Studio

VisualStudio.DeviceLog   1.0
Information about my package

VisualStudio.Foo   1.0
Information about my package

VisualStudio.Mac   1.0
Mac Extension for Visual Studio

Xamarin   16.8.000.255 (d16-8@d002176)
Visual Studio extension to enable development for Xamarin.iOS and Xamarin.Android.

Xamarin Designer   16.8.0.507 (remotes/origin/d16-8@e87b24884)
Visual Studio extension to enable Xamarin Designer tools in Visual Studio.

Xamarin Templates   16.8.112 (86385a3)
Templates for building iOS, Android, and Windows apps with Xamarin and Xamarin.Forms.

Xamarin.Android SDK   11.1.0.17 (d16-8/c0e2b8e)
Xamarin.Android Reference Assemblies and MSBuild support.
    Mono: be2226b
    Java.Interop: xamarin/java.interop/d16-8@79d9533
    ProGuard: Guardsquare/proguard/proguard6.2.2@ebe9000
    SQLite: xamarin/sqlite/3.32.1@1a3276b
    Xamarin.Android Tools: xamarin/xamarin-android-tools/d16-8@2fb1cbc


Xamarin.iOS and Xamarin.Mac SDK   14.4.1.3 (e30c41de3)
Xamarin.iOS and Xamarin.Mac Reference Assemblies and MSBuild support.

Reproduction Link

GridRearrangeSample.zip

@rubiomiguel06 rubiomiguel06 added s/unverified New report that has yet to be verified t/bug 🐛 labels Nov 20, 2020
@samhouts samhouts added this to New in Triage Nov 20, 2020
@hartez hartez added e/5 🕔 5 and removed s/unverified New report that has yet to be verified labels Nov 25, 2020
@hartez hartez added this to To do in Other Ready For Work via automation Nov 25, 2020
@hartez hartez removed this from New in Triage Nov 25, 2020
@rubiomiguel06 rubiomiguel06 changed the title [Bug] [Grid] BindableLayout.ItemsSource binded to ObservableCollection misbehaviors [Bug] [Grid] BindableLayout.ItemsSource bound to ObservableCollection misbehaviors Nov 26, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
Development

No branches or pull requests

3 participants