How to draw underline for SelectedTab in SfTabControl?

1 min read

The SfTabControl has option to display underline to indicate the SelectedTab and it can be done by enabling its property named “HighlightOnSelection”.

The following code demonstrates the same.

Code Example: [Xaml]

<!--Customization properties of SfTabControl-->
 
<Style TargetType="syncfusion:SfTabItem" x:Key="TabItemStyle">
 
<Setter Property="SelectedForeground" Value="Green" />
 
<Setter Property="Foreground" Value="Red"/>
 
<Setter Property="SelectedBackground" Value="Green"/>
 
<Setter Property="FontSize" Value="20"/>
 
</Style>
 
<Grid>
 
<!--SfTabControl-->
 
<syncfusion:SfTabControl x:Name="tabControl"  HighlightOnSelection="True" 
 
HorizontalAlignment="Center" VerticalAlignment="Center"
 
ItemContainerStyle="{StaticResource TabItemStyle}" >
 
<syncfusion:SfTabItem Header="Essential Studio" />
 
<syncfusion:SfTabItem Header="Universal Windows" />
 
<syncfusion:SfTabItem Header="Add On" />
 
<syncfusion:SfTabItem Header="Utilities" />
 
<syncfusion:SfTabItem Header="Documentation" />
 
</syncfusion:SfTabControl>
 
</Grid>

Screenshot

TabControl screenshot

Sample: SfTabControlSample

Did you find this information helpful?

Yes

Comments (0)

How to draw underline for SelectedTab in SfTabControl?

Access denied