将 WPF 控件设置为扩展以填充可用空间，仅此而已

发布于 2024-08-02 17:26:00 字数 927 浏览 6 评论 0原文

如何设置 WPF 控件来填充其父级容器中的可用空间，但不展开父级？

以下代码片段描述了我正在尝试的布局。我希望 Grid 能够拉伸以容纳 Expander，并且我希望 ListBox 仅填充 Grid >。我希望当 Grid 太小而无法显示所有 ListBoxItem 时，显示 ListBox 的滚动条。

<ScrollViewer>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
        </Grid.RowDefinitions>
        <ListBox Grid.Row="0" Grid.Column="0" />
        <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
    </Grid>
</ScrollViewer>

目前发生的情况是 Grid 拉伸以适合整个 ListBox，并且出现外部 ScrollViewer 的垂直滚动条。我只希望当 Expander 太大而无法在屏幕上显示时显示外部滚动条。

原文

How can I set up a WPF control to fill the available space in its parent's container, but not expand the parent?

The following snippet describes the layout I am attempting. I would like the Grid to stretch to accommodate the Expander, and I would like the ListBox only to fill the Grid. I want the ListBox's scroll bar to appear when the Grid is too small to show all the ListBoxItems.

<ScrollViewer>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition />
        </Grid.RowDefinitions>
        <ListBox Grid.Row="0" Grid.Column="0" />
        <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
    </Grid>
</ScrollViewer>

Currently what happens is that the Grid stretches to fit the entire ListBox, and the outer ScrollViewer's vertical scroll bar appears. I only want the outer scroll bar to appear when the Expander gets too big to fit on screen.

分享到QQ

分享到微博

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

发布评论

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

缱倦旧时光 2024-08-09 17:26:00

为了解决同样的问题，我编写了特殊的容器类：

class FrugalContainer : Decorator
{
    protected override Size MeasureOverride(Size availableSize)
    {
        return new Size(0, 0);
    }

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        // get it all
        Child.Measure(arrangeSize);
        Child.Arrange(new Rect(arrangeSize));
        return Child.RenderSize;
    }
}

用容器包围你的ListBox，ListBox的高度将与Expander的高度相同。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <FrugalContainer Grid.Row="0" Grid.Column="0" >
        <ListBox />
    </FrugalContainer>
    <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
</Grid>

请注意，我从列的定义中删除了 Width="Auto"，因为 FrugalContainer 将尽可能小。所以你不能将父网格单元格的宽度或高度设置为自动。

如果需要自动调整大小，请重写容器：

class FrugalHeightContainer : Decorator
{
    protected override Size MeasureOverride(Size availableSize)
    {
        Child.Measure(availableSize);
        return new Size(Child.DesiredSize.Width, 0);
    }

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        Child.Measure(arrangeSize);
        Child.Arrange(new Rect(arrangeSize));
        return Child.RenderSize;
    }
}

To solve the same problem I wrote special container class:

class FrugalContainer : Decorator
{
    protected override Size MeasureOverride(Size availableSize)
    {
        return new Size(0, 0);
    }

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        // get it all
        Child.Measure(arrangeSize);
        Child.Arrange(new Rect(arrangeSize));
        return Child.RenderSize;
    }
}

Surround your ListBox by the container and the height of ListBox will be the same as of Expander.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <FrugalContainer Grid.Row="0" Grid.Column="0" >
        <ListBox />
    </FrugalContainer>
    <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
</Grid>

Note that I remove Width="Auto" from column's definition because the FrugalContainer will be as small as it can. So you can't set the width or height of the parent grid's cell to Auto.

If you need autosizing, rewrite the container:

class FrugalHeightContainer : Decorator
{
    protected override Size MeasureOverride(Size availableSize)
    {
        Child.Measure(availableSize);
        return new Size(Child.DesiredSize.Width, 0);
    }

    protected override Size ArrangeOverride(Size arrangeSize)
    {
        Child.Measure(arrangeSize);
        Child.Arrange(new Rect(arrangeSize));
        return Child.RenderSize;
    }
}

回复收藏 0 原文

ゃ懵逼小萝莉 2024-08-09 17:26:00

ScrollViewer 有什么意义？当可用空间太小时，让 ListBox 模板中的 ScrollViewer 自然出现即可。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <ListBox Grid.Row="0" Grid.Column="0" />
    <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
</Grid>

What is the point of the ScrollViewer? Just let the ScrollViewer in the ListBox template appear naturally when too little room is available.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />
    </Grid.RowDefinitions>
    <ListBox Grid.Row="0" Grid.Column="0" />
    <Expander Grid.Row="0" Grid.Column="1" Header="Expander" />
</Grid>

回复收藏 0 原文

~没有更多了~