Ausrichten von Elementen in einer Stapeltafel?

Question

Ich habe mich gefragt, ob ich 2 Steuerelemente in einem horizontal orientierten StackPanel haben kann, so dass das rechte Element an der rechten Seite des StackPanels angedockt werden sollte.

Ich habe das Folgende versucht, aber es hat nicht funktioniert:

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

Im obigen Schnipsel soll die Schaltfläche an der rechten Seite des StackPanels angedockt werden.

Hinweis: Ich brauche es, um mit StackPanel, nicht Grid usw. getan werden.

Answer 1

Sie können dies mit einer DockPanel :

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

Der Unterschied besteht darin, dass ein StackPanel ordnet untergeordnete Elemente in einer einzigen Zeile an (entweder senkrecht oder waagerecht), während ein DockPanel definiert einen Bereich, in dem Sie untergeordnete Elemente entweder horizontal oder vertikal relativ zueinander anordnen können (die Dock Eigenschaft ändert die Position eines Elements im Verhältnis zu anderen Elementen innerhalb desselben Containers. Ausrichtungseigenschaften, wie z. B. HorizontalAlignment die Position eines Elements relativ zu seinem übergeordneten Element ändern).

Update

Wie in den Kommentaren erwähnt, können Sie auch die FlowDirection Eigenschaft einer StackPanel . Siehe @D_Bester's Antwort .

Answer 2

Sie können einstellen FlowDirection de Stack panel a RightToLeft und dann werden alle Elemente an der rechten Seite ausgerichtet.

Answer 3

Für diejenigen, die über diese Frage stolpern, hier eine Anleitung, wie man dieses Layout erreicht mit a Grid :

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

erstellt

Server:                                                                   http://127.0.0.1

Answer 4

Ich konnte das mit einem DockPanel nicht ganz so hinbekommen, wie ich es wollte, und die Umkehrung der Flussrichtung eines StackPanels ist mühsam. Die Verwendung eines Rasters ist keine Option, da Elemente darin zur Laufzeit ausgeblendet werden können und ich daher die Gesamtzahl der Spalten zur Entwurfszeit nicht kenne. Die beste und einfachste Lösung, die mir eingefallen ist, ist:

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

Dies führt dazu, dass die Steuerelemente innerhalb des StackPanels unabhängig von der Anzahl der Steuerelemente - sowohl beim Entwurf als auch zur Laufzeit - an der rechten Seite des verfügbaren Platzes ausgerichtet werden. Juhu! :)

Answer 5

Das funktioniert für mich perfekt. Setzen Sie einfach die Schaltfläche zuerst, da Sie auf der rechten Seite beginnen. Wenn FlowDirection ein Problem wird, fügen Sie einfach ein StackPanel um ihn herum und geben Sie FlowDirection="LeftToRight" für diesen Teil. Oder geben Sie einfach FlowDirection="LeftToRight" für das entsprechende Steuerelement an.

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