2017-05-01 67 views
1

UIを作成するのにC#/ WPFを使用しています。WPF:TabControlのヘッダー領域の最大サイズを制限する

私のUIには、タブコントロールのヘッダー領域にユーザーの利便性のためのボタンがあります。

問題は、多くのタブが追加される場合、ある最後の1つ(または、それがマルチ行を有する場合、そのうちの一つ)が取り付けられた画像内の赤色矩形状のものボタンで覆うことができる。

Last tab

TabControlのヘッダー領域の最大幅を制限する方法はありますか?ただし、TabItemのコンテンツ領域の幅は保持していますか?

現在のXAML:

<Grid> 
    <Grid HorizontalAlignment="Stretch"> 
     <TabControl BorderThickness="0,0,0,1" Margin="0,0,0,0"> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
      <TabItem MinWidth="130" Height="27" Content="Title" /> 
     </TabControl> 
    </Grid> 
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Right"> 
     <Button Margin="0,2,5,0" HorizontalAlignment="Left" Height="20" Width="22" VerticalAlignment="top" Content="+" /> 
     <Button Width="65" Height="25" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,1,1" Content="Close" /> 
    </StackPanel> 
</Grid> 

`

注:私の心の上に、私は親をオーバーフローさせるためにTabItems用負のマージンを使用することができるかもしれません(TabControlの)の幅は、それは悪い回避策になる可能性があります。

この場合、どのようなアプローチが良いか教えてください。

答えて

1

あなたがあなた自身のTabControlのスタイルを定義する、またはより具体的にControlTemplateの、このように「ButtonPanel」を挿入することができます。

<TabControl.Style> 
        <Style TargetType="{x:Type TabControl}"> 
         <Setter Property="OverridesDefaultStyle" 
           Value="True" /> 
         <Setter Property="SnapsToDevicePixels" 
           Value="True" /> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate TargetType="{x:Type TabControl}"> 
            <Grid KeyboardNavigation.TabNavigation="Local"> 
             <Grid.RowDefinitions> 
              <RowDefinition Height="Auto" /> 
              <RowDefinition Height="*" /> 
             </Grid.RowDefinitions> 
             <Grid.ColumnDefinitions> 
              <ColumnDefinition Width="*" /> 
              <ColumnDefinition Width="Auto" /> 
             </Grid.ColumnDefinitions> 
             <VisualStateManager.VisualStateGroups> 
              <VisualStateGroup x:Name="CommonStates"> 
               <VisualState x:Name="Disabled"> 
                <Storyboard> 
                 <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" 
                         Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"> 
                  <EasingColorKeyFrame KeyTime="0" 
                       Value="#FFAAAAAA" /> 
                 </ColorAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
              </VisualStateGroup> 
             </VisualStateManager.VisualStateGroups> 
             <TabPanel x:Name="HeaderPanel" 
                Grid.Row="0" 
                Panel.ZIndex="1" 
                Margin="0,0,4,-1" 
                IsItemsHost="True" 
                KeyboardNavigation.TabIndex="1" 
                Background="Transparent" /> 
             <StackPanel x:Name="ButtonPanel" Grid.Column="1" Orientation="Horizontal"> 
              <Button Margin="0,2,5,0" 
                HorizontalAlignment="Left" 
                Height="20" 
                Width="22" 
                VerticalAlignment="top" 
                Content="+" /> 
              <Button Width="65" 
                Height="25" 
                HorizontalAlignment="Right" 
                VerticalAlignment="Top" 
                Margin="0,0,1,1" 
                Content="Close" /> 
             </StackPanel> 
             <Border x:Name="Border" 
               Grid.Row="1" 
               Grid.ColumnSpan="2" 
               BorderThickness="1" 
               CornerRadius="2" 
               KeyboardNavigation.TabNavigation="Local" 
               KeyboardNavigation.DirectionalNavigation="Contained" 
               KeyboardNavigation.TabIndex="2"> 
              <Border.Background> 
               <LinearGradientBrush EndPoint="0.5,1" 
                    StartPoint="0.5,0"> 
                <GradientStop Color="{DynamicResource ContentAreaColorLight}" 
                    Offset="0" /> 
                <GradientStop Color="{DynamicResource ContentAreaColorDark}" 
                    Offset="1" /> 
               </LinearGradientBrush> 
              </Border.Background> 
              <Border.BorderBrush> 
               <SolidColorBrush Color="{DynamicResource BorderMediumColor}" /> 
              </Border.BorderBrush> 
              <ContentPresenter x:Name="PART_SelectedContentHost" 
                   Margin="4" 
                   ContentSource="SelectedContent" /> 
             </Border> 
            </Grid> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </TabControl.Style> 
関連する問題