How to hide the close button in WPF TabSplitter ?

You can hide the close button on the top-right position of the TabSplitter to close TabSplitter items by customizing its template. The template of the TabSplitter can be customized by following these steps.

Right click on the TabSplitter control in the MainWindow designer.
Select Edit Template à Edit a Copy.

Template customizing

Style for the TabSplitter control will be created in MainWindow.xaml.
Change the visibility of the ToggleButton named PART_CloseButton.

MainWindow.xaml

<Window.Resources>
<Style x:Key="TabSplitterStyle1" TargetType="{x:Type syncfusion:TabSplitter}">
<Setter Property="Template">
.
.
.
<ToggleButton x:Name="PART_CloseButton" AllowDrop="False" DockPanel.Dock="Right" Focusable="False" Height="15" Width="15" Visibility="Collapsed">                                                                            <ToggleButton.Command>                                                                   
         <RoutedCommand/>  
 </ToggleButton.Command> 
 <ToggleButton.Template>           
 <ControlTemplate TargetType="{x:Type ButtonBase}"> 
     <syncfusion:Border3D x:Name="brdBack" BorderBrush="Transparent" BorderThickness="1" Margin="1"> 
            <Path x:Name="pathButton" Data="M109,51L216,142 M215,52L109,142" HorizontalAlignment="Center" Height="8" Stretch="Fill" SnapsToDevicePixels="False" Stroke="Black" StrokeThickness="1.5" VerticalAlignment="Center" Width="9"/> 
     </syncfusion:Border3D>
  <ControlTemplate.Triggers> 
         <Trigger Property="IsPressed" Value="True">
                 <Setter Property="IsInverted" TargetName="brdBack" Value="True"/>     
                 <Setter Property="Content" Value="1,1,-1,-1"/>
        </Trigger>
         <Trigger Property="IsMouseOver" Value="True"> 
                 <Setter Property="Background" TargetName="brdBack" Value="#FFCEEDFA"/>
                 <Setter Property="BorderBrush" TargetName="brdBack" Value="#FF3E89F9"/> 
                 <Setter Property="Stroke" TargetName="pathButton" Value="Black"/> 
                 <Setter Property="Fill" TargetName="pathButton" Value="Black"/> 
           </Trigger> 
      </ControlTemplate.Triggers>
 </ControlTemplate>  
</ToggleButton.Template>                                                                    
</ToggleButton>
.
.
.
<Setter Property="MouseOverForeground" Value="Black"/>
</Style>
</Window.Resources>
<Grid>
        <syncfusion:TabSplitter Name="Tabsplit" HideHeaderOnSingleChild="True" Style="{DynamicResource TabSplitterStyle1}">
            <syncfusion:TabSplitterItem Header="tab1">
                <syncfusion:TabSplitterItem.TopPanelItems>
                    <syncfusion:SplitterPage Header="Split1"></syncfusion:SplitterPage>
                </syncfusion:TabSplitterItem.TopPanelItems>
                <syncfusion:TabSplitterItem.BottomPanelItems>
                    <syncfusion:SplitterPage Header="Split2"></syncfusion:SplitterPage>
                </syncfusion:TabSplitterItem.BottomPanelItems>
            </syncfusion:TabSplitterItem>
        </syncfusion:TabSplitter>
</Grid>

Screenshots: TabSplitter_hide close button

View sample in GitHub

Did you find this information helpful?

Yes

Comments (0)

How to hide the close button in WPF TabSplitter ?

Access denied