我正在尝试将一些项目绑定到我的网格视图,但我也想将它们分组。首先,我的 xaml 看起来像这样;
<Page.Resources>
<!-- TODO: Delete this line if the key AppName is declared in App.xaml -->
<x:String x:Key="AppName">Header</x:String>
<CollectionViewSource x:Name="itemsViewSource" IsSourceGrouped="True" Source="{Binding Items}"/>
<DataTemplate x:Key="DataTemplate1">
<Grid HorizontalAlignment="Left" Width="168" Height="157">
<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Image Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
</Border>
<StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}" Height="48">
<TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="59" Margin="16,0,7,0" FontSize="16" FontFamily="Andy"/>
</StackPanel>
</Grid>
</DataTemplate>
</Page.Resources>
<!--
This grid acts as a root panel for the page that defines two rows:
* Row 0 contains the back button and page title
* Row 1 contains the rest of the page layout
-->
<Grid x:Name="grd" Style="{StaticResource LayoutRootStyle}">
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemsGridView"
AutomationProperties.Name="Items"
TabIndex="1"
Grid.RowSpan="2"
Padding="116,136,116,46"
ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
ItemTemplate="{StaticResource DataTemplate1}"
SelectionMode="None"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick">
<GridView.Background>
<ImageBrush ImageSource="Assets/bg4.jpg"/>
</GridView.Background>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Margin="1,0,0,6">
<Button
AutomationProperties.Name="Group Title"
Style="{StaticResource TextPrimaryButtonStyle}" Content="" />
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid Orientation="Vertical" Margin="0,0,80,0"/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
<!-- Back button and page title -->
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
<TextBlock x:Name="pageTitle" Grid.Column="1" Style="{StaticResource PageHeaderTextStyle}" FontFamily="Buxton Sketch" FontSize="60" Foreground="#DEFFFFFF" Margin="0,0,30,44">
<Run Foreground="#DE316191" Text="Merak"/>
<Run FontSize="48" Text=" "/>
<Run Foreground="#DEFDFDFD" Text="Edilen"/>
<Run FontSize="48" Text=" "/>
<Run Foreground="#DE3F6B97" Text="Şeyler"/>
</TextBlock>
</Grid>
<VisualStateManager.VisualStateGroups>
<!-- Visual states reflect the application's view state -->
<VisualStateGroup x:Name="ApplicationViewStates">
<VisualState x:Name="FullScreenLandscape"/>
<VisualState x:Name="Filled"/>
<!-- The entire page respects the narrower 100-pixel margin convention for portrait -->
<VisualState x:Name="FullScreenPortrait">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="backButton" Storyboard.TargetProperty="Style">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PortraitBackButtonStyle}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<!-- The back button and title have different styles when snapped -->
<VisualState x:Name="Snapped">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="backButton" Storyboard.TargetProperty="Style">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SnappedBackButtonStyle}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="pageTitle" Storyboard.TargetProperty="Style">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SnappedPageHeaderTextStyle}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
有了这个,我可以用这个代码创建组;
public class Item
{
public string Title { get; set; }
public string Description{ get; set; }
public string Image { get; set; }
}
List<List<Item>> total = new List<List<Item>>();
List<Item> lst = new List<Item>();
public void AddGroups()
{
Item first= new Item();
first.Title = "asdf";
first.Description = "asdaf";
first.Image = "aswdfa";
lst.Add(first);
total.Add(lst);
}
使用此代码,我可以添加没有标题文本的组,但我需要标题文本,没有它我什么也做不了。所以我试图制作另一个自定义类,并将这个新列表绑定到gridview。我试图创建一个这样的类然后绑定这个类的列表,但是它不起作用,显示一个没有任何项目的空白屏幕;
public class grp
{
private List<Item> bilg;
public grp(List<Item> bilg)
{
this.bilg = bilg;
}
}
我不知道第二类可能是完全错误的。这是一个 Windows 应用商店应用程序,我使用的是 xaml 和 c#。感谢您的帮助。
tl;博士我正在尝试制作一个带有组名的组的网格视图。