如何使我的网格列始终具有相同的宽度?

发布于 2024-12-06 17:33:50 字数 2195 浏览 8 评论 0原文

如果我将列的宽度设置为 *,它们最初的宽度相同,但如果某个项目大于允许的数量,那么它将拉伸列宽度。

如何通过显式定义大小来强制我的网格保持其列的大小相同?

我无法使用 UniformGrid,因为此网格正在 ItemsControl 中使用,并且项目需要放置在特定的 Grid.Row/Grid.Column

编辑 这是我当前代码的示例。

<DockPanel>

    <!-- Not showing code here for simplicity -->
    <local:ColumnHeaderControl DockPanel.Dock="Top" />
    <local:RowHeaderControl DockPanel.Dock="Left" />

    <ItemsControl ItemsSource="{Binding Events}">
        <ItemsControl.ItemContainerStyle>
            <Style>
                <Setter Property="Grid.Column" 
                        Value="{Binding DueDate.DayOfWeek, 
                            Converter={StaticResource EnumToIntConverter}}" />
            </Style>
        </ItemsControl.ItemContainerStyle>

        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                </Grid>
            </ItemsPanelTemplate>
        </ItemsPanel>
    </ItemsControl>

</DockPanel>

编辑 #2 这是我的最终解决方案。它使列具有正确的大小,并且在调整应用程序大小时保持正确的大小。

<ColumnDefinition Width="{Binding 
    ElementName=RootControl, 
    Path=ActualWidth, 
    Converter={StaticResource MathConverter}, 
    ConverterParameter=(@VALUE-150)/7}" />

150 是行标题 + 所有边距和边框的宽度。实际上,我正在将我的 MathConverter 更新为 IMultiValueConverter,以便我可以绑定这两个参数(如果您对转换器代码感兴趣,可以找到 此处,尽管它只是单值转换器)

If I set the Column's width to *, they're the same width initially but if an item is larger than the amount allowed then it will stretch the column width.

How can I force my Grid to keep it's columns the same size with explicitly defining a size?

I cannot use a UniformGrid because this Grid is being used in an ItemsControl, and the Items need to be placed in specific Grid.Row/Grid.Column spots

Edit Here's a sample of my current code.

<DockPanel>

    <!-- Not showing code here for simplicity -->
    <local:ColumnHeaderControl DockPanel.Dock="Top" />
    <local:RowHeaderControl DockPanel.Dock="Left" />

    <ItemsControl ItemsSource="{Binding Events}">
        <ItemsControl.ItemContainerStyle>
            <Style>
                <Setter Property="Grid.Column" 
                        Value="{Binding DueDate.DayOfWeek, 
                            Converter={StaticResource EnumToIntConverter}}" />
            </Style>
        </ItemsControl.ItemContainerStyle>

        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                </Grid>
            </ItemsPanelTemplate>
        </ItemsPanel>
    </ItemsControl>

</DockPanel>

Edit #2 Here's my final solution. It makes the columns the correct size, and it keeps the size correct when the application gets resized.

<ColumnDefinition Width="{Binding 
    ElementName=RootControl, 
    Path=ActualWidth, 
    Converter={StaticResource MathConverter}, 
    ConverterParameter=(@VALUE-150)/7}" />

150 is the width of the Row Headers + all margins and borders. I'm actually in the process of updating my MathConverter to an IMultiValueConverter so I can bind both parameters (If you're interested in the Converter code it can be found here, although it's only the single-value converter)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

Saygoodbye 2024-12-13 17:33:50

您可以:

1) 在 DIP 中硬编码大小:

<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
...

2) 使用 SharedSizeGroup,它需要一个 char

<ColumnDefinition SharedSizeGroup="A" />
<ColumnDefinition SharedSizeGroup="A" />
...

您可以阅读有关它的更多信息 此处

You could:

1) Hardcode a size in DIP:

<ColumnDefinition Width="100" />
<ColumnDefinition Width="100" />
...

2) Use SharedSizeGroup, it takes a char

<ColumnDefinition SharedSizeGroup="A" />
<ColumnDefinition SharedSizeGroup="A" />
...

You can read more about it here

南街女流氓 2024-12-13 17:33:50

您可以尝试将列的宽度绑定到一个属性,该属性将窗口的总宽度除以列数

You could try binding the width of your columns to a property that divides the total width of the window by the number of columns

秋风の叶未落 2024-12-13 17:33:50

最干净的方法是使用像这样的 UniformGrid

<UniformGrid Rows="1">
    <Rectangle Fill="Blue" />
    <Rectangle Fill="Yellow" />
    <Rectangle Fill="Red" />
</UniformGrid>

用作 ItemsPanel 时效果非常好。

The cleanest way is to use a UniformGrid like this:

<UniformGrid Rows="1">
    <Rectangle Fill="Blue" />
    <Rectangle Fill="Yellow" />
    <Rectangle Fill="Red" />
</UniformGrid>

Extra nice when used as ItemsPanel.

屋檐 2024-12-13 17:33:50

尝试网格的 IsSharedSizeScope 工作:

<StackPanel Margin="15" Grid.IsSharedSizeScope="True">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto" SharedSizeGroup="B"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="Col 1"/>
        <TextBox Grid.Column="1" />
        <TextBlock Grid.Column="2" Text="3rd column here"/>
    </Grid>

    <Separator Margin="0,20"/>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition />
            <ColumnDefinition SharedSizeGroup="B"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="1"/>
        <TextBox Grid.Column="1"/>
    </Grid>
</StackPanel>

我希望它有所帮助。

有关详细说明,请查看此链接:
https://wpf.2000things.com/tag/sharedsizegroup/

Try the IsSharedSizeScope working of the Grid:

<StackPanel Margin="15" Grid.IsSharedSizeScope="True">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto" SharedSizeGroup="B"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="Col 1"/>
        <TextBox Grid.Column="1" />
        <TextBlock Grid.Column="2" Text="3rd column here"/>
    </Grid>

    <Separator Margin="0,20"/>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
            <ColumnDefinition />
            <ColumnDefinition SharedSizeGroup="B"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Column="0" Text="1"/>
        <TextBox Grid.Column="1"/>
    </Grid>
</StackPanel>

I hope it helps.

For the detail description check this link:
https://wpf.2000things.com/tag/sharedsizegroup/

七禾 2024-12-13 17:33:50

我没有尝试过,但我认为这应该有效:

XAML:

<ColumnDefinition Width="*" Loaded="ColumnDefinition_Loaded"/>

C#:

private void ColumnDefinition_Loaded(object sender, RoutedEventArgs e)
        {
            ((ColumnDefinition)sender).MaxWidth = ((ColumnDefinition)sender).ActualWidth;
        }

I have not tried it, but I think this should work:

XAML:

<ColumnDefinition Width="*" Loaded="ColumnDefinition_Loaded"/>

C#:

private void ColumnDefinition_Loaded(object sender, RoutedEventArgs e)
        {
            ((ColumnDefinition)sender).MaxWidth = ((ColumnDefinition)sender).ActualWidth;
        }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文