TabControl TabItems WPF中的Boarder颜色

时间:2015-07-13 13:40:18

标签: wpf xaml wpf-controls

我有以下XAML代码,它呈现以下TabControl

  <UserControl x:Class="WpfControlLibrary1.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-                                                            
    compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300"
          xmlns:Microsoft_Windows_Themes="clr-   
  namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Classic"
  Height="423" Width="639"  MinHeight="300"      MinWidth="500"        
  MaxHeight="470"      MaxWidth="673"
    xmlns:dxwui="http://schemas.devexpress.com/winfx/2008/xaml/windowsui"   
  xmlns:dxm="http://schemas.devexpress.com/winfx/2008/xaml/map">
  <UserControl.Resources>
    <SolidColorBrush x:Key="OutlookButtonForeground" Color="White" >


    </SolidColorBrush>

    <LinearGradientBrush x:Key="OutlookButtonBackground" EndPoint="0.5,1"  
     StartPoint="0.5,0">
        <GradientStop Color="#0264AD" Offset="0"/>
        <GradientStop Color="#0264AD" Offset="0.445"/>
        <GradientStop Color="#0264AD" Offset="1"/>
        <GradientStop Color="#0264AD" Offset="0.53"/>
    </LinearGradientBrush>

    <LinearGradientBrush x:Key="OutlookButtonHighlight" EndPoint="0.5,1"  
       StartPoint="0.5,0">
        <GradientStop Color="#03538E" Offset="0"/>
        <GradientStop Color="#03538E" Offset="0.0967"/>
        <GradientStop Color="#03538E" Offset="0.2580"/>
        <GradientStop Color="#03538E" Offset="0.3870"/>
        <GradientStop Color="#03538E" Offset="0.9677"/>
        <GradientStop Color="#03538E" Offset="1"/>
    </LinearGradientBrush>

    <Style x:Key="OutlookTabControlStyle" TargetType="{x:Type TabControl}">
        <Setter Property="Foreground" 
        Value="{DynamicResource  OutlookButtonForeground}"/>
        <Setter Property="Background" Value="White"/>
        <Setter Property="BorderBrush" Value="White"/>
        <Setter Property="BorderThickness" Value="3"/>
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="MinWidth" Value="10"/>
        <Setter Property="MinHeight" Value="10"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabControl}">
                    <Grid ClipToBounds="true" SnapsToDevicePixels="true"
                  KeyboardNavigation.TabNavigation="Local">
                        <Grid.RowDefinitions>
                            <RowDefinition x:Name="RowDefinition0"  
                                Height="Auto"/>
                            <RowDefinition x:Name="RowDefinition1"  
                           Height="*"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition x:Name="ColumnDefinition0"/>
                            <ColumnDefinition x:Name="ColumnDefinition1"  
                            Width="0"/>
                        </Grid.ColumnDefinitions>
                        <Grid x:Name="ContentPanel" Grid.Column="0"  
                                  Grid.Row="1"
                    KeyboardNavigation.DirectionalNavigation="Contained"
                    KeyboardNavigation.TabIndex="2"
                    KeyboardNavigation.TabNavigation="Local">
                            <Microsoft_Windows_Themes:ClassicBorderDecorator
                    Background="White"
                    BorderBrush="White"
                    BorderStyle="Raised"
                    BorderThickness="{TemplateBinding BorderThickness}">
                                <ContentPresenter SnapsToDevicePixels=
                        "{TemplateBinding SnapsToDevicePixels}"  
                          Margin="2,2,2,2"
                        x:Name="PART_SelectedContentHost"
                        ContentSource="SelectedContent"/>

              </Microsoft_Windows_Themes:ClassicBorderDecorator>
                        </Grid>
                        <StackPanel HorizontalAlignment="Stretch"  
                          Margin="0,-2,0,0"
                x:Name="HeaderPanel" VerticalAlignment="Top" Width="Auto" 
            Height="Auto" Grid.Row="1" IsItemsHost="True"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="TabStripPlacement"  
                       Value="Bottom">
                            <Setter Property="Grid.Row"
                    TargetName="ContentPanel" Value="0"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition1" Value="Auto"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Left">
                            <Setter Property="Grid.Row"
                        TargetName="ContentPanel" Value="0"/>
                            <Setter Property="Grid.Column"
                        TargetName="ContentPanel" Value="1"/>
                            <Setter Property="Width"
                        TargetName="ColumnDefinition0" Value="Auto"/>
                            <Setter Property="Width"
                        TargetName="ColumnDefinition1" Value="*"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition1" Value="0"/>
                        </Trigger>
                        <Trigger Property="TabStripPlacement" Value="Right">
                            <Setter Property="Grid.Row"
                        TargetName="ContentPanel" Value="0"/>
                            <Setter Property="Grid.Column"
                        TargetName="ContentPanel" Value="0"/>
                            <Setter Property="Width"
                        TargetName="ColumnDefinition0" Value="*"/>
                            <Setter Property="Width"
                        TargetName="ColumnDefinition1" Value="Auto"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition0" Value="*"/>
                            <Setter Property="Height"
                        TargetName="RowDefinition1" Value="0"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground"
                        Value="{DynamicResource
                        {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="OutlookTabItemStyle" TargetType="{x:Type TabItem}">
        <!--BorderBrush="#FF6593CF"-->
        <Setter Property="Padding" Value="12,2,12,2"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static  
            SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="Background" Value="{DynamicResource {x:Static  
               SystemColors.ControlBrushKey}}"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Border SnapsToDevicePixels="true" x:Name="shadow"  
                Background="{TemplateBinding Background}"              
                BorderThickness="0.5"  >
                        <ContentPresenter SnapsToDevicePixels= " 
                          {TemplateBinding SnapsToDevicePixels}"
                    Margin="{TemplateBinding Padding}"     
                    VerticalAlignment="{Binding  
                 Path=VerticalContentAlignment, 
            RelativeSource={RelativeSource AncestorType={x:Type    
        ItemsControl}}}"   ContentSource="Header" RecognizesAccessKey="True"
                        HorizontalAlignment="Left"  />
                        <Border.BorderBrush>
                            <SolidColorBrush Color="White"> 
                              </SolidColorBrush>
                        </Border.BorderBrush>

                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="Selector.IsSelected"  
                          Value="True">
                            <!--<Setter Property="Background"  
                 TargetName="shadow" Value="{DynamicResource  
                OutlookButtonHighlight}"/>-->
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

   </UserControl.Resources>
   <Grid Height="420" Width="664">

    <TabControl Name="RouteProcessingTabControl" VerticalAlignment="Stretch"  
     Width="200" Height="Auto" TabStripPlacement="Top" Style=" 
   {DynamicResource OutlookTabControlStyle}" HorizontalAlignment="Left">
        <TabItem Height="60"    Style="{DynamicResource  
     OutlookTabItemStyle}" Background="{DynamicResource              
        OutlookButtonBackground}" Foreground="{DynamicResource  
      OutlookButtonForeground}">
            <Grid DataContext="{Binding}" />
            <TabItem.Header>
                <StackPanel Orientation="Horizontal" Margin="0,2,0,0">
                    <Image Height="25"  
            Source="Image\RoutingPreferences.png"></Image>
                    <TextBlock Text="Routing Preferences" Margin="2,0,0,0"  
              VerticalAlignment="Center" HorizontalAlignment="Left"                
         FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem  Height="60" Style="{DynamicResource OutlookTabItemStyle}" 
      Background="{DynamicResource OutlookButtonBackground}" Foreground="             
      {DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal"  Margin="0,2,0,0">
                    <Image Height="20"  
        Source="Image\HazardousMaterialsRestrictions.png"></Image>
                    <TextBlock Text="Hazardous Materials Restrictions"      
         Width="160" TextWrapping="Wrap" Margin="2,0,0,0"    
        VerticalAlignment="Center" HorizontalAlignment="Left"                     
        FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem  Height="60" Style="{DynamicResource OutlookTabItemStyle}" 
            Background="{DynamicResource OutlookButtonBackground}"  
            Foreground="{DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <Image Height="20" Source="Image\DisplayOption.png">
       </Image>
                    <TextBlock Text="Display Option" Margin="2,0,0,0"      
            VerticalAlignment="Center" HorizontalAlignment="Left" 
                FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem  Height="60" Style="{DynamicResource OutlookTabItemStyle}"       
       Background="{DynamicResource OutlookButtonBackground}" 

        Foreground="{DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <Image Height="20" Source="Image\RoutingCostInputs.png">
               </Image>
                    <TextBlock Text="Routing Cost Inputs" Margin="2,0,0,0"  
            VerticalAlignment="Center" HorizontalAlignment="Left" 
          FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem   Height="60" Style="{DynamicResource OutlookTabItemStyle}" 
          Background="{DynamicResource OutlookButtonBackground}" 
          Foreground="{DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <Image Height="20" Source="Image\RoadWork.png"></Image>
                    <TextBlock Text="RoadWork" Margin="2,0,0,0"  
                 VerticalAlignment="Center" HorizontalAlignment="Left" 
                 FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem  Height="60" Style="{DynamicResource OutlookTabItemStyle}" 
             Background="{DynamicResource OutlookButtonBackground}" 
               Foreground="{DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <Image Height="20" 
               Source="Image\TruckConfiguration.png"></Image>
                    <TextBlock Text="Truck Configuration" Margin="2,0,0,0"  
                    VerticalAlignment="Center" HorizontalAlignment="Left" 
                    FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
        <TabItem  Height="60" Style="{DynamicResource OutlookTabItemStyle}" 
          Background="{DynamicResource OutlookButtonBackground}" 
         Foreground="{DynamicResource OutlookButtonForeground}">
            <Grid/>
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <Image Height="20" Source="Image\Tolls.png"></Image>
                    <TextBlock Text="Tolls" Margin="2,0,0,0"  
                    VerticalAlignment="Center" HorizontalAlignment="Left" 
                     FontWeight="Bold" FontSize="13" />
                </StackPanel>
            </TabItem.Header>
        </TabItem>
       </TabControl>
      </Grid>
     </UserControl>

enter image description here

即使我有Boarder Color White,它产生Slightly Sky Blue寄宿色,这不是我想要的,我想要白色和薄的寄宿生如下图片!谁能在这里建议解决方案?谢谢!

enter image description here

1 个答案:

答案 0 :(得分:1)

这看起来像Layout Rounding问题。尝试将<Border>样式的Template中的OutlookTabItemStyle更改为:

<Border
    x:Name="shadow"
    SnapsToDevicePixels="True"
    UseLayoutRounding="True"
    Background="{TemplateBinding Background}"
    BorderThickness="1"
>