2016-07-25 9 views
1

ContentPresenterButton(クリックしたときにタブを非表示にする)の外にTabItemのカスタムControlTemplateを定義しました。TabItem ControlTemplate要素可視性

<Style TargetType="{x:Type TabItem}"> 
    <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="TabItem"> 
        <Border> 
          <Grid> 
           <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="*"/> 
             <ColumnDefinition Width="Auto"/> 
           </Grid.ColumnDefinitions> 
           <ContentPresenter ContentSource="Header"/> 
           <Button Grid.Column="1" Content="x" Visibility="Visible"/> 
         </Grid> 
        </Border>  
       </ControlTemplate> 
      </Setter.Value> 
    </Setter> 
</Style> 

私はButtonだけで、特定のTabItemsと他人のためにCollapsedためVisibleになりたいです。 Collapsedの状態がデフォルトであり、特定のタブでVisibleに設定する方法がわかりません。

タブ項目が

<TabItem Header="Normal tab"> 
    <Grid /> 
</TabItem> 
<TabItem Header="Closable tab"> 
    <Grid/> 
</TabItem> 

のようなもので、私はこのButtonを示すべき「開閉可能タブ」が、このButtonを示していない「通常タブ」を持つようにしたい場合は、どのようにこれを行うことができますか?

答えて

1

TabItemのプロパティTagを使用してタイプを識別し、ButtonRelativeSourceというバインディングの中からこのタイプを見ることができます。

<TabControl> 
    <TabControl.Resources> 
     <Style TargetType="{x:Type TabItem}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="TabItem"> 
         <Border BorderThickness="1" BorderBrush="Green" Margin="1"> 
          <Grid> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="*"/> 
            <ColumnDefinition Width="Auto"/> 
           </Grid.ColumnDefinitions> 
           <ContentPresenter ContentSource="Header"/> 
           <Button Grid.Column="1" Content="x"> 
            <Button.Style> 
             <Style TargetType="Button"> 
              <Setter Property="Visibility" Value="Collapsed" /> 
              <Style.Triggers> 
               <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=TabItem}, Path=Tag}" Value="Closable"> 
                <Setter Property="Visibility" Value="Visible" /> 
               </DataTrigger> 
              </Style.Triggers> 
             </Style> 
            </Button.Style> 
           </Button> 
          </Grid> 
         </Border> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </TabControl.Resources> 

    <TabItem Header="Normal tab"> 
     <Grid /> 
    </TabItem> 
    <TabItem Tag="Closable" Header="Closable tab"> 
     <Grid /> 
    </TabItem> 
</TabControl> 

私はこの例が機能するために、彼らは必要ありません、 Borderだけの視覚的な個別のタブに少し属性編集しました。

関連する問題