2009-09-29 9 views
6

El comportamiento predeterminado de WPF Tabcontrol es colocar los encabezados de pestañas uno al lado del otro, sin ningún espacio vacío entre ellos. ¿Qué pasa si quiero especificar un espacio entre los encabezados? ¿Debo definir una plantilla de control para esto? Soy relativamente nuevo en el PMA y cualquier ayuda es apreciada.Separación de control de pestañas WPF entre los encabezados

Gracias

Respuesta

9

creo que tendrá que definir una plantilla de control personalizado para el TabItem, tal vez incluso una para el TabControl. Aquí hay un ejemplo de un TabItem que usa un espaciador para cierta separación.

<Style 
    x:Key="SpacedTab" 
    TargetType="{x:Type TabItem}"> 
    <Setter 
     Property="Template"> 
     <Setter.Value> 
      <ControlTemplate 
       TargetType="{x:Type TabItem}"> 
       <Border 
        x:Name="Spacer" 
        Width="Auto" 
        Height="Auto" 
        Padding="0 0 5 0" 
        Margin="0 0 0 0" 
        BorderBrush="Transparent" 
        BorderThickness="0"> 
        <Border 
         x:Name="Border" 
         MinWidth="150" 
         Width="Auto" 
         Height="30" 
         Background="Gray" 
         BorderBrush="DarkGray" 
         BorderThickness="0,0,0,0" 
         CornerRadius="6,6,0,0" 
         Cursor="Hand" 
         VerticalAlignment="Bottom"> 
         <ContentPresenter 
          x:Name="ContentSite" 
          TextElement.FontSize="10pt" 
          TextElement.FontFamily="Arial" 
          TextElement.Foreground="Black" 
          VerticalAlignment="Center" 
          HorizontalAlignment="Center" 
          ContentSource="Header" 
          Margin="8,3,8,3" 
          Width="Auto" 
          Height="Auto" /> 
        </Border> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Espero que sea un empujón en la dirección correcta; aún deberá agregar eso como un recurso de estilo y hacer referencia a él desde su TabControl -> TabItem.

+1

Bien, lo intentaré. Gracias –

3

Es fácil agregar espacio haciéndolo en el diseñador. Seleccione la pestaña que desea mover, comenzando con la pestaña de la derecha. Luego sostenga ctrl y use la tecla con la flecha hacia la derecha para mover la pestaña hacia la derecha. Haz lo mismo con el resto de las pestañas. Luego puede ajustar manualmente el margen en el código xaml.

+1

No hay necesidad de un diseñador. Los márgenes acumulativos en el código también funcionan para que [tab] space [tab] [tab] space [tab] tenga márgenes izquierdos y derechos de 0 para la primera pestaña, luego x para las segundas dos pestañas y 2x para la última pestaña donde x es el ancho del espacio" – byteit101

Cuestiones relacionadas