如何修复 xamarin.forms 移动应用程序页面中的空列表视图

Question

我正在学习将 Xamarin.Forms 与 prism 一起使用，我想用列表中每个对象的特定项目填充列表视图。我的列表视图显示为空，但我没有看到任何错误。

我已经尝试使用绑定来绑定到我的对象中的名称变量，在我的列表中。那显示是空的，所以我尝试使用 Observable Collection 来获取我的列表并添加每个名称。

这是动物对象模型

using System;
namespace LearningPrism.Models
{
    class Animal
    {
        public string Name { get; set; }
        public int Age { get; set; }
        public decimal Happiness { get; set; }

        public void PrintBase()
        {
            Console.WriteLine($"Name: {Name}");
            Console.WriteLine($"Age: {Age}");
            Console.WriteLine($"Happy: {Happiness}");
            Console.WriteLine();
        }
    }
}

我使用 Breed class 作为对象创建我的列表，并有 3 个函数用于获取类型的过滤列表（未过滤以获取所有品种）。

namespace LearningPrism.Models
{
    class Breed
    {

        public static List<Animal> _breedList = new List<Animal>
            {
                new Animal
                {
                    Id = Guid.NewGuid().ToString(),
                    Name = "Greyhound",
                    Type = BreedType.Dog
                },

//There are 3 more Dog Animal breeds but I have removed them so it is easier to read

                new Animal
                {
                    Id = Guid.NewGuid().ToString(),
                    Name = "Bengal",
                    Type = BreedType.Cat
                }, 

//There are 3 more Cat Animal breeds but I have removed them so it is easier to read

                }
            };

        public static List<Animal> GetAllBreeds()
        {
            return _breedList;
        }

        public static List<Animal> GetBreedsByType(BreedType type)
        {

            switch (type)
            {
                case BreedType.Dog:
                    return (from Animal in _breedList where Animal.Type == BreedType.Dog select Animal).ToList();

                case BreedType.Cat:
                    return (from Animal in _breedList where Animal.Type == BreedType.Cat select Animal).ToList();

                default:
                    return _breedList;

            }
        }
    }
}

这是我的视图模型：

namespace LearningPrism.ViewModels
{
    public class PageAViewModel : ViewModelBase
    {
        private List<Breed> MyList { get; set; }

        public PageAViewModel(INavigationService navigationService) : base(navigationService)
        {
            Title = "Hello Human";
        }

        private void LoadData()
        {

            ObservableCollection<Animal> myData = new ObservableCollection<Animal>(Breed.GetAllBreeds() as List<Animal>);

        }

        public override void OnNavigatingTo(INavigationParameters parameters)
        {
            base.OnNavigatingTo(parameters);

            LoadData();
        }
    }
}

这是页面的 XAML 代码

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             prism:ViewModelLocator.AutowireViewModel="True"
             x:Class="LearningPrism.Views.PageA" Title="{Binding Title}">

    <Label Text="{Binding Title}" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" />

    <StackLayout>

        <ListView HorizontalOptions="FillAndExpand" 
                  VerticalOptions="FillAndExpand" 
                  ItemsSource="{Binding myData}">

            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackLayout HorizontalOptions="CenterAndExpand">
                        <Label Text="{Binding Breed.Name}" TextColor="Black"></Label>
                    </StackLayout>
                </DataTemplate>
            </ListView.ItemTemplate>

        </ListView>

    </StackLayout>

</ContentPage>

Answer 1

首先，要将 ListView 绑定到 myData，myData 必须是 public 属性。

public ObservableCollection<Animal> myData { get; set; }

如果列表中的每个项目都是 Animal，那么您的绑定路径将为 Text="{Binding Name}"，因为 Name 是 Animal 的属性。没有Breed属性.

Answer 2

正如杰森上面提到的

你属性:

private List<Breed> MyList { get; set; }

应该是public。如果您使用棱镜来使用属性更改事件，我还建议您：将您的属性更改为：

private List<Breed> _myList;
    public List<Breed> MyList
    {
        get { return _myList; }
        set { _myList = value; RaiseOnPropertyChanged(); }
    }

然后将您的列表 XAML 更改为：

<ListView HorizontalOptions="FillAndExpand" 
              VerticalOptions="FillAndExpand" 
              ItemsSource="{Binding MyList}">
        <ListView.ItemTemplate>
            <DataTemplate>
              <ViewCell>
                 <StackLayout HorizontalOptions="CenterAndExpand">
                     <Label Text="{Binding Name}" TextColor="Black"> 
                     </Label>                  
                </StackLayout>
              </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

如何修复 xamarin.forms 移动应用程序页面中的空列表视图

How to fix an empty listview in xamarin.forms mobile app page

c#

xaml

listview

prism

xamarin.forms