SelectedItem not Firing

Question

Hello

I am using a collectionView, but the item is not firing in the VM

vm

private ObservableCollection<Result> _pokeItems;
        public ObservableCollection<Result> pokeItems {
            get { return _pokeItems; }
            set
            {
                if (_pokeItems != value) {
                    _pokeItems = value;
                    RaisePropertyChanged();
                }
            }
        }

        public ICommand SelectedItem { get; set; }

        public PokeCollectionVM() {

            SelectedItem = new Command(async () => {

                await Application.Current.MainPage.Navigation.PushAsync(new PokeDetailPage());

            });

            pokeItems = new ObservableCollection<Result>();
            loadData();
        }

        public async void loadData() {

            pokeItems = await PokeServices.getPokemonsAsync();

        }
    }
}

View

<ContentPage.BindingContext>
        <vm:PokeCollectionVM />
    </ContentPage.BindingContext>

    <CollectionView ItemsSource="{x:Binding pokeItems}"
                    SelectionMode="Single"
                    SelectedItem="{x:Binding SelectedItem}">
        <CollectionView.EmptyView>
            <Grid>
                <StackLayout VerticalOptions="Center">
                    <Image Source="Load" />
                    <Label Text="Getting data..."
                           FontSize="Large"
                           FontAttributes="Bold"
                           HorizontalOptions="Center"
                           VerticalOptions="Center" />
                </StackLayout>
            </Grid>
        </CollectionView.EmptyView>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <StackLayout>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup Name="CommonStates">
                            <VisualState Name="Normal" />
                            <VisualState Name="Selected">
                                <VisualState.Setters>
                                    <Setter Property="BackgroundColor"
                                            Value="#CAC8AF" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Frame BackgroundColor="#111d5e"
                           Margin="10"
                           CornerRadius="20">
                        <StackLayout Orientation="Horizontal">
                            <Image Source="{x:Binding image_url}" />
                            <Label Text="{x:Binding name}"
                                   Margin="5"
                                   FontAttributes="Bold"
                                   TextColor="GhostWhite" />
                        </StackLayout>
                    </Frame>
                </StackLayout>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Answer 1

Hello,

Welcome to our Microsoft Q&A platform!

When you set the SelectedItem for your CollectionView, the data type of your SelectedItem should be a data model(Result) not ICommand(public ICommand SelectedItem { get; set; })

<CollectionView ItemsSource="{x:Binding pokeItems}"  
                SelectionMode="Single"  
                SelectedItem="{x:Binding SelectedItem}">  

When we check the official document Xamarin.Forms CollectionView Selection,we will find

SelectedItem, of type object, the selected item in the list. This property has a default binding mode of TwoWay, and has a null value when no item is selected.

You can also refer to the sample code here: VerticalListSinglePreSelectionPage.xaml

Hope it can help you.

Best Regards,

Jessie Zhang

---

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.