WPF：如何实现带有单元格间距的自定义网格？

Question

WPF：如何实现带有单元格间距的自定义网格？

6

我想在WPF中实现类似于HTML-cellspacing的效果。我试图通过创建一个自定义的Grid类来覆盖Grid，并修改MeasureOverride和ArrangeOverride以获得所需的行为。即网格中的每个单元格应该与其他单元格有固定的间距（而不是填充）。如何实现这一点？

- Andreas Zita

4个回答

3

我找到了一篇关于创建自定义网格面板并处理单元格间距的博客文章：http://daniel-albuschat.blogspot.dk/2011/07/gridlayout-for-wpf-escape-margin-hell.html

- Pete

0

您可能会对我在这里的答案感兴趣，它支持自定义网格中每个子元素的统一边框和单元格间距：

如何在WPF中为我的网格控件添加边框？

- dexiang

-2

你需要查找 Margin 属性。你可以对 DataGridCell 类进行样式设置。

<Style TargetType="{x:Type toolkit:DataGridCell}">
        <Setter Property="Margin" Value="3" />
    </Style>

- hyp

我没有使用DataGrid，而是使用了Grid-layoutpanel。 - Andreas Zita

哦，抱歉，那么您可以使用样式在列/行上设置边距。 - hyp

不，ColumnDefinition没有Margin属性。我也不想在每个子元素上使用Margin。我想要一个通用的解决方案，这就是为什么我想重写Measure和Arrange方法。 - Andreas Zita

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Joe White · Accepted Answer

你可能可以编写自己的面板，或者甚至是一个Grid的后代，以使用单元格间距进行布局。这需要相当多的工作。

以下是我通常做的事情，以实现相同的效果。假设我想要一个3像素的单元格间距。您可以通过对每个单元格应用1.5像素的边距来实现这一目标（因此单元格与其相邻单元格之间的总空间为1.5 + 1.5 = 3像素），然后在整个Grid周围再添加1.5像素的边距，以使外部边距正确（1.5像素的单元格周围边距+ 1.5像素的Grid周围边距= 3像素）。XAML如下所示：

<Grid Margin="1.5">
    ...
    <Label Grid.Row="0" Grid.Column="0" Margin="1.5">...</Label>
    <TextBox Grid.Row="0" Grid.Column="1" Margin="1.5">...</TextBox>
    ...
</Grid>

“它很丑，但能用。”

“如果您的网格中大多数控件都是相同类型的（例如，如果全部都是标签或标签和文本框），则可以使用样式，而不是在网格中的每个元素上声明和重新声明边距：”

<Grid Margin="1.5">
    <Grid.Resources>
        <Style TargetType="Label">
            <Setter Property="Margin" Value="1.5"/>
        </Style>
        <Style TargetType="TextBox">
            <Setter Property="Margin" Value="1.5"/>
        </Style>
    </Grid.Resources>
    ...
    <Label Grid.Row="0" Grid.Column="0">...</Label>
    <TextBox Grid.Row="0" Grid.Column="1">...</TextBox>
    ...
</Grid>

实际上，我在实践中发现我经常需要不均匀的边距 - 例如，我可能希望在顶部、左侧和右侧周围有3像素的边距，但底部没有边距（因为下面的控件已经有自己的边距）。所以我通常不会使用1.5像素的全周边距；我通常会得到更复杂的东西。所以我能理解为什么他们没有添加CellSpacing；它会使简单的情况更简单，但在更复杂的布局中则没有用处。

但是，四个半边距是实现CellSpacing的一种快速方法，然后如果需要更复杂的东西，您可以调整边距。