Button in ListView problem about flexbutton

[hugodantas]

This is not a bug, but a ListView behavior in Xamarin.Forms.
When you bind data inside a ListView, the framework bind that data to the type of ItemsSource, and the "GetMenuCommand" does not exists in your Item Source class (or whatever).

You need to do some modifications in your ClickedCommand to make it work.

XAML

You need to define some name to your ListView with x:Name="" and change the ClickedCommand to be like I show below.

<ListView ItemsSource="{Binding MyListDataSource}" HasUnevenRows="True" x:Name="MyListView">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <flex:FlexButton 
                    VerticalOptions="CenterAndExpand"
                    Icon="location.png"
                    WidthRequest="60"
                    HeightRequest="60"
                    ForegroundColor="White"
                    HighlightForegroundColor="#49516F"
                    BackgroundColor="#6279B8"
                    HighlightBackgroundColor="#8EA4D2"
                    ClickedCommand="{Binding Path=BindingContext.MyCommand, Source={x:Reference MyListView}}"
                    ClickedCommandParameter="{Binding .}" />

ViewModel

1. Your data source will be like public ObservableCollection<MyObject> MyListDataSource { get; }
2. You need a ICommand like public ICommand MyCommand { get; }
3. A instance for your command: MyCommand = new Command<MyObject>(MyCommandAction);
4. And your implementation of an action like you want. 👍

private async void MyCommandAction(MyObject myObject)
{
   // Do what you want here
}

This works for me. 😄

PS: English is not my first language, so I feel sorry about some mispelling. 😅

[robinmanuelthiel]

Oh that's interesting. I've never seen a FlexButton in a ListView so this error never came up, but I will give it a play.

[pogrebnoydv]

+1

[yuv4ik]

Testing on Android and iOS can't reproduce this issue, did you make sure that all your bindings are working?
Here is the code I tried to reproduce the issue with:

public partial class ListViewBugPage : ContentPage
{
    public ICommand TestCmd { get; }
    public ListViewBugPage()
    {
        TestCmd = new Command<string>((p) => Test(p));

        var lv = new ListView
        {
            ItemsSource = new List<string> { "a", "b", "c" }
        };

        lv.ItemTemplate = new DataTemplate(() =>
        {
            var vc = new ViewCell();

            var btn = new FlexButton
            {
                Text = "test",
                HorizontalOptions = LayoutOptions.End,
                CornerRadius = 6,
                ForegroundColor = Color.FromHex("#fffff"),
                HighlightForegroundColor = Color.FromHex("#49516F"),
                BackgroundColor = Color.FromHex("#FF234389"),
                HighlightBackgroundColor = Color.FromHex("#8EA4D2"),
                BorderColor = Color.FromHex("#8EA4D2"),
                HighlightBorderColor = Color.FromHex("#8EA4D2"),
                BorderThickness = 2,
                ClickedCommand = TestCmd,
                ClickedCommandParameter = "tt"
            };
            vc.View = btn;
            return vc;
        });
        Content = lv;
    }

    void Test(string p)
    {
        // Test
    }
}