为什么StackPanel不能垂直拉伸其子级? [英] Why StackPanel does not stretch its children vertically?

问题描述

(WPF的新功能)我正在查看WPF的示例:

(new to WPF) I am looking over the WPF example:

<Window x:Class="Attempt_XAML.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <StackPanel>
        <Label HorizontalAlignment="Center">A Button Stack</Label>
        <Button HorizontalAlignment="Left">Button 1</Button>
        <Button HorizontalAlignment="Right">Button 2</Button>
        <Button Background="#FFA29494">Button 3</Button>
        <Button>Button 4</Button>
    </StackPanel>
</Window>

MS中的注释指出:

Horizo​​ntalAlignment和StackPanel中包含的内容的VerticalAlignment.

The default value is stretch for both HorizontalAlignment and VerticalAlignment of content that is contained in a StackPanel.

但是，结果看起来与我期望的有所不同. Button 和 Label 并不是垂直拉伸的，而是水平拉伸的(即它们没有在两个方向上都填充 Window 的整个空间)?

However, result looks different from what I am expecting. Button and Label are not stretched out vertically, but only horizontally(i.e they don't fill the entire space of Window in both directions) Why ?

推荐答案

按钮和标签不是垂直延伸，而是水平延伸(即它们没有在两个方向上都填充Window的整个空间)?

Button and Label are not stretched out vertically, but only horizontally(i.e they don't fill the entire space of Window in both directions) Why ?

要了解原因，您实际上至少需要对面板.诸如 StackPanel 之类的任何Panel都使用度量安排循环来确定其子元素的布局:

To understand the reason, you really need at least a basic understanding of Panels. Any Panel such as a StackPanel uses a measure-arrange cycle to decide on a layout for its child elements:

• 在测量"周期中，它会为每个孩子分配一个尺寸
• 在安排"周期中，它将每个孩子置于其视图中

StackPanel 的关键特征是它具有无限的空间-如果其方向为 Horizo​​ntal ，则具有无限的水平空间；如果 Vertical <，则具有无限的垂直空间./code>.换句话说，它实际上并没有注意可用的大小(在其方向上)，而是要求一个无限的空间.因此，因此，回到您的示例，即使子级的 VerticalAlignment 可能是 Stretch ，它们实际上也无法拉伸到无限大小.

The key feature of a StackPanel is that it has infinite space -- infinite horizontal space if its orientation is Horizontal, and infinite vertical space if Vertical. In other words, it does not actually pay attention to the size available to it (in the direction of its orientation), but claims an infinite space. So therefore, coming back to your example, even though the VerticalAlignment of the children may be Stretch, they cannot actually be stretched out to an infinite size.

如果您需要一个面板来扩展其子项以填充可用空间，则 Grid 是一个很好的示例(默认情况下，Grid会为每个子项分配相等的总高度份额--或者您可以使用调整星星大小以调整比例).如果需要特殊的布局行为，也可以考虑创建自己的自定义面板.

If you need a panel that stretches out its children to fill the available space, then Grid is a good example (by default the Grid will assign an equal share of the total height to each child -- or you can use the star sizing to adjust the proportions). You could also consider creating your own custom Panel, if you need a specialized layout behavior.

修改

为了澄清无限空间":我的意思是 StackPanel 告诉它的孩子有无限可用的空间.如果您是按钮，标签等，并且有无限可用空间，该怎么办?即使您的VerticalAlignment是"Stretch"，您也可能只占用了所需的最小空间，对吗?就是这样与Grid对比，后者告诉子控件它们具有x(有限)数量的空间-在这种情况下，Button，Label等将填充 all 该空间(如果它们的VerticalAlignment是拉伸".

To clarify "infinite space": what I mean is that the StackPanel tells its children that there is infinite space available. What do you do if you are a Button, Label, etc, and there is infinite space available? You probably just take up the minimum space you need, even if your VerticalAlignment is "Stretch", right? That's what happens. Contrast to a Grid, which tells the child controls that they have x (finite) amount of space -- in that case, a Button, Label, etc, will fill up all that space (if their VerticalAlignment is "Stretch").

为说明上述内容，请以以下自定义控件为例:

To illustrate the above, take this custom control as an example:

public class TestControl : ContentControl
{
    public string Description { get; set; }

    protected override Size MeasureOverride(Size availableSize)
    {
        System.Diagnostics.Debug.WriteLine("Size available for '" + Description + "': " + availableSize.Height);
        return base.MeasureOverride(availableSize);
    }
}

这实际上不执行任何操作，只是报告已为其分配了多少空间.现在，将测试控件放在 Grid 和 StackPanel 中，然后进行比较:

This doesn't actually do anything, just reports how much space has been allocated to it. Now, place the test control in a Grid and a StackPanel, and compare:

<Grid Height="50">
    <Grid.RowDefinition />
    <Grid.RowDefinition />

    <local:TestControl Description="in Grid" />

    <StackPanel Grid.Row="1" Height="10">
        <local:TestControl Description="in StackPanel" />
    </StackPanel>
</Grid>

您会看到 Grid 将其CustomPanel(上面的第一个)分配为25(高度的一半)的高度.不过， StackPanel 将其CustomPanel的高度设置为Infinity.

You'll see that the Grid assigns its CustomPanel (the first one above) a height of 25 (half its height). The StackPanel, though, assigns its CustomPanel a height of Infinity.

这篇关于为什么StackPanel不能垂直拉伸其子级?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！