WPF - TabControl: den orangen Streifen beim aktiven Tab-Reiter unter WinXP entfernen

[Günther Weber]

Das Model-View-ViewModel (MVVM) Entwurfsmuster für WPF

Der aktive Tab-Reiter hat am oberen Rand unter Windows XP einen orangefarbenen Streifen, unter Windows 7 nicht.

Wie kann ich unter XP die Farbe verändern oder den Streifen komplett unterdrücken? Sollte doch eigentlich im DockPanel von ClosableTabItemTemplate versteckt sein, aber da finde ich nur BackGround als Hintergrundfarbe für den Titel-Text.
Danke - Günther

   <Style x:Key="MainHCCStyle"  TargetType="{x:Type HeaderedContentControl}" >        
        <Setter Property="IsTabStop"  Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type HeaderedContentControl}" >
                    <DockPanel >
                        <ContentPresenter ContentSource="Content"  ContentTemplate="{TemplateBinding ContentTemplate}"   />
                    </DockPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <DataTemplate x:Key="ClosableTabItemTemplate"  >
        <DockPanel Width="120" >
            <Button Command="{Binding Path=CloseCommand}" Content="X" Cursor="Hand" DockPanel.Dock="Right" Focusable="False" FontFamily="Courier" 
                    FontSize="9" FontWeight="Bold"  Margin="0,1,0,0" Padding="0" VerticalContentAlignment="Bottom" Width="16" Height="16" 
                    Visibility="{Binding Path=SchliessButtonVisibility}" />
            <ContentPresenter  Content="{Binding Path=DisplayName}" VerticalAlignment="Center" />
        </DockPanel>
    </DataTemplate>
    <DataTemplate x:Key="WorkspacesTemplate">
        <TabControl IsSynchronizedWithCurrentItem="True" ItemsSource="{Binding}" ItemTemplate="{StaticResource ClosableTabItemTemplate}" Margin="4" />
    </DataTemplate>

[gfoidl]

Hallo Günther,

nicht nur der aktive, sondern auch der mit IsMouseOver=true.

Dass es bei XP angezeigt wird und bei Win 7 nicht hängt mit dem Default-Theme, das vom Betriebssystem abhängig ist, zusammen.

Um das zu ändern musst du das ControlTemplate für das TabItem ändern. Am einfachsten gehts das mit Expression Blend. Guck auch mal Beispiel für ein TabItem-ControlTemplate an.


mfG Gü

[gfoidl]

Hallo Günther,

ich hab das mal mit Blend erledigt. Guck:

