Tabs Studio Blog (organizing Visual Studio document tabs)

For a long time the close tab button was implemented as an image. The image had the mouse over glow effect, but no pressed state. The close tab button image also allowed accidental activation on the mouse left button up event without corresponding mouse left button down. I’ve resolved both of these shortcomings finally implementing the close tab button as System.Windows.Controls.Button:

Mouse over the new close tab button

<Style x:Key="DefaultCloseTabButtonStyle" TargetType="TabsStudio:CloseTabButton">
    <Setter Property="Margin" Value="2,0,-4,0"/>
    <Setter Property="VerticalAlignment" Value="Top"/>
    <Setter Property="HorizontalAlignment" Value="Right"/>
    <Setter Property="Focusable" Value="False"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TabsStudio:CloseTabButton">
                <ControlTemplate.Resources>
                    <Style TargetType="Image">
                        <Setter Property="Stretch" Value="None"/>
                    </Style>
                </ControlTemplate.Resources>
                <Grid>
<Image Name="Normal"    Source="pack://application:,,,/TabsStudio;component/close_tab_button_normal.png"/>
<Image Name="Pressed"   Source="pack://application:,,,/TabsStudio;component/close_tab_button_pressed.png"   
 Visibility="Collapsed"/>
<Image Name="MouseOver" Source="pack://application:,,,/TabsStudio;component/close_tab_button_mouse_over.png"
 Visibility="Collapsed"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="Normal" Property="Visibility" Value="Collapsed"/>
                        <Setter TargetName="MouseOver" Property="Visibility" Value="Visible"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="Normal" Property="Visibility" Value="Collapsed"/>
                        <Setter TargetName="Pressed" Property="Visibility" Value="Visible"/>
                        <Setter TargetName="MouseOver" Property="Visibility" Value="Collapsed"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsTabSelected" Value="False">
            <Setter Property="Visibility" Value="Collapsed"/>
        </Trigger>
    </Style.Triggers>
</Style>