私はこのxamlコードを持っています:
<local:MyGridView x:Name="topDeal" ItemsSource="{Binding}" Margin="60,0,0,0" Grid.Row="1">
<GridView.ItemTemplate>
<DataTemplate>
<Grid Margin="0">
<Grid.Background>
<ImageBrush ImageSource="{Binding image1}"/>
</Grid.Background>
<StackPanel VerticalAlignment="Bottom" Background="#0072B0" Opacity="0.6">
<Border BorderBrush="LightGray" BorderThickness="0,0,0,1"/>
<TextBlock Text="{Binding name}" Foreground="white"/>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid ItemHeight="180" ItemWidth="180" Orientation="Horizontal" MaximumRowsOrColumns="4"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</local:MyGridView>
およびC#コードビハインド:
public class MyGridView : GridView
{
protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
{
var gi = element as GridViewItem;
//First griditem of MyGridView will be modified
if (this.Items.IndexOf(item) == 0)
{
gi.SetValue(VariableSizedWrapGrid.ColumnSpanProperty, 2);
gi.SetValue(VariableSizedWrapGrid.RowSpanProperty, 2);
}
base.PrepareContainerForItemOverride(gi, item);
}
}
最初のアイテムを、背景画像を含む他のアイテムの 2 倍のサイズで表示したいと考えています。この Linkの結果。背景画像は TextBlock でのみ塗りつぶされました。