Xamarin表单 - 如何使用ListVIew

时间:2014-08-17 01:39:08

标签: xamarin.forms

我正在尝试使用我制作的自定义单元填充列表视图。我知道如何使用tableview,但我不知道如何使用listview。请有人向我解释,谢谢

1 个答案:

答案 0 :(得分:0)

请原谅非常粗略的代码片段,但这只是解释listviews和数据绑定背后的概念。

在下面的示例中,我创建了一个listview,分配了一个自定义viewCell并将视图单元格绑定到模型。模型数据由从服务器检索的XML数据填充(为简单起见,代码发出)。如果您需要带有硬编码数据的列表视图,则可以执行更简单的实现。

我建议阅读http://developer.xamarin.com/guides/cross-platform/xamarin-forms/introduction-to-xamarin-forms/并研究MVVM原则

此外,我发现的最佳示例代码是James Montemagno编写的启发性应用程序https://github.com/jamesmontemagno/Hanselman.Forms

public TestPage()
  {

     private ListView listView; // Create a private property with the Type of Listview named listview
     listView = new ListView(); //Instantiate the listview 
     var viewTemplate = new DataTemplate(typeof(CustomViewCell)); //Create a variable for the custom data template
     listView.ItemTemplate = viewTemplate; // set the data template to the variable created above 

 this.Content = new StackLayout()
  {
    Children = {
    listView
  }
};

}

自定义视图单元格:

public class CustomViewCell : ViewCell
{
    public CustomViewCell()
    {

        Label Test = new Label()
        {
            Font = Font.BoldSystemFontOfSize(17),
            TextColor = Helpers.Color.AppGreen.ToFormsColor(),
            BackgroundColor = Color.White
        };

        var image = new Image();
        image.Source = ImageSource.FromFile("testing.png");

        Label Test2 = new Label();

        tour_Desc.SetBinding(Label.TextProperty, "Test");
        round_Desc.SetBinding(Label.TextProperty, "Test2");

        var grid = new Grid
        {
            VerticalOptions = LayoutOptions.FillAndExpand,

            RowDefinitions = 
            {
                new RowDefinition {Height = GridLength.Auto },
                new RowDefinition {Height = GridLength.Auto },
                new RowDefinition {Height = 1}
            },
            ColumnDefinitions = 
            {
                new ColumnDefinition {Width = GridLength.Auto},
                new ColumnDefinition {Width = new GridLength(1, GridUnitType.Star)},
                new ColumnDefinition {Width = 80 }
            }
            ,BackgroundColor = Color.White,
        };

        grid.Children.Add(image, 0, 0);
        Grid.SetRowSpan(image, 2);

        grid.Children.Add(tour_Desc, 1, 0);
        Grid.SetColumnSpan(tour_Desc, 2);

        grid.Children.Add(Test, 1, 1);
        grid.Children.Add(Test2, 1, 2);

        this.View = grid;
    }

}

查看型号:

public partial class GamesResult
{
    public string Test { get; set; }

    public string Test1 { get; set; }
}