WPF UniformGrid布局

Mic*_*ixx 1 wpf grid layout uniformgrid

我有一个ItemsControl计划主持水果对象列表.我有一个Fruit对象列表都有自己的DataTemplates.我有一个Grape物体,一个Orange物体和一个Kiwi物体.

我想使用a UniformGrid使所有单元格具有相同的大小,但我希望Kiwi对象只跨越1个单元格,我希望Grape跨越2个单元格(ColumnSpan = 2)并且我希望Orange控件跨越4个单元格(ColumnSpan = 2RowSpan = 2)

我怎么能做到这一点?

Rac*_*hel 5

a中的项目UniformGrid不能跨越多个单元格.

为什么不使用常规Grid而不是设置的行/列的高度/宽度,*以便它们都具有相同的大小?如果您希望单元格是高度与宽度匹配的完美正方形,请确保将网格绑定HeightWidth,或反之亦然.

应当注意的是,你需要在应用网格定位性能ItemContainerStyle,而不是项目本身,因为一个ItemsControl包装内的每一个元素ContentPresenter加入该项目的前ItemsPanel(见我的博客文章在这里了解详细信息)

<ItemsControl ItemsSource="{Binding MyCollection}">
    <!-- ItemsPanelTemplate -->
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <!-- ItemContainerStyle -->
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Grid.Column" 
                    Value="{Binding ColumnIndex}" />
            <Setter Property="Grid.Row" 
                    Value="{Binding RowIndex}" />

            <!-- Can either use a DataTrigger to determine these values, 
                 or store them on the object itself -->
            <Setter Property="Grid.RowSpan" 
                    Value="{Binding RowSpan}" />
            <Setter Property="Grid.ColumnSpan" 
                    Value="{Binding ColumnSpan}" />
        </Style>
    </ItemsControl.ItemContainerStyle>
</ItemsControl>
Run Code Online (Sandbox Code Playgroud)