TabItem
이있는 TabControl
입니다. TabItem
에는 텍스트와 아이콘이 있습니다. 이렇게하려면 TabItem
에 StackPanel
을 추가해야합니다.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"
은 더 이상 작동하지 않습니다. 나는 왜 그런지 알 수는 있지만 어떻게 할 수 없는지 알 수 없다. 어떤 아이디어?
텍스트 블록 정의로 텍스트를 색칠 할 수 있습니다. –
모든 탭의 색 구성표는 동일합니다. 트리거에서 전경색을 변경해야합니다. 그렇지 않으면 많은 코드를 복제하게 될 것입니다. –