Question

我想知道在水平导向的StackPanel中是否可以有2个控件，以便正确的项目应该停靠在StackPanel的右侧。

我尝试了以下但是没有用：

<StackPanel Orientation="Horizontal">
    <TextBlock>Left</TextBlock>
    <Button Width="30" HorizontalAlignment="Right">Right<Button>
</StackPanel>

在上面的代码片段中，我希望Button停靠在StackPanel的右侧。

注意：我需要使用StackPanel，而不是Grid等。

Answer 1

您可以使用DockPanel：

来实现这一目标

<DockPanel Width="300">
    <TextBlock>Left</TextBlock>
    <Button HorizontalAlignment="Right">Right</Button>
</DockPanel>

不同之处在于StackPanel will arrange child elements into single line（垂直或水平）而DockPanel defines an area where you can arrange child elements either horizontally or vertically, relative to each other（Dock属性会更改元素相对于同一容器中其他元素的位置。属性（例如HorizontalAlignment）会更改元素相对于其父元素的位置。

<强>更新

正如评论中所指出的，您还可以使用FlowDirection的{{1}}属性。请参阅@ D_Bester的answer。

Answer 2

哟可以将FlowDirection的{{1}}设置为Stack panel，然后所有项目都会与右侧对齐。

Answer 3

对于那些偶然发现这个问题的人，以下是如何使用 Grid实现此布局：

<Grid> <TextBlock Text="Server:"/> <TextBlock Text="http://127.0.0.1" HorizontalAlignment="Right"/> </Grid>

创建

Server: http://127.0.0.1

Answer 4

无法按照我想要的方式使用DockPanel工作，并且反转StackPanel的流向是很麻烦的。使用网格不是一个选项，因为它内部的项目可能在运行时隐藏，因此我不知道设计时的列总数。我能想出的最好和最简单的解决方案是：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <StackPanel Grid.Column="1" Orientation="Horizontal">
        <!-- Right aligned controls go here -->
    </StackPanel>
</Grid>

这将导致StackPanel内部的控件与可用空间的右侧对齐，而不管控件的数量 - 无论是在设计还是运行时。好极了！：）

Answer 5

这对我来说很有效。只需按下按钮即可，因为您从右侧开始。如果FlowDirection成为一个问题，只需在它周围添加一个StackPanel并指定FlowDirection =＆＃34; LeftToRight＆＃34;对于那部分。或者只需指定FlowDirection =＆＃34; LeftToRight＆＃34;对于相关控制。

<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" FlowDirection="RightToLeft">
    <Button Width="40" HorizontalAlignment="Right" Margin="3">Right</Button>
    <TextBlock Margin="5">Left</TextBlock>
    <StackPanel FlowDirection="LeftToRight">
        <my:DatePicker Height="24" Name="DatePicker1" Width="113" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" />    
    </StackPanel>
    <my:DatePicker FlowDirection="LeftToRight" Height="24" Name="DatePicker1" Width="113" xmlns:my="http://schemas.microsoft.com/wpf/2008/toolkit" />    
</StackPanel>

Answer 6

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <TextBlock Text="Left"  />
    <Button Width="30" Grid.Column="1" >Right</Button>
</Grid>

Answer 7

用于Windows 10 使用relativePanel而不是stack panel，并使用

relativepanel.alignrightwithpanel = “真”

包含的元素。

Answer 8

如果遇到类似我在垂直堆栈面板中居中放置标签的问题，请确保使用全角控件。删除Width属性，或将按钮放在允许内部对齐的全角容器中。 WPF就是使用容器来控制布局。

<StackPanel Orientation="Vertical">
    <TextBlock>Left</TextBlock>
    <DockPanel>
        <Button HorizontalAlignment="Right">Right</Button>
    </DockPanel>
</StackPanel>

Vertical StackPanel with Left Label followed by Right Button

我希望这会有所帮助。

Answer 9

如果您需要避免硬编码大小值，可能不是您想要的，但有时我会使用“垫片”（分隔符）：

<Separator Width="42"></Separator>

对齐堆栈面板中的项目？

9 个答案: