2009-09-22 12 views
9

In questo momento, ho una finestra WPF che assomiglia a questo:È possibile allineare a sinistra le intestazioni in una WPF TabControl?

All the tab labels of the TabControl are centered http://img33.yfrog.com/img33/9996/tabcontrolcenteredheade.jpg

Mi piacerebbe che assomigliare a questo (immagine Photoshop ritoccata):

All the tab labels of the TabControl are left-aligned http://img42.yfrog.com/img42/6687/tabcontrolleftalignedhe.jpg

È questo possibile senza dover rifare completamente il ControlTemplate?

Ho provato a messaggiare con HorizontalAlignment, HorizontalContentAlignment, ecc., Ma nulla di ciò che ho provato ha avuto l'effetto desiderato.


Edit:

Se provo questa soluzione (offerto da T Levesque) ...

<TabControl...> 
    <TabControl.ItemContainerStyle> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="HorizontalAlignment" Value="Left"/> 
     </Style> 
    </TabControl.ItemContainerStyle> 
    ... 
</TabControl> 

... ottengo questo:

All the tab labels of the TabControl are left-aligned, but the tabs don't stretch properly http://img14.imageshack.us/img14/6687/tabcontrolleftalignedhe.jpg

Quale è vicino, ma finisce per sembrare un po 'di l Ascolta un istogramma.


Edit 2:

Per la cronaca, ho finito la combinazione R. Copsey e risposte di T. Levesque per arrivare a questo:

<TabControl 
    Margin="0,5,0,0" 
    HorizontalContentAlignment="Left" 
    TabStripPlacement="Left"> 
    <TabControl.ItemContainerStyle> 
     <Style 
      TargetType="TabItem"> 
      <Setter 
       Property="HorizontalAlignment" 
       Value="Stretch" /> 
      <Setter 
       Property="HorizontalContentAlignment" 
       Value="Stretch" /> 
     </Style> 
    </TabControl.ItemContainerStyle> 
    <TabItem 
     Header="Perform System Administration"> 
     ... 
    <TabItem 
     Header="Perform Setup Tasks"> 
     ... 

risposta

13

Di seguito vi darà l'aspetto che siete dopo.

<TabControl TabStripPlacement="Left" HorizontalContentAlignment="Left" > 
     <TabItem HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" Header="Header 1"> 
      <TabItem.Content>Test</TabItem.Content> 
     </TabItem> 

     <TabItem HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" Header="Header 2" > 
      <TabItem.Content>Test</TabItem.Content> 
     </TabItem> 

     <TabItem HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" Header="Header Longer Version"> 
      <TabItem.Content>Test</TabItem.Content> 
     </TabItem> 
    </TabControl> 
+0

modo non si ottiene il risultato che sta cercando nella schermata fornito ... –

+0

ho appena provato, e si avvicinò con qualcosa con il look giusto. –

+0

Sì, questo è il trucco. Grazie! – devuxer

4

Che tipo di controllo sei usando per la proprietà TabItem.Header? Se stai semplicemente usando un'etichetta, stai specificando la larghezza dell'etichetta su un valore comune? Se l'etichetta sta ridimensionando il contenuto, apparirà come hai mostrato. Provare la seguente con una larghezza comune per le etichette utilizzate per visualizzare il testo di intestazione:

<TabControl TabStripPlacement="Left" > 
    <TabItem> 
     <TabItem.Header> 
      <Label Width="100">test tab 1</Label> 
     </TabItem.Header> 
     <TabItem.Content> 
      xyz 
     </TabItem.Content> 
    </TabItem> 
    <TabItem> 
     <TabItem.Header> 
      <Label Width="100">test t2</Label> 
     </TabItem.Header> 
     <TabItem.Content> 
      abc 
     </TabItem.Content> 
    </TabItem> 
    <TabItem> 
     <TabItem.Header> 
      <Label Width="100">test tab three</Label> 
     </TabItem.Header> 
     <TabItem.Content> 
      abc 
     </TabItem.Content> 
    </TabItem> 
</TabControl> 
3

È possibile definire l'allineamento orizzontale per tutte le intestazioni tab:

<TabControl...> 
    <TabControl.ItemContainerStyle> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="HorizontalAlignment" Value="Left"/> 
     </Style> 
    </TabControl.ItemContainerStyle> 
    ... 
</TabControl> 
+0

Buona idea, ma non funziona. Ho modificato la mia domanda per mostrare cosa fa. – devuxer

+0

Ma +1 per l'idea di impostare 'ItemContainerStyle' ... salva un sacco di markup. Vedi la mia seconda modifica. – devuxer

1

semplicemente aggiungendo l'attributo HorizontalContentAlignment = "left" al TabControl allineerà intestazioni linguetta di sinistra.

<TabControl 
Margin="0,5,0,0" 
HorizontalContentAlignment="Left" 
TabStripPlacement="Left"> 
<TabItem 
    Header="Perform System Administration"> 
    ... 
<TabItem 
    Header="Perform Setup Tasks"> 
    ... 
Problemi correlati