2010-01-13 6 views
1

TabItem이있는 TabControl입니다. TabItem에는 텍스트와 아이콘이 있습니다. 이렇게하려면 TabItemStackPanel을 추가해야합니다.WPF TabItem 이미지가있는 스타일

그러나 일단 StackPanel을 추가하면 더 이상 텍스트의 기본 스타일을 제어 할 수 없습니다.

리소스 :

<Style TargetType="{x:Type TabItem}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type TabItem}"> 
       <Grid Name="tabItem"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto"/> 
         <RowDefinition Height="*"/> 
        </Grid.RowDefinitions> 
        <Border Grid.Row="1" Name="tabItemStyle" Background="Transparent" BorderBrush="Transparent" BorderThickness="1,1,1,0" CornerRadius="3,3,0,0" SnapsToDevicePixels="True" Margin="0, 0, 5, 0"> 
         <ContentPresenter x:Name="ContentSite" TextBlock.Foreground="White" TextBlock.FontWeight="Bold" VerticalAlignment="Center" HorizontalAlignment="Center" ContentSource="Header" Margin="14,3,18,3"> 
         </ContentPresenter> 
        </Border> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsSelected" Value="True"> 
         <Setter TargetName="tabItemStyle" Property="Background" Value="#ecf3f9" /> 
         <Setter TargetName="tabItemStyle" Property="BorderBrush" Value="#29458e" /> 
         <Setter TargetName="tabItemStyle" Property="BorderThickness" Value="1,1,1,0" /> 
         <Setter TargetName="ContentSite" Property="TextBlock.Foreground" Value="#29458e" /> 
        </Trigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="False" /> 
          <Condition Property="IsMouseOver" Value="True" /> 
         </MultiTrigger.Conditions> 
         <MultiTrigger.Setters> 
          <Setter TargetName="tabItemStyle" Property="Background" Value="#6381be" /> 
          <Setter TargetName="tabItemStyle" Property="BorderBrush" Value="#97acd4" /> 
          <Setter TargetName="tabItemStyle" Property="BorderThickness" Value="1,1,1,0" /> 
         </MultiTrigger.Setters> 
        </MultiTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

TabItem의 :

<TabItem> 
    <TabItem.Header> 
     <StackPanel Orientation="Horizontal"> 
      <Image VerticalAlignment="Center" Source="/images/icons/_24/reports.png" Width="24" /> 
      <TextBlock VerticalAlignment="Center" Margin="5, 0" >Reports</TextBlock> 
     </StackPanel> 
    </TabItem.Header> 
</TabItem> 

관련 라인은 자원 (스타일)의 ContentPresenter입니다. TextBlock.Foreground="White"은 더 이상 작동하지 않습니다. 나는 왜 그런지 알 수는 있지만 어떻게 할 수 없는지 알 수 없다. 어떤 아이디어?

+0

텍스트 블록 정의로 텍스트를 색칠 할 수 있습니다. –

+0

모든 탭의 색 구성표는 동일합니다. 트리거에서 전경색을 변경해야합니다. 그렇지 않으면 많은 코드를 복제하게 될 것입니다. –

답변

0

실제 TabItem에 관련 속성을 설정하기 만하면됩니다. 예를 들어, 다음 스타일을 맨 위에 올리면 알 수 있습니다.

<Setter Property="Foreground" Value="Red" /> 

텍스트가 계속 변경됩니다. ContentPresenterTextBlock을 참조 할 필요가 없으며 수행 한 경우에도 해당 속성에 TemplateBindings을 적용하여 TabItem의 속성이 변경된 경우 ContentPresenter 님의 속성을 적용 할 수 있습니다.