EManning EManning - 1 month ago 15
Vb.net Question

Underline active tab

I'd like to underline the active tab with a thick line and make it a teal color. When the tab is inactive, then the underline should disappear. What I have so far is an underline under each tab but am not sure how to turn it off/on depending on if it's active or not.

<Style TargetType="{x:Type TabItem}">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Foreground" Value="#48637E" />
</Trigger>
<Trigger Property="IsSelected" Value="False">
<Setter Property="Foreground" Value="#B4B4B4" />
</Trigger>
</Style.Triggers>
</Style>


<TabItem>
<TabItem.Header>
<StackPanel >
<TextBlock Text=" FirstTab" FontFamily="Arial" FontSize="14" FontWeight="Bold" />
<TextBlock Text="___________" Foreground="#00A79D" />
</StackPanel>
</TabItem.Header>
</TabItem>


Thanks

Answer

Try this.

<TabControl>
            <TabControl.Resources>
                <Style TargetType="{x:Type TabItem}">
                    <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="Foreground" Value="#48637E" />
                            <Setter Property="HeaderTemplate">
                                <Setter.Value>
                                    <DataTemplate>
                                        <TextBlock Text="{TemplateBinding Content}" TextDecorations="Underline"></TextBlock>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="False">
                            <Setter Property="Foreground" Value="#B4B4B4" />
                            <Setter Property="HeaderTemplate">
                                <Setter.Value>
                                    <DataTemplate>
                                        <TextBlock Text="{TemplateBinding Content}" ></TextBlock>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </TabControl.Resources>
            <TabItem Header="First"></TabItem>
            <TabItem Header="Second"></TabItem>
            <TabItem Header="Third"></TabItem>
        </TabControl>