如何确保包装面板内每个项目的边距是否相同?

时间:2016-05-20 11:15:35

标签: c# wpf xaml

我有一个ItemsControl,它有一个WrapPanel作为其ItemsPanelTemplate。我正在尝试组织一组按钮,以便每个按钮在其左侧和右侧具有相同的边距。这是我到目前为止的代码:

 <ScrollViewer HorizontalAlignment="Stretch" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
            <ItemsControl HorizontalAlignment="Stretch" ItemsSource="{Binding SystemData.PlayersList}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Border BorderThickness="1" BorderBrush="Gray" Margin="5">
                            <Button Width="180"
                        Style="{Styles:MyStyleRef ResourceKey=BrowserItemStyle}">
                                <DockPanel LastChildFill="True">
                                    <Image Source="{Binding Icon}" Style="{Styles:MyStyleRef ResourceKey=DriveImageStyle}"/>
                                    <Label HorizontalAlignment="Left" Content="{Binding Name}" Style="{Styles:MyStyleRef ResourceKey=DriveLabelStyle}"/>
                                </DockPanel>
                            </Button>
                        </Border>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>

以下是它的外观:

enter image description here

当我将WrapPanel的Horizo​​ntalAlignment设置为'Center'时,我更接近我想要的结果。

enter image description here

我希望每个Item在其两侧都有相同的边距,以便创建一个统一的控件网格 - 这可能吗?

此致,蒂姆。

1 个答案:

答案 0 :(得分:0)

好了解决了......我完全看着统一的网格控件。

现在是我的代码:

  <ScrollViewer HorizontalAlignment="Stretch" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
                <ItemsControl HorizontalAlignment="Stretch" VerticalAlignment="Top" ItemsSource="{Binding SystemData.PlayersList}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Columns="6"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border BorderThickness="1" BorderBrush="Gray" Margin="5" Height="40">
                                <Button 
                            Style="{Styles:MyStyleRef ResourceKey=BrowserItemStyle}">
                                    <DockPanel LastChildFill="True">
                                        <Image Source="{Binding Icon}" Style="{Styles:MyStyleRef ResourceKey=DriveImageStyle}"/>
                                        <Label HorizontalAlignment="Left" Content="{Binding Name}" Style="{Styles:MyStyleRef ResourceKey=DriveLabelStyle}"/>
                                    </DockPanel>
                                </Button>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </ScrollViewer>

enter image description here