wpfchrometabs-mvvm
wpfchrometabs-mvvm copied to clipboard
[Feature] Change TabControl to the latest Chrome design
Description
Change TabControl style to the latest Google Chrome design.
To Reproduce
N/a
Expected behavior
N/a
Additional context
I managed to recreate shape for the close button:
<Style TargetType="{x:Type Button}"
x:Key="CloseButtonStyle">
<Style.Resources>
<sys:Double x:Key="CloseButtonWidth">7</sys:Double>
<sys:Double x:Key="CloseCircleWidth">16</sys:Double>
<sys:Double x:Key="CloseButtonOffset">4.5</sys:Double>
</Style.Resources>
<Setter Property="Height"
Value="{StaticResource CloseCircleWidth}" />
<Setter Property="Width"
Value="{StaticResource CloseCircleWidth}" />
<Setter Property="VerticalAlignment"
Value="Center" />
<Setter Property="HorizontalAlignment"
Value="Center" />
<Setter Property="Background"
Value="Transparent" />
<Setter Property="Foreground"
Value="#45494C" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Canvas Background="Transparent"
x:Name="CloseButton"
Width="{StaticResource CloseCircleWidth}"
Height="{StaticResource CloseCircleWidth}">
<Ellipse Width="{StaticResource CloseCircleWidth}"
Fill="{TemplateBinding Background}"
Height="{StaticResource CloseCircleWidth}" />
<Canvas Canvas.Left="{StaticResource CloseButtonOffset}"
Canvas.Top="{StaticResource CloseButtonOffset}"
Background="Transparent"
Width="{StaticResource CloseButtonWidth}"
Height="{StaticResource CloseButtonWidth}">
<Line X1="0"
Y1="0"
X2="{StaticResource CloseButtonWidth}"
Y2="{StaticResource CloseButtonWidth}"
Stroke="{TemplateBinding Foreground}"
StrokeThickness="1.5" />
<Line X1="0"
Y1="{StaticResource CloseButtonWidth}"
X2="{StaticResource CloseButtonWidth}"
Y2="0"
Stroke="{TemplateBinding Foreground}"
StrokeThickness="1.5" />
</Canvas>
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter Property="Background"
Value="#DCDCDD" />
</Trigger>
</Style.Triggers>
</Style>
TabItem shape is calculated via TabShape class. It is hard to make any changes through code. I think that it would be better if style is given via XAML (possibility to be styled via Blend in future).
Yes, you are right, it's pretty awkward as it is. I made some changes in e1a2555ec9ed582bbe1f2ae42fb9c9bd8e543884 so you can supply a Path shape in xaml, so you can put it in astyle. PR's are always welcome :)