टैब आइटम और टैब नियंत्रण सीमा शैली

Question

मैं टैब नियंत्रण सीमा को कैसे शैलीबद्ध करूं ताकि चयनित टैब आइटम के नीचे कोई रेखा न हो?

ये अब तक मेरी टैब नियंत्रण और टैब आइटम शैलियों रहे हैं।

<!-- Tab control styling --> 
     <Style TargetType="{x:Type TabControl}"> 
      <Setter Property="Padding" Value="10,5,10,5" /> 
      <Setter Property="Margin" Value="3.5" /> 
      <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" /> 
     </Style> 
     <!-- Tab item styling --> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type TabItem}"> 
         <Grid> 
          <Border 
           Name="Border" 
           Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" 
           BorderBrush="Black" 
           BorderThickness="1,1,1,0" 
           CornerRadius="3,3,0,0" 
           MinWidth="120"> 
            <ContentPresenter x:Name="ContentSite" 
             VerticalAlignment="Center" 
             HorizontalAlignment="Center" 
             ContentSource="Header" 
             Margin="12,2,12,2"/> 
          </Border> 
         </Grid> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsFocused" Value="True" > 
           <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" /> 
           <Setter Property="HeaderTemplate"> 
            <Setter.Value> 
             <DataTemplate> 
              <TextBlock FontWeight="Bold" Text="{Binding}"/> 
             </DataTemplate> 
            </Setter.Value> 
           </Setter> 
          </Trigger> 
          <Trigger Property="IsMouseOver" Value="True" > 
           <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" /> 
           <Setter Property="HeaderTemplate"> 
            <Setter.Value> 
             <DataTemplate> 
              <TextBlock FontWeight="Bold" Text="{Binding}"/> 
             </DataTemplate> 
            </Setter.Value> 
           </Setter> 
          </Trigger> 
          <Trigger Property="IsSelected" Value="True" > 
           <Setter Property="Background" TargetName="Border" Value="{DynamicResource {x:Static SystemColors.ControlLightBrushKey}}" /> 
           <Setter Property="HeaderTemplate"> 
            <Setter.Value> 
             <DataTemplate> 
              <TextBlock FontWeight="Bold" Text="{Binding}"/> 
             </DataTemplate> 
            </Setter.Value> 
           </Setter> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

मैं पर के रूप में डिफ़ॉल्ट टैब आइटम टेम्पलेट लाइन नहीं है टैब आइटम नियंत्रण टेम्पलेट ओवरलोड तो मैं एक मुद्दा नहीं है इसे नीचे बिना नज़र स्क्रीनशॉट में दिखाया गया है को प्राप्त कर सकते हैं चयनित टैब मैं अब तक ऐसा करने में सक्षम नहीं हूं। आपकी सहायता के लिए धन्यवाद.

Answer 1

नीचे एक्सएएमएल यह है कि मैंने इस समस्या को हल करने के लिए टैबकंट्रोल को कैसे ओवरराइड किया है। जानकारी का मुख्य भाग MarginHeaderPanel की संपत्ति है। आप देखेंगे कि नीचे मार्जिन -1 है, जो उस रेखा को कवर करने के लिए पर्याप्त रूप से नीचे चला जाता है।

<Setter Property="Template"> 
     <Setter.Value> 

      <ControlTemplate TargetType="{x:Type TabControl}"> 
       <Grid KeyboardNavigation.TabNavigation="Local"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 

        <TabPanel x:Name="HeaderPanel" 
           Grid.Row="0" 
           Panel.ZIndex="1" 
           Margin="0,0,4,-1" 
           IsItemsHost="True" 
           KeyboardNavigation.TabIndex="1" 
           Background="Transparent" /> 

        <Border x:Name="Border" 
          Grid.Row="1" 
          BorderThickness="1" 
          KeyboardNavigation.TabNavigation="Local" 
          KeyboardNavigation.DirectionalNavigation="Contained" 
          KeyboardNavigation.TabIndex="2"> 

         <Border.Background> 
          <SolidColorBrush Color="White"/> 
         </Border.Background> 

         <Border.BorderBrush> 
          <SolidColorBrush Color="White"/> 
         </Border.BorderBrush> 

         <ContentPresenter x:Name="PART_SelectedContentHost" 
              Margin="4" 
              ContentSource="SelectedContent" /> 
        </Border> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 2

अतीत में मैं TabItem बनाकर इस कार्य किया है उसे थोड़ा और आगे का विस्तार नीचे तो यह, आवंटित है इसलिए इसकी वास्तव में सीमा तत्व के ऊपर बनाए और यह खाल

मैं याद नहीं कर सकते कि कैसे मैं यह वास्तव में किया था, लेकिन मुझे लगता है कि यह TabItem

Answer 3

संपत्ति जोड़े के तल पर एक नकारात्मक मार्जिन के साथ था Padding="0,0,0,0" टैब नियंत्रण के लिए :-)

Answer 4

टैब कंट्रोल टेम्पलेट को संशोधित करने के बजाय, आप सीमा को कवर करने के लिए दो लाइनों को जोड़कर, और कवर करने के लिए माइनस मार्जिन का उपयोग करके टैबइटेम टेम्पलेट को भी संशोधित कर सकते हैं।

(कृपया "TopLineCover" और "BottomLineCover" सीमाओं पर एक नज़र डालें।)

<Style TargetType="TabItem" BasedOn="{StaticResource {x:Type TabItem}}"> 
    <Setter Property="Foreground" Value="{DynamicResource VsBrush.WindowText}"/> 
    <Setter Property="Background" Value="{DynamicResource VsBrush.Window}"/> 
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
    <Setter Property="VerticalContentAlignment" Value="Stretch"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type TabItem}"> 
       <Grid SnapsToDevicePixels="true"> 
        <Border x:Name="HeaderBorder" Padding="8,3,8,3" BorderThickness="1,1,1,0" 
          Background="{DynamicResource {x:Static commonControls:ColorService.JobViewHeaderBrushKey}}" 
          BorderBrush="{DynamicResource {x:Static commonControls:ColorService.JobViewHeaderBorderBrushKey}}"> 
         <ContentPresenter x:Name="Content" ContentSource="Header" 
              HorizontalAlignment="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" 
              VerticalAlignment="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" 
              /> 
        </Border> 
        <Border x:Name="TopLineCover" BorderThickness="1,1,1,0" Margin="0,-2,0,0" Height="3" Panel.ZIndex="100" 
          Background="{DynamicResource VsBrush.Window}" BorderBrush="{DynamicResource {x:Static commonControls:ColorService.JobViewHeaderBorderBrushKey}}" 
          VerticalAlignment="Top" HorizontalAlignment="Stretch" Visibility="Collapsed"/> 
        <Border x:Name="BottomLineCover" BorderThickness="0,0,0,3" Margin="1,0,1,-2" Panel.ZIndex="100" BorderBrush="{DynamicResource VsBrush.Window}" 
          VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Visibility="Collapsed"/> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsMouseOver" Value="True"/> 
          <Condition Property="IsSelected" Value="False"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="HeaderBorder" Value="{DynamicResource VsBrush.Window}"/> 
        </MultiTrigger> 
        <Trigger Property="IsSelected" Value="True"> 
         <Setter Property="Background" TargetName="HeaderBorder" Value="{DynamicResource VsBrush.Window}"/> 
         <Setter Property="Visibility" TargetName="TopLineCover" Value="Visible"/> 
         <Setter Property="Visibility" TargetName="BottomLineCover" Value="Visible"/> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>