WPF 使用自动调整大小的列使行适应网格宽度答案

【问题标题】：WPF fit row to grid width with auto sized columnsWPF 使用自动调整大小的列使行适应网格宽度
【发布时间】：2017-08-07 09:04:18
【问题描述】：

我在将网格行拟合到父网格宽度时遇到问题。所以代码是（表头）：

<Grid Height="Auto" Margin="20" VerticalAlignment="Top" >
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>

    <Label Grid.Column="0" Grid.Row="0" >Word</Label>
    <Label Grid.Column="1" Grid.Row="0" >Class</Label>
    <Label Grid.Column="2" Grid.Row="0" >Match case</Label>
    <Label Grid.Column="3" Grid.Row="0" >Regular expression</Label>
    <Label Grid.Column="4" Grid.Row="0" >Commands</Label>
</Grid>

问题是：如果基于Width="Auto" 的所有列将不适合父网格。我知道我可以通过在其中一列上设置Width="*" 来解决这个问题，但这不是我想要的。

我需要在所有列上自动调整大小以适应网格宽度（可以比计算的行的自动大小大得多）。我该如何存档？

【问题讨论】：

标签： wpf grid width autosize

【解决方案1】：

您可以使用SharedSizeGroup 属性在属于不同Grids 的几个不同ColumnDefinitions 之间共享大小调整属性：https://msdn.microsoft.com/en-us/library/system.windows.controls.definitionbase.sharedsizegroup(v=vs.110).aspx

<Grid Height="Auto" Margin="20" VerticalAlignment="Top" >
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition SharedSizeGroup="a" />
        <ColumnDefinition SharedSizeGroup="b" />
        <ColumnDefinition SharedSizeGroup="c" />
        <ColumnDefinition SharedSizeGroup="d" />
        <ColumnDefinition SharedSizeGroup="e" />
    </Grid.ColumnDefinitions>

    <Label Grid.Column="0" Grid.Row="0" >Word</Label>
    <Label Grid.Column="1" Grid.Row="0" >Class</Label>
    <Label Grid.Column="2" Grid.Row="0" >Match case</Label>
    <Label Grid.Column="3" Grid.Row="0" >Regular expression</Label>
    <Label Grid.Column="4" Grid.Row="0" >Commands</Label>
</Grid>

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition SharedSizeGroup="a" />
        <ColumnDefinition SharedSizeGroup="b" />
        <ColumnDefinition SharedSizeGroup="c" />
        <ColumnDefinition SharedSizeGroup="d" />
        <ColumnDefinition SharedSizeGroup="e" />
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Column="0" Grid.Row="0" TextWrapping="Wrap">Some long word.....</TextBlock>
    <!-- -->
</Grid>

【讨论】：

我只有一个Grid元素，为什么要使用SharedSizeGroup？ “父”是指网格控件，它包含行和列 - 就像在我的示例中一样，仅此而已。
所以你有一个带有几个标签的网格，你想做什么？
我希望标签适合网格的所有宽度，现在标签只占据网格的左侧 - 巨大的空间仍然是空的。
左侧部分？每列都有一个标签，不是吗？我不明白你的问题。您有一个具有 5 列宽度相等的 Grid。每列包含一个标签。再说一遍：你的问题是什么？

【解决方案2】：

如果您不想设置 Width="Auto"，请使用 Viewbox，它可以正确适配网格。

 <Viewbox Stretch="Uniform"  VerticalAlignment="Top">
        <Grid Height="Auto" Margin="20">
            <Grid.RowDefinitions>
                <RowDefinition />
            </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <Label Grid.Column="0" Grid.Row="0" >Word</Label>
            <Label Grid.Column="1" Grid.Row="0" >Class</Label>
            <Label Grid.Column="2" Grid.Row="0" >Match case</Label>
            <Label Grid.Column="3" Grid.Row="0" >Regular expression</Label>
            <Label Grid.Column="4" Grid.Row="0" >Commands</Label>
        </Grid>
 </Viewbox>

【讨论】：

但是 Viewbox 缩放内容而不是调整宽度，导致窗口最大化时字体变大
最好的选择是为所有 ColumnDefinition 设置 Width=""(星号)。即。其他选项是您必须根据窗口大小为标签设置固定宽度。根据窗口大小为所有标签等分宽度。但这可能会在不同的屏幕分辨率下产生问题。我建议您为所有 ColumnDefinition 设置 Width=""。通过设置 width = "" 它将平均分配所有列的空间。