我写这个儿童游戏(记忆),并有一个列表的瓷砖(列表),我绑定到一个包裹面板内的项目控制。现在我有22个贴图,它们在中间排成两行。
我真正想要的是将其排列在屏幕中心的5x5矩阵中,因此它可以根据tile的数量进行缩放。我不能得到瓷砖显示正确,当使用统一的网格,尺寸是非常小的,在我的屏幕左上角。当我设置列和行属性时,它不会显示出来,就好像它在边界之外。有人能帮忙吗?
XAML:<Window x:Class="MemoryWPF.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style TargetType="Button" x:Key="TransparentButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="Transparent">
<ContentPresenter/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<UniformGrid Columns="5" Rows="5">
<UniformGrid.Background>
<ImageBrush x:Name="backBrush"/>
</UniformGrid.Background>
<ItemsControl ItemsSource="{Binding Tiles}" VerticalAlignment="Center" HorizontalAlignment="center" Margin="100">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button Style="{StaticResource TransparentButton}" BorderThickness="0" Padding="-4" Command="{Binding TurnTileCommand}" Opacity="{Binding OpacityVal}" Margin="10">
<Image Width="150" Height="150" Source="{Binding ImageUri}"/>
</Button>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
<TextBlock Text="{Binding AmountTilesLeft}" VerticalAlignment="Bottom" FontSize="15"/>
</UniformGrid>
</Window>
你把ItemsControl
在一个UniformGrid
(这就是为什么控制是如此之小),但统一的网格应该是内部的ItemsControl
作为它的ItemsPanel
(目前是一个WrapPanel
)。
<ItemsControl ItemsSource="{Binding Tiles}" VerticalAlignment="Center" HorizontalAlignment="center" Margin="100">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button Style="{StaticResource TransparentButton}" BorderThickness="0" Padding="-4" Command="{Binding TurnTileCommand}" Opacity="{Binding OpacityVal}" Margin="10">
<Image Width="150" Height="150" Source="{Binding ImageUri}"/>
</Button>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="5" Rows="5">
<UniformGrid.Background>
<ImageBrush x:Name="backBrush"/>
</UniformGrid.Background>
</UniformGrid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>