Sắp xếp các mục trong bảng ngăn xếp?

Tôi đã tự hỏi nếu tôi có thể có 2 điều khiển trong StackPanel định hướng theo chiều ngang để mục bên phải được neo vào bên phải của StackPanel.

Tôi đã thử cách sau nhưng không được:

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

Trong đoạn trích trên, tôi muốn Nút được gắn vào bên phải của StackPanel.

Lưu ý: Tôi cần nó được thực hiện với StackPanel, không phải Grid, v.v.

Bạn có thể đạt được điều này với một DockPanel:

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

Sự khác biệt là a StackPanelsẽ sắp xếp các phần tử con thành một dòng đơn (theo chiều dọc hoặc chiều ngang) trong khi đó DockPanelxác định một khu vực nơi bạn có thể sắp xếp các phần tử con theo chiều ngang hoặc chiều dọc, tương đối với nhau (thuộc Docktính thay đổi vị trí của phần tử so với phần tử khác các phần tử trong cùng một vùng chứa. Các thuộc tính sắp xếp, chẳng hạn như HorizontalAlignment, thay đổi vị trí của một phần tử so với phần tử cha của nó).

Cập nhật

Như đã chỉ ra trong các ý kiến, bạn cũng có thể sử dụng FlowDirectiontài sản của a StackPanel. Xem câu trả lời của @ D_Bester .

Yo có thể thiết lập FlowDirectioncủa Stack panelđể RightToLeft, và sau đó tất cả các mục sẽ được sắp xếp ngay phía bên phải.

Đối với những người vấp ngã khi câu hỏi này, dưới đây là cách để đạt được bố trí này với một Grid:

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

tạo ra

Server:                                                                   http://127.0.0.1

Không thể làm việc này bằng DockPanel theo cách tôi muốn và đảo ngược hướng dòng chảy của StackPanel là rắc rối. Sử dụng lưới không phải là một tùy chọn vì các mục bên trong nó có thể bị ẩn trong thời gian chạy và do đó tôi không biết tổng số cột tại thời điểm thiết kế. Giải pháp tốt nhất và đơn giản nhất tôi có thể đưa ra là:

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

Điều này sẽ dẫn đến các điều khiển bên trong StackPanel được căn chỉnh ở phía bên phải của không gian có sẵn bất kể số lượng điều khiển - cả về thiết kế và thời gian chạy. Yay! :)

Điều này làm việc hoàn hảo cho tôi. Chỉ cần đặt nút đầu tiên vì bạn bắt đầu ở bên phải. Nếu FlowDirection trở thành vấn đề, chỉ cần thêm StackPanel xung quanh nó và chỉ định FlowDirection = "LeftToRight" cho phần đó. Hoặc chỉ cần chỉ định FlowDirection = "LeftToRight" cho điều khiển có liên quan.

<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>

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

đối với windows 10, hãy sử dụng RelPanel thay vì bảng ngăn xếp và sử dụng

Tương đối.alignrightwithpanel = "đúng"

cho các yếu tố chứa.

Nếu bạn gặp vấn đề như vấn đề tôi gặp phải khi các nhãn được đặt ở giữa trong bảng xếp chồng dọc của tôi, hãy đảm bảo bạn sử dụng các điều khiển chiều rộng đầy đủ. Xóa thuộc tính Width hoặc đặt nút của bạn trong một thùng chứa toàn chiều rộng cho phép căn chỉnh bên trong. WPF là tất cả về việc sử dụng các container để kiểm soát bố cục.

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

StackPanel dọc với nhãn trái theo sau là nút phải

Tôi hi vọng cái này giúp được.

Có thể không phải là những gì bạn muốn nếu bạn cần tránh các giá trị kích thước mã hóa cứng, nhưng đôi khi tôi sử dụng "shim" (Dấu phân cách) cho việc này:

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