Xamarin Forms 即使設置了綁定並將數據添加到可觀察的集合中，集合視圖也不會在 UI 上顯示任何內容

Question

我是一個初學者，所以請放輕松。 我有一個綁定到可觀察集合的集合視圖。 可觀察集合接收數據並具有項目，但 Collectionview 根本不顯示任何內容。 有人可以幫我解決這個問題。 謝謝。

XAML

        <CollectionView Grid.Row="1" ItemsSource="{Binding Fav}" x:Name="CVWatchItems" SelectionMode="Single" SelectionChanged="CVWatchItems_SelectionChangedAsync">
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <StackLayout Padding="8, 8, 8, 0">
                        <Frame BorderColor="LightGray" CornerRadius="0" HasShadow="True" Padding="5">
                            <Grid Padding="0" ColumnSpacing="0" RowSpacing="0" Margin="2">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="120"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>

                                <ffimageloading:CachedImage Source="{Binding SingleimageUrl}" Aspect="AspectFill" WidthRequest="120" HeightRequest="100" Grid.Row="0" Grid.Column="0"/>

                                <Grid Grid.Row="0" Grid.Column="1" Padding="5">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto"/>
                                        <RowDefinition Height="Auto"/>
                                        <RowDefinition Height="*"/>
                                    </Grid.RowDefinitions>
                                    <Label Padding="0, 0, 0, 3" Text="{Binding Title}" LineBreakMode="TailTruncation" TextColor="Black" FontSize="Medium" Grid.Row="0"/>
                                    <Label Text="{Binding Price, StringFormat='Nu.{0}'}" FontSize="Small" TextColor="Black"  Grid.Row="1"  HorizontalOptions="StartAndExpand" />
                                    <Grid Grid.Row="2">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="7*"/>
                                            <ColumnDefinition Width="Auto"/>
                                        </Grid.ColumnDefinitions>

                                        <Label Text="{Binding location}" FontSize="Small" TextColor="Gray" Grid.Column="0" HorizontalOptions="StartAndExpand" VerticalOptions="EndAndExpand"/>
                                        <!--Watchlist Icon-->
                                        <Image Source="{Binding Favorite}" Grid.Column="1" Aspect="AspectFill" HeightRequest="28" Margin="2, 0" HorizontalOptions="EndAndExpand" VerticalOptions="EndAndExpand">
                                            <Image.GestureRecognizers>
                                                <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
                                                <!--Give ID to each ad and stored data is retrieved through id.-->
                                            </Image.GestureRecognizers>
                                        </Image>
                                    </Grid>
                                </Grid>

                            </Grid>
                        </Frame>
                    </StackLayout>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

背后的代碼

   public static ObservableCollection<Item> Fav { get; set; } = new ObservableCollection<Item>();
   public Watchlist ()
    {
        InitializeComponent ();
        NavigationPage.SetHasNavigationBar(this, false);
        NavigationPage.SetHasBackButton(this, false);

        CVWatchItems.SetBinding(CollectionView.ItemsSourceProperty, nameof(Fav));

        GetFavItems();
    }  

    private async void GetFavItems()
    {
        var MyFavorites = await Task.WhenAll(FirebaseDataHelper.GetFavoriteItems(allFavorites));
        
                foreach (var favorite in MyFavorites)
                {
                    if (favorite.Count > 0)
                    {
                        for (int i = 0; i < favorite.Count; i++)
                        {
                            favorite[i].IsFavorite = true;
                            if (!Fav.Any(s => s.Id == favorite[i].Id))
                                Fav.Add(favorite[i]);
                                
                        }
                    }
                }

               
      }

多謝你們。

Answer 1

首先，您的可觀察集合是 static 並且您從未將 BindingContext 設置為您的頁面。

public static ObservableCollection<Item> Fav { get; set; } = new ObservableCollection<Item>();

從 Fav 的定義中刪除 static 關鍵字，更改 XAML 中的綁定（`為您的頁面分配名稱），如：

<ContentPage x:Name="Root" ..../>

<CollectionView Grid.Row="1" ItemsSource="{Binding Source={x:Reference Name=Root}, Path=Fav}" ..../>

還要從后面的代碼中刪除綁定。 最后一件事，你的頁面必須實現 INotifyPropertyChanged 接口，因為你必須告訴頁面這個集合發生了變化（你的集合在你的異步任務完成后被填充）所以你必須在你的集合被填充后引發PropertyChanged 。

但也許在您的情況下，不使用綁定設置 ItemsSource 會更好更容易，因為您沒有使用MVVM 。 如果您在頁面后面的代碼中，則無需使用綁定。 您可以設置collectionview itemsource，如：

 private async void GetFavItems()
    {
        var MyFavorites = await Task.WhenAll(FirebaseDataHelper.GetFavoriteItems(allFavorites));
        
                foreach (var favorite in MyFavorites)
                {
                    if (favorite.Count > 0)
                    {
                        for (int i = 0; i < favorite.Count; i++)
                        {
                            favorite[i].IsFavorite = true;
                            if (!Fav.Any(s => s.Id == favorite[i].Id))
                                Fav.Add(favorite[i]);
                                
                        }
                    }
                }

               CVWatchItems.ItemsSource = Fav;
      }

如果您將在應用程序中使用 MVVM，您應該使用綁定。