Xamarin ListView 为空或未填充

Question

我有问题。我用这样的 ListView 创建了一个 ContentPage：

<?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:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="MyApp.HomePage">
    <ContentPage.Content>
        <StackLayout>
            <ListView x:Name="ListViewMain">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>
                                <Label Text="Employee Name" Grid.Column="1" Grid.Row="0" HorizontalOptions="Start"/>
                                <Image Source="VoteUp.png" VerticalOptions="End" Grid.Row="1" Grid.Column="0"/>
                                <Image Source="VoteDown.png" VerticalOptions="Start" Grid.Row="2" Grid.Column="0"/>
                                <Image Source="{Binding image}" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" Grid.RowSpan="2" BackgroundColor="AliceBlue" VerticalOptions="Fill" HorizontalOptions="Fill"/>
                                <Image Source="Favorite.png" Grid.Row="3" Grid.Column="1" HorizontalOptions="Start"/>
                                <Image Source="Send.png" Grid.Row="3" Grid.Column="1" HorizontalOptions="End"/>
                                <Image Source="Save.png" Grid.Row="3" Grid.Column="2" HorizontalOptions="End"/>
                            </Grid>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

这是页面构造函数：

public HomePage()
{
    InitializeComponent();
    ListViewMain.ItemTemplate = new DataTemplate(typeof(CustomViewCell));
}

这里是 CustomViewCell：

public class CustomViewCell: ViewCell
{
    public CustomViewCell()
    {
        //instantiate each of our views
        var image = new Image();
        image.SetBinding(Image.SourceProperty, "Example_Image.jpg");
    }
}

我将所有图标图片添加到android路径下的drawable文件夹中，但是当我启动应用程序时，整个页面都是空白的，根本没有图片。我做错了什么？

编辑

现在我在 ListView 中添加了一个 ListSource，但是我的结果非常小：

如何使行变大？

Answer 1

在CustomViewCell 中创建image 但从不将其分配给视图层次结构。您也没有正确设置绑定路径 - 您需要在模型上指定公共属性的名称

public CustomViewCell()
{
    //instantiate each of our views
    var image = new Image();
    image.SetBinding(Image.SourceProperty, "name_of_some_property");
    this.View = image;
}

Answer 2

正如杰森所说，我没有看到你的数据源在哪里，CustomViewCell是日期模板，所以你为图像控件分配图像值，它仍然不显示，因为ListView控件是集合控件，你应该分配一个收藏品。

做一个样例，大家可以看看：

 public class CustomViewCell : ViewCell
{
   public CustomViewCell()
    {
        //instantiate each of our views

        var image = new Image() { WidthRequest = 30, HeightRequest = 30 };

        var verticaLayout = new StackLayout();


        //set bindings          
        image.SetBinding(Image.SourceProperty, new Binding("Image"));
        verticaLayout.Children.Add(image);

        // add to parent view

        View = verticaLayout;

        //var image = new Image() { WidthRequest=30,HeightRequest=30};
        //image.SetBinding(Image.SourceProperty, "check.png");
        //this.View = image;
    }


}

public class VeggieViewModel
{ 
    public string Image { get; set; }
}

public partial class Page13 : ContentPage
{
    public ObservableCollection<VeggieViewModel> veggies { get; set; }
    public Page13 ()
    {
        InitializeComponent ();

        veggies = new ObservableCollection<VeggieViewModel>();
        ListViewMain.RowHeight = 60;

        ListViewMain.ItemTemplate = new DataTemplate(typeof(CustomViewCell));
        veggies.Add(new VeggieViewModel { Image = "check.png" });

        veggies.Add(new VeggieViewModel {  Image = "facebook.png" });

        veggies.Add(new VeggieViewModel { Image = "icaon.png" });
        ListViewMain.ItemsSource = veggies;
    }
}