Navigate to the detail page of selected item in CollectionView

Question

I am using .net MAUI . I want to navigate to a detail page of selected item in CollectionView. I have tried using selectionchanged but it opens blank page .My goal is to open a detail page of particular product that is selected. It was working in ListView but when I change it to collectionView it opens blank page. I'm attaching the relevant code , Please let me know If more information is required.

Xaml code(page 1)

<CollectionView SelectionMode="Single" 
                x:Name="listview" 
                IsVisible="true" 
                RemainingItemsThreshold="12" 
                SelectionChanged= "listview_SelectionChanged" 
                ItemsLayout="VerticalGrid, 2">
    
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Grid Padding="18">
                <Grid.RowDefinitions>
                    <RowDefinition Height="100" />
                    <RowDefinition Height="100" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="120" />
                    <ColumnDefinition Width="120" />
                </Grid.ColumnDefinitions>
                <Image Source="splash_logo.png"  Grid.RowSpan="1" Grid.Column="0" Grid.Row="0"/>
                <Label Text="{Binding prod_name}" TextColor="Black" FontSize="Medium" FontAttributes="Bold" Grid.Column="0" Grid.Row="1" VerticalTextAlignment="Center" HorizontalOptions="CenterAndExpand"/>
                <HorizontalStackLayout Grid.Row="2" Grid.Column="0" >
                    <Label Text="Rs." TextColor="Black"/>
                    <Label Text="{Binding prod_price}" TextColor="Black"  LineBreakMode="TailTruncation"/>
                </HorizontalStackLayout>
            </Grid>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

xaml.cs code

 private async void listview_SelectionChanged(object sender, SelectionChangedEventArgs e) {

  if (e.CurrentSelection != null) {

    await Navigation.PushAsync(new cataloguepage {

      BindingContext = e.CurrentSelection as csv
    });
    
  } else {
    await DisplayAlert("Alert", "No Item Selected", "ok");
  }
}

xaml code(Second page)

<ContentPage.Content>
    <StackLayout Padding="15">
        <Label Text="{Binding prod_name}" TextColor="Black" FontAttributes="Bold" FontSize="Large" Padding="10" HorizontalOptions="Center"/>
        <Label Text="{Binding prod_img}" TextColor="#289" Padding="10"  HorizontalTextAlignment="Center"  FontAttributes="Bold" FontSize="Medium" HeightRequest="200" WidthRequest="100" VerticalTextAlignment="Center"/>
        <Label Text="{Binding prod_price}"  TextColor="Black" FontSize="Medium" HorizontalTextAlignment="Center"/>
        <Label Text="{Binding prod_desc}" TextColor="Black"/>
    </StackLayout>
</ContentPage.Content>

Answer 1

Please try the following code:

private async void listview_SelectionChanged(object sender, SelectionChangedEventArgs e) {

  if (e.CurrentSelection != null) {

    await Navigation.PushAsync(new cataloguepage {
      // modify code as follows
      BindingContext = e.CurrentSelection.FirstOrDefault() as csv
    });
    
  } else {
    await DisplayAlert("Alert", "No Item Selected", "ok");
  }
  
}

Note:

The e.CurrentSelection is a IEmunerable<object> list,so we can not cast it to an object.