边框控件未填充到网格行宽度答案

【问题标题】：Border control is not filling upto Grid's Row width边框控件未填充到网格行宽度
【发布时间】：2012-08-10 16:57:03
【问题描述】：

我有一个网格控件，它已按列拆分。

<Grid HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
         <ColumnDefinition />
         <ColumnDefinition Width="80" />
         <ColumnDefinition Width="65" />
    </Grid.ColumnDefinitions>
</Grid>

我在第 0 列内有一个边框控件。但是我面临一个问题，即边框控件没有填充到该列的宽度。边框包含一个启用了环绕的文本块。如果 textblock 中的文本大于宽度，则它会被换行并拉伸以填充可用空间。

但是，如果文本块包含仅约 5-10 个字符的小文本，则边框控制不会延伸。

边框控件显式设置为 HorizontalAlignment 和 VerticalAlignment 为 Stretch，Margin 为 0。但边框仍然没有拉伸到第 0 列的可用空间？

【问题讨论】：

你能在这里发布Border的定义吗？

标签： xaml windows-8 microsoft-metro

【解决方案1】：

尝试设置边框的宽度。如果你想让边框占据空间，那么将 ColumnDefinition 设置为 * (First)

【讨论】：

也许是为了诊断一个奇怪的问题，但是明确地设置宽度，你还不如在 WinForms 中开发。
您没有明确设置宽度，它会自动占用空间，以便支持可调整大小的窗口并且 UI 不会混乱。

【解决方案2】：

我相信你的第一栏不可能

<ColumnDefinition />

我认为应该是

<ColumnDefinition Width="*" />

ColumnDefinition.Width 是 GridLength 类型。 GridLength 是一个结构，默认为“自动”。 Auto 将尝试占用其子控件所需的最小空间。 “*”的值表示相对于其他 * 列占用所有空间。（一列 2* 占用的空间是一列 1* 的两倍。我通常建议使用 1 到 100 之间的数字并将它们视为百分比）。由于没有其他列是 * 列，因此简单的“*”值表示占用所有剩余空间。

您会认为通过将所有其他列固定宽度会强制第一列为“*”，但我不认为是这种情况。

您可以在此处阅读有关 GridLength 的更多信息：

http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.gridlength.aspx

【讨论】：

不，默认为Star。

【解决方案3】：

请告诉我们您对边界的定义。它位于星型列中，但您可能已将Border 指定为HorizontalAlignment 或VerticalAlignment，这将否定填充父级内容区域的默认行为。我已验证此示例在 Kaxaml 中运行良好。

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="80"/>
            <ColumnDefinition Width="65"/>
        </Grid.ColumnDefinitions>
        <Border Background="LightGreen"/>
        <TextBlock Grid.Column="1" Foreground="Blue" Text="Column01"/>
        <TextBlock Grid.Column="2" Foreground="Red" Text="Column02"/>
    </Grid>
</Page>

【讨论】：

【解决方案4】：

  <DataGridTemplateColumn Width="150">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Border HorizontalAlignment="Stretch"
                                    VerticalAlignment="Stretch"
                                    BorderBrush="Red"
                                    BorderThickness="2">
                                <TextBlock Text="{Binding Name}" />
                            </Border>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

【讨论】：

就我而言，我不必使用 DataGrid 控件...它是一个简单的网格，我将其放置在页面上