以编程方式创建具有全屏项目的 GridView答案

【问题标题】：Programmatically create a GridView with full screen items以编程方式创建具有全屏项目的 GridView
【发布时间】：2014-10-14 21:35:44
【问题描述】：

我需要为具有全屏图像项的 Windows 应用商店应用程序创建一个水平列表视图，类似于 Android 的 Gallery 控件。为此，我使用了GridView 并将ItemsPanel 模板更改为水平方向的VirtualizingStackPanel。问题是我无法将图像项目设为全屏。我尝试的是使GridView.ItemContainerStyle 绑定到GridView 的宽度，如下所示：

Binding widthBinding = new Binding() { Source=iconsHolder, Path = new PropertyPath("Width"), Converter = new TestItemWidthConverter()};

Style itemStyle  = new Style();
itemStyle.TargetType = typeof(GridViewItem);
itemStyle.Setters.Add(new Setter(GridViewItem.WidthProperty, widthBinding));// 800));

iconsHolder.ItemContainerStyle = itemStyle;

例如，当我用 800 替换 widthBinding 时，图标具有指定的宽度，但是当我使用绑定时，没有项目可见，所以 Style 完成了它的工作，但 Binding 有一个问题。为了调试这个，我创建了一个假转换器，所以我可以查看绑定是否有效，但是根本没有调用 Convert(..) 方法。

我的 GridView 是这样创建的：

GridView iconsHolder = new GridView();
iconsHolder.ItemsPanel = App.Current.Resources["HorizontalVSPTemplate"] as ItemsPanelTemplate;
iconsHolder.ItemTemplate = App.Current.Resources["MyDataTemplate"] as DataTemplate;
iconsHolder.Width = Window.Current.Bounds.Width;
iconsHolder.Height = Window.Current.Bounds.Height;

我的资源定义如下：

<ItemsPanelTemplate x:Key="HorizontalVSPTemplate">
   <VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
<DataTemplate x:Key="MyDataTemplate">
   <Image Source="some irrelevant url here"/>
</DataTemplate>

我的转换器如下所示：

public sealed class TestItemWidthConverter : IValueConverter
{
   public object Convert(object value, Type targetType, object parameter, string language)
   {
      Debug.WriteLine(" binding width=" + value);
      return value;
   }

   public object ConvertBack(object value, Type targetType, object parameter, string language)
   { return value; }
}

我不知道如何实现这一点（我也尝试过使用RelativeBinding 或使图标水平拉伸，但没有成功）或者我做错了什么，所以请帮忙！感谢您的宝贵时间！

【问题讨论】：

标签： c# gridview data-binding winrt-xaml windows-store

【解决方案1】：

我发现我走错了路，正确的做法是使用FlipView，就这么简单

FlipView iconsHolder = new FlipView();
iconsHolder.ItemsSource =  myItems;
iconsHolder.ItemTemplate = App.Current.Resources["MyDataTemplate"] as DataTemplate;

现在我的图标默认是全屏的，滚动效果是分页的。可以在此处找到有关此控件的一些有用详细信息：Quickstart: Adding FlipView controls 。

【讨论】：