Question

我无法使用XAML控制按钮控件的确切布局。似乎无论我做什么，按钮都是最小宽度。我有一个简单的按钮，按钮内只有一个文本块。但是按钮有很多边距和填充，我似乎无法摆脱（我知道负边距和填充）。我想知道的是： 1.为什么世界上它是这样设计的。 2.控制按钮确切布局的基本规则是什么？

我的代码如下：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="80"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="0"></StackPanel>

    <Pivot Grid.Row="1">
        <Pivot.Title>
            <StackPanel Orientation="Horizontal" Margin="-15,-3,0,0" Background="red" Width="480">
                <Button Background="Blue" x:Name="btnStudies" Click="btnMenuItem_Click" Width="20">
                    <TextBlock Text="Title" Foreground="White"></TextBlock>
                </Button>

                <Button Background="Green">
                    <TextBlock Text="Title" Foreground="White"></TextBlock>
                </Button>

                <Button Background="Blue" Click="btnMenuItem_Click">
                    <TextBlock Text="Title" Foreground="White"></TextBlock>
                </Button>

                <Button Background="Blue" Click="btnMenuItem_Click">
                    <TextBlock Text="Title" Foreground="White"></TextBlock>
                </Button>

                <Button Background="Blue" Click="btnMenuItem_Click">
                    <TextBlock Text="Title" Foreground="White"></TextBlock>
                </Button>
            </StackPanel>

        </Pivot.Title>
    </Pivot>
</Grid>

我想要连续五个按钮，但这些按钮对于屏幕来说已经太宽了（Windows手机）。改变宽度似乎没有任何影响（为什么它在那里）。按钮内的textBlock控件按钮的宽度与文本一样宽，但我似乎无法控制按钮的宽度。在HTML中，你只定义了填充或边距，但在xaml中，它似乎就在那里，对我来说还不清楚如何撤消它。

***** EDIT ***** 在阅读了雷切尔的回复后，我决定从头开始。使用下面的代码我仍然无法控制按钮的宽度，因为它使用了一些我似乎无法删除的填充。当我定义的宽度低于它不变的宽度时，按钮的宽度约为110。边距和填充0都没有任何影响（不想使用负值，因为这看起来不太直观）。所以下面的代码非常简单，但按钮占用了一些我无法控制的空间。我无法想象它之所以这样设计的原因。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="400" />
    </Grid.ColumnDefinitions>

    <StackPanel Width="300" Background="Red" HorizontalAlignment="Left">
        <Button Background="Blue" HorizontalAlignment="Left" Width="100" Margin="0" Padding="0">
            <TextBlock Text="Title" Width="Auto" HorizontalAlignment="Left" />
        </Button>
    </StackPanel>
</Grid>

Answer 1

包含控件的父面板的类型和大小会影响子控件的大小/布局。

在您的情况下，您的父面板有Grid，而Grid默认占用所有可用空间。此外，放置在网格内的子项默认占用所有可用空间，除非您另有指定。

因此，我们为<Pivot>分配的宽度等于Grid.Width，而Pivot.Title听起来的宽度等于Pivot.Width，{ {1}}的宽度等于StackPanel ...你得到了图片。

要指定控件不应占用所有可用空间，请指定Pivot.Title.Width或HorizontalAlignment属性，以告知其父级面板的哪一侧停靠项目。

例如

VerticalAlignment

或

<Pivot Grid.Row="1" HorizontalAlignment="Left">

如果您不熟悉WPF的布局系统，我建议您阅读代码项目文章WPF Layouts: A Quick Visual Start，快速了解WPF的主要布局面板。

如何在Xaml中控制按钮布局

1 个答案: