2012-08-27 20 views
42

avere il codice seguente:Allineamento controlli su entrambi i lati sinistro e destro in un pannello pila in WPF

<DockPanel> 
    <StackPanel DockPanel.Dock="Top" Orientation="Horizontal"> 
     <RadioButton Content="_Programs" 
        IsChecked="{Binding Path=ProgramBanksSelected}" IsEnabled="{Binding Path=ProgramsEnabled}" Margin="8" /> 
     <StackPanel> 
      <Label Content="Master" Height="28" Name="MasterFileStatus" VerticalContentAlignment="Center"/> 
     </StackPanel> 
    </StackPanel> 
    ... 

Il pulsante radio deve essere posizionato sul lato sinistro del pannello pila (I rimossi alcuni pulsanti per non ingombrare l'esempio) e l'etichetta (che ho inserito temporaneamente in uno StackPanel annidato) dovrebbe essere sul lato destro.

Ho provato già molte combinazioni di allineamenti ma non riesco a ottenere l'etichetta sul lato destro. Cosa dovrei aggiungere per realizzare questo?

+2

Davvero non si può chiedere troppo di pannelli di stack, non appena si desidera qualsiasi tipo di struttura semi-avanzata basta andare per una griglia –

+5

La risposta giusta è quella di utilizzare un DockPanel come in questo post: http://stackoverflow.com/questions/2023201/align-items-in-a-stack-panel – pasx

risposta

61

Basta non utilizzare un StackPanel, StackPanelspila. Lo fanno, per ovvi motivi, non consentono l'allineamento nella direzione in cui si impilano. Utilizzare un Grid, con le definizioni delle colonne in questo modo:

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="Auto" /> 
    <ColumnDefinition Width="*" /> 
    <ColumnDefinition Width="Auto" /> 
</Grid.ColumnDefinitions> 
+0

Immagino che funzionerebbe, ma aspetterò altre risposte, perché con StackPanels ho il vantaggio che quando lo schermo è reso meno ampio, gli elementi si concluderanno, che perdo quando uso un griglia. –

+2

@MichelKeijzers: Se vuoi qualcosa di simile, potresti aver bisogno di implementare il tuo pannello personale. –

+0

Grazie per la risposta ... Non so se preferisco la soluzione per non allineare correttamente in quel caso, ma questo è al di fuori della domanda che ho posto. –

2

Come è stato impostato l'orientamento StackPanel su Horizontal, la proprietà HorizontalAlignment non funzionerà sugli elementi figlio. Puoi mantenere lo StackPanel se hai bisogno di controlli aggiuntivi, anche se ti consiglio di passare a Grid (tra le altre cose) per costruire il layout che desideri.

Inoltre, il Grid vi permetterà di controllare la larghezza effettiva di ciascuna colonna:

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="50" /> 
     <ColumnDefinition Width="150" /> 
    </Grid.ColumnDefinitions> 

    <RadioButton 
     Grid.Column="0" 
     ... 
    /> 

    <Label 
     Grid.Column="1" 
     ... 
    /> 
</Grid> 

+1

Il tuo primo esempio non funzionerà, si impilerà ancora orizzontalmente come lo spazio lo consente e l'allineamento non farà nulla. –

+0

@KDiTraglia Sì, appena testato - hai ragione; Quando 'Orientation =" Horizontal "', ignora 'HorizontalAlignment'; rimuovendo ora, grazie =] – newfurniturey

11

Anche se questo è vecchio, se qualcuno dovesse imbattersi in questo come ho fatto io, ecco una soluzione semplice.

Creare una nuova griglia e all'interno di quella griglia posizionare due riquadri con diverso allineamento orizzontale.

<Grid> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Left"> 
     <!--Code here--> 
    </StackPanel> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right"> 
     <!--Code here--> 
    </StackPanel> 
</Grid> 

Il problema possibile è che ora senza ulteriore gestione i due potrebbero sovrapporsi l'uno con l'altro.

+0

Funziona bene per me ed è abbastanza semplice. – gbdavid

0

L'utente @pasx ha ragione. Dovresti utilizzare DockPanel e agganciare il RadioButton sul lato sinistro e StackPanel con l'etichetta sul lato destro.

<DockPanel> 

    <DockPanel 
     DockPanel.Dock="Top" 
     LastChildFill="False" > 

     <RadioButton 
      DockPanel.Dock="Left" 
      Content="_Programs" 
      IsChecked="{Binding Path=ProgramBanksSelected}" 
      IsEnabled="{Binding Path=ProgramsEnabled}" 
      Margin="8" /> 

     <StackPanel 
      DockPanel.Dock="Right"> 

      <Label 
       Content="Master" 
       Height="28" 
       Name="MasterFileStatus" 
       VerticalContentAlignment="Center"/> 

     </StackPanel> 

    </DockPanel> 
    ...