首页 文章

对齐堆栈面板中的项目？

提问于
浏览 次
118

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

我尝试了以下但它不起作用：

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

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

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

wpf layout wpf-controls stackpanel alignment

9 回答

  • 19

    如果您遇到的问题类似于标签在我的垂直堆栈面板中居中的问题，请确保使用全宽度控件 . 删除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

    我希望这有帮助 .

    回复于
  • -7

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

    <Separator Width="42"></Separator>
    回复于
  • 0

    您可以使用 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 ，更改元素相对于其的位置父元素） .

    Update

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

    回复于
  • 58

    哟可以将_803700_的_803700_设置为 RightToLeft ，然后所有项目都将对齐到右侧 .

    回复于
  • 2

    对于那些偶然发现这个问题的人来说，这里是如何使用 Grid 实现这种布局：

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

    创建

    Server:                                                                   http://127.0.0.1
    回复于
  • 2

    无法按照我想要的方式使用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内部的控件与可用空间的右侧对齐，而不管控件的数量 - 无论是在设计还是运行时 . 好极了！ :)

    回复于
  • 0
    <Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <TextBlock Text="Left"  />
    <Button Width="30" Grid.Column="1" >Right</Button>
</Grid>
    回复于
  • 187

    这对我来说很完美 . 只需将按钮放在首位，因为您从右侧开始 . 如果FlowDirection成为问题，只需在其周围添加一个StackPanel，并为该部分指定FlowDirection =“LeftToRight” . 或者只需为相关控件指定FlowDirection =“LeftToRight” .

    <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>
    回复于
  • 14

    对于Windows 10，使用relativePanel而不是堆栈面板，并使用

    relativepanel.alignrightwithpanel =“true”

    对于包含的元素 .

    回复于

相关问题