在Xamarin.Forms中实现水平GridView时，我应该采取什么方法？

Question

我需要实现水平（杂志样式）列表。在我看来，这样做非常好的应用程序是Flipboard和Zite。我想知道是否可以使用现有资源将其实现到Xamarin.Forms应用程序中。

在Xamarin.Forms中，你有View的优秀ListView。此ListView具有ItemSource和ItemTemplate属性，您可以将ViewModel绑定到ItemSource，并且可以将TextCell类绑定到ItemTemplate。

我正在搜索完全相同的东西，除了你可以将ItemTemplate修改为我自己制作的自定义类。我需要这个的原因是我需要一个比TextCell更复杂的布局，ListView只能垂直滚动。

我非常喜欢MVVM模式，我需要一些完全适合这种模式的东西。现在，我研究了一些实现：

• https://github.com/XLabs/Xamarin-Forms-Labs
• http://forums.xamarin.com/discussion/18627/gridview-with-itemssource

选项1

在Xamarin.Forms.Labs中，有一个GridView，但是这个视图在我的实现中没有扩展到它的父级，尽管我设置了以下内容：

var grid = GridView {
    ItemWidth = 50,
    ItemHeight = 50,
    HorizontalOptions = LayoutOptions.FillAndExpand,
    VerticalOptions = LayoutOptions.FillAndExpand
};

我的ItemSource与我的ViewModel绑定（我100％确定它提供了项目。我知道，因为如果我将GridView交换为ListView，则有项目。）：

grid.ItemSource = ViewModel.Items;

我的ItemTemplate：

var cell = new DataTemplate(typeof(TextCell));
            cell.SetBinding(TextCell.TextProperty, "Title");
            cell.SetBinding(TextCell.TextProperty, "Description");
            gridView.ItemTemplate = cell;

现在，我知道GridView存在一些问题，根据this，该实现仅适用于iOS。

选项2

在第二篇文章中，他们提到WrapLayout。虽然它显示了一些通过其Children属性添加的项目，但它没有显示任何MVVM实现。除此之外，实施还远没有完成。

我可以将这个项目作为基础并将其扩展到我的需求。但我觉得必须要做很多工作才能在我的场景中工作。

有没有人知道哪种其他资源比这两种更适合我的需求？如果没有可用的资源，我应该选择哪个选项（我知道自Zite和Flipboard已经完成以来必须有一些可用的东西）？

Answer 1

我不知道flipboard或zite，但你尝试的可能是这样的。

var grid = new Grid()
{
    VerticalOptions = LayoutOptions.FillAndExpand,
    ColumnDefinitions = new ColumnDefinitionCollection()
    {
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) },
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) },
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) },
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) },
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) },
        new ColumnDefinition(){ Width = new GridLength(250, GridUnitType.Absolute) }
    },
    RowDefinitions = new RowDefinitionCollection()
    {
        new RowDefinition(){ Height = new GridLength(1,GridUnitType.Star) },
        new RowDefinition(){ Height = new GridLength(1,GridUnitType.Star) },
        new RowDefinition(){ Height = new GridLength(1,GridUnitType.Star) }
    }
};
var scrollview = new ScrollView() { Orientation = ScrollOrientation.Horizontal };
scrollview.Content = grid;