<Application
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="WpfApplication3.App"
	StartupUri="MainWindow.xaml">
	<Application.Resources>
		<!-- Resources scoped at the Application level should be defined here. -->
		
		<SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#919B9C"/>
		<LinearGradientBrush x:Key="TabItemNormalBackground" EndPoint="0,1" StartPoint="0,0">
			<GradientStop Color="#FFFFFFFF" Offset="0"/>
			<GradientStop Color="#FFBDBEDE" Offset="1"/>
		</LinearGradientBrush>
		<SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#FFE68B2C"/>
		<SolidColorBrush x:Key="TabItemHotBorderBackround" Color="#FFFFC73C"/>
		<LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0">
			<GradientStop Color="#FFFFFFFF" Offset="0"/>
			<GradientStop Color="#FFBDBEDE" Offset="1"/>
		</LinearGradientBrush>
		<SolidColorBrush x:Key="TabItemSelectedBorderBrush" Color="#FFE68B2C"/>
		<SolidColorBrush x:Key="TabItemSelectedBorderBackround" Color="#FFFFC73C"/>
		<SolidColorBrush x:Key="TabItemSelectedBackground" Color="#FFFCFCFE"/>
		<SolidColorBrush x:Key="TabItemDisabledBackground" Color="#FFF5F4EA"/>
		<SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/>
		<Style TargetType="{x:Type TabItem}">
			<Setter Property="Padding" Value="12,2,12,2"/>
			<Setter Property="BorderThickness" Value="1,1,1,0"/>
			<Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
			<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
			<Setter Property="Background" Value="{StaticResource TabItemNormalBackground}"/>
			<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
			<Setter Property="VerticalContentAlignment" Value="Stretch"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="{x:Type TabItem}">
						<Border SnapsToDevicePixels="true">
							<Grid Margin="0,0,1,0">
								<Grid x:Name="Transform">
									<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="3,3,0,0"/>
									<Border x:Name="HighlightBorder" BorderThickness="1,1,1,0" CornerRadius="3,3,0,0" Height="3" VerticalAlignment="Top"/>
								</Grid>
								<Border BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}">
									<ContentPresenter ContentSource="Header" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
								</Border>
							</Grid>
						</Border>
						<ControlTemplate.Triggers>
							<Trigger Property="IsMouseOver" Value="true">
								<Setter Property="Background" Value="{StaticResource TabItemHotBackground}"/>
								<Setter Property="BorderBrush" TargetName="HighlightBorder" Value="{DynamicResource TabControlNormalBorderBrush}"/>
								<Setter Property="Background" TargetName="HighlightBorder" Value="{DynamicResource TabItemDisabledBackground}"/>
							</Trigger>
							<Trigger Property="IsSelected" Value="true">
								<Setter Property="Panel.ZIndex" Value="1"/>
								<Setter Property="Background" Value="{StaticResource TabItemSelectedBackground}"/>
								<Setter Property="BorderBrush" TargetName="HighlightBorder" Value="{DynamicResource TabControlNormalBorderBrush}"/>
							</Trigger>
							<Trigger Property="TabStripPlacement" Value="Bottom">
								<Setter Property="LayoutTransform" TargetName="Transform">
									<Setter.Value>
										<ScaleTransform ScaleY="-1" ScaleX="1"/>
									</Setter.Value>
								</Setter>
							</Trigger>
							<Trigger Property="TabStripPlacement" Value="Left">
								<Setter Property="LayoutTransform" TargetName="Transform">
									<Setter.Value>
										<RotateTransform Angle="-90"/>
									</Setter.Value>
								</Setter>
							</Trigger>
							<Trigger Property="TabStripPlacement" Value="Right">
								<Setter Property="LayoutTransform" TargetName="Transform">
									<Setter.Value>
										<RotateTransform Angle="90"/>
									</Setter.Value>
								</Setter>
							</Trigger>
							<Trigger Property="IsEnabled" Value="false">
								<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
								<Setter Property="Background" Value="{StaticResource TabItemDisabledBackground}"/>
								<Setter Property="BorderBrush" Value="{StaticResource TabItemDisabledBorderBrush}"/>
							</Trigger>
							<MultiTrigger>
								<MultiTrigger.Conditions>
									<Condition Property="IsSelected" Value="true"/>
									<Condition Property="TabStripPlacement" Value="Top"/>
								</MultiTrigger.Conditions>
								<Setter Property="Margin" Value="-2,-2,-2,-1"/>
							</MultiTrigger>
							<MultiTrigger>
								<MultiTrigger.Conditions>
									<Condition Property="IsSelected" Value="true"/>
									<Condition Property="TabStripPlacement" Value="Bottom"/>
								</MultiTrigger.Conditions>
								<Setter Property="Margin" Value="-2"/>
							</MultiTrigger>
							<MultiTrigger>
								<MultiTrigger.Conditions>
									<Condition Property="IsSelected" Value="true"/>
									<Condition Property="TabStripPlacement" Value="Left"/>
								</MultiTrigger.Conditions>
								<Setter Property="Margin" Value="-2,-2,-1,-2"/>
							</MultiTrigger>
							<MultiTrigger>
								<MultiTrigger.Conditions>
									<Condition Property="IsSelected" Value="true"/>
									<Condition Property="TabStripPlacement" Value="Right"/>
								</MultiTrigger.Conditions>
								<Setter Property="Margin" Value="-1,-2,-2,-2"/>
							</MultiTrigger>
						</ControlTemplate.Triggers>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
	</Application.Resources>
</Application>

Ich hab auch die App.xaml angehängt (gleicher Code wie oben). Allerdings umbeannt auf App.txt (sonst lässt es sich nicht anhängen).

mfG Gü

[Günther Weber]

Danke, werd ich am WE mal genau studieren.

Geändert von gfoidl (Gestern um 21:46 Uhr) Grund: Link umgewandelt

Prima. Ich hatte ein FireFox Update installiert und da hat mir gestern das Plugin gefehlt. Und beim Titel hätte ich ja selbst schon etwas kreativer sein können...