Category / Section
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
Sample: SfTabControlSample