我创建了一个带有项目模板和标题模板的Grouped GridView.它运作良好,但我希望我的列表的第一篇文章有一个不同的模板(更大).就像法国应用程序“LeMonde”一样.我不知道如何定义模板来实现这一目标.
这是我目前的xaml代码
<Page.Resources> <CollectionViewSource x:Name="cvs1" IsSourceGrouped="True" /> </Page.Resources> <Grid Background="White"> <GridView x:Name="PicturesGridView" SelectionMode="None" ItemsSource="{Binding Source={StaticResource cvs1}}"IsItemClickEnabled="True" ItemClick="ItemView_ItemClick"> <GridView.ItemTemplate> <DataTemplate> <StackPanel x:Name="RectanglesStackPanel" Margin="8" Orientation="Vertical" Width="242"> <Image Source="{Binding imageUrl}" Height="180" Width="225" Stretch="UniformToFill" /> <Border Background="Gray" Opacity="1" Width="225" Height="115"> <TextBlock Text="{Binding title}" Foreground="White" TextWrapping="Wrap" Width="215" FontSize="18" /> </Border> </StackPanel> </DataTemplate> </GridView.ItemTemplate> <GridView.ItemsPanel> <ItemsPanelTemplate> <StackPanel Orientation="Horizontal" /> </ItemsPanelTemplate> </GridView.ItemsPanel> <GridView.GroupStyle> <GroupStyle> <GroupStyle.HeaderTemplate> <DataTemplate> <Button Click="Button_Click_1" Content="{Binding Key}" Foreground="Black" Background="White" FontSize="30" Margin="0,-10" ></Button> </DataTemplate> </GroupStyle.HeaderTemplate> <GroupStyle.Panel> <ItemsPanelTemplate> <VariableSizedWrapGrid Orientation="Vertical" /> </ItemsPanelTemplate> </GroupStyle.Panel> </GroupStyle> </GridView.GroupStyle> </GridView> </Grid>
我只是在C#中绑定我的项目列表,如下所示:
this.cvs1.Source = ListOfArticle;
先感谢您 :)
谢谢伊万.它对我有很大的帮助.但是,示例中提供的代码对于Windows 8来说似乎不是最新的.您对如何访问页面资源中定义的模板有任何想法吗? FindRessources方法不再存在.我尝试使用此代码,但它没有成功:
public class AuctionItemDataTemplateSelector : DataTemplateSelector { protected override DataTemplate SelectTemplateCore(object item,DependencyObject container) { FrameworkElement element = container as FrameworkElement; if (element != null && item != null && item is Article) { Article auctionItem = item as Article; DataTemplate mySmallTemplate = element.FindName("SmallTemplate") as DataTemplate; switch (auctionItem.isFirstItem) { case true: return element.FindName("BigTemplate") as DataTemplate; case false: return element.FindName("SmallTemplate") as DataTemplate; } } return null; } }
“
我按照创建自定义DataTemplateSelector的方式,将所有需要的模板作为属性.
namespace Helper { public class CustomSampleDataTemplateSelector : DataTemplateSelector { public DataTemplate FirstDataTemplate { get; set; } public DataTemplate SecondDataTemplate { get; set; } protected override DataTemplate SelectTemplateCore(object item,DependencyObject container) { if (item is FirstItemType) return FirstDataTemplate ; if (item is SecondItemType) return SecondDataTemplate; else return FirstDataTemplate ; } } }
现在你可以直接在XAML中使用它,如下所示:
申报资源:
<UserControl.Resources> <DataTemplate x:Key="myTemplate1"> <Border Background="White"> <TextBlock Text="{Binding Name}" FontSize="40" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Border> </DataTemplate> <DataTemplate x:Key="myTemplate2"> <Border Background="Orange"> <Grid> <Image Source="{Binding Image}"></Image> <TextBlock Text="{Binding ShopName}" FontSize="64" Foreground="LightBlue" HorizontalAlignment="Center" VerticalAlignment="Center" /> </Grid> </Border> </DataTemplate> <Common:CustomSampleDataTemplateSelector x:Key="mySelector" FirstDataTemplate="{StaticResource myTemplate1}" SecondDataTemplate="{StaticResource myTemplate2}"> </Common:CustomSampleDataTemplateSelector > </UserControl.Resources>
用它
<GridView x:Name="PicturesGridView" ItemTemplateSelector="{StaticResource mySelector}">
就这样