Skip to content

Commit

Permalink
WinGui: Some cosmetic improvements to the Dark Theme. (Toolbar and Gr…
Browse files Browse the repository at this point in the history 
…oupBox's get a minor improvement)
  • Loading branch information
@sr55
sr55 committed Jan 1, 2020
1 parent 0b089e9 commit 598e93b
Show file tree
Hide file tree
Showing 5 changed files with 141 additions and 25 deletions.
9 changes: 9 additions & 0 deletions win/CS/HandBrakeWPF/HandBrakeWPF.csproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,4 +147,13 @@
</EmbeddedResource>
</ItemGroup>

<ItemGroup>
<Page Update="Themes\Controls\GroupBoxDark.xaml">
<SubType>Designer</SubType>
</Page>
<Page Update="Themes\Controls\ToolbarDark.xaml">
<SubType>Designer</SubType>
</Page>
</ItemGroup>

</Project>
31 changes: 31 additions & 0 deletions win/CS/HandBrakeWPF/Themes/Controls/GroupBoxDark.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<Style TargetType="GroupBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupBox">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border Grid.Row="0" BorderThickness="1,1,1,0" Background="Transparent" BorderBrush="{DynamicResource Ui.Ultralight}">
<Border.Resources>
<Style TargetType="{x:Type Label}">
<Setter Property="Foreground" Value="White"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="FontWeight" Value="Bold" />
</Style>
</Border.Resources>
<!--<ContentPresenter Margin="4" ContentSource="Header" RecognizesAccessKey="True" />-->
<TextBlock Text="{Binding Header, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type GroupBox}}}" FontWeight="Bold" Margin="5,5,0,0" />
</Border>
<Border Grid.Row="1" BorderThickness="1,0,1,1" BorderBrush="{DynamicResource Ui.Ultralight}" Background="Transparent">
<ContentPresenter Margin="4" />
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
88 changes: 88 additions & 0 deletions win/CS/HandBrakeWPF/Themes/Controls/ToolbarDark.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:HandBrakeWPF.Converters">

<converters:BooleanToVisibilityConverter x:Key="darkThemeVisConverter" />

<Style x:Key="ToolBarThumbStyle" TargetType="{x:Type Thumb}">
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Cursor" Value="SizeAll" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Border Background="Transparent" SnapsToDevicePixels="True">
<Rectangle Margin="0,2">
<Rectangle.Fill>
<DrawingBrush Viewport="0,0,4,4" ViewportUnits="Absolute" Viewbox="0,0,8,8" ViewboxUnits="Absolute" TileMode="Tile">
<DrawingBrush.Drawing>
<DrawingGroup>
<GeometryDrawing Brush="#AAA" Geometry="M 4 4 L 4 8 L 8 8 L 8 4 z" />
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

<Style x:Key="ToolBarOverflowButtonStyle" TargetType="{x:Type ToggleButton}">
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="Border" SnapsToDevicePixels="true">
<Border.Style>
<Style>
<Setter Property="Border.Background" Value="{DynamicResource Ui.Light}"/>
<Style.Triggers>
<Trigger Property="Border.IsMouseOver" Value="True">
<Setter Property="Border.Background" Value="{DynamicResource Ui.ContrastLight}" />
</Trigger>
</Style.Triggers>
</Style>
</Border.Style>
<Grid Visibility="{Binding ElementName=Border, Path=IsEnabled, Converter={StaticResource darkThemeVisConverter}, ConverterParameter=false}">
<Path x:Name="Arrow" Fill="White" VerticalAlignment="Bottom" Margin="2,3" Data="M -0.5 3 L 5.5 3 L 2.5 6 Z" HorizontalAlignment="Center" />
<ContentPresenter />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

<Style x:Key="{x:Type ToolBar}" TargetType="{x:Type ToolBar}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolBar}">
<Border x:Name="Border" BorderThickness="0,0,0,1" BorderBrush="{DynamicResource Ui.ConstrastLight}" Background="{DynamicResource Ui.Light}">
<DockPanel>
<ToggleButton DockPanel.Dock="Right" IsEnabled="{TemplateBinding HasOverflowItems}" Style="{StaticResource ToolBarOverflowButtonStyle}" ClickMode="Press" IsChecked="{Binding IsOverflowOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
<Popup x:Name="OverflowPopup" AllowsTransparency="true" Placement="Bottom" StaysOpen="false" Focusable="false" PopupAnimation="Slide" IsOpen="{Binding IsOverflowOpen, RelativeSource={RelativeSource TemplatedParent}}">
<Border x:Name="DropDownBorder" BorderThickness="1" BorderBrush="{DynamicResource Ui.ConstrastLight}" Background="{DynamicResource Ui.Dark}">
<ToolBarOverflowPanel x:Name="PART_ToolBarOverflowPanel" Margin="2" WrapWidth="200" Focusable="true" FocusVisualStyle="{x:Null}" KeyboardNavigation.TabNavigation="Cycle" KeyboardNavigation.DirectionalNavigation="Cycle" />
</Border>
</Popup>
</ToggleButton>

<Thumb x:Name="ToolBarThumb" Style="{StaticResource ToolBarThumbStyle}" Width="10" />
<ToolBarPanel x:Name="PART_ToolBarPanel" IsItemsHost="true" Margin="0,1,2,2" />
</DockPanel>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsOverflowOpen" Value="true">
<Setter TargetName="ToolBarThumb" Property="IsEnabled" Value="false" />
</Trigger>
<Trigger Property="ToolBarTray.IsLocked" Value="true">
<Setter TargetName="ToolBarThumb" Property="Visibility" Value="Collapsed" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
11 changes: 4 additions & 7 deletions win/CS/HandBrakeWPF/Themes/Dark.xaml
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<!--
#252525 - Dark
#363636 - Mid
Expand All @@ -22,7 +23,6 @@
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="WhiteSmoke" />
<SolidColorBrush x:Key="{x:Static SystemColors.MenuTextBrushKey}" Color="WhiteSmoke" />
<SolidColorBrush x:Key="{x:Static SystemColors.ControlDarkBrushKey}" Color="WhiteSmoke" />


<!-- Listbox -->
<Style TargetType="ListBox">
Expand All @@ -36,12 +36,6 @@
<Setter Property="HasDropShadow" Value="True" />
</Style>

<!-- Toolbar -->
<Style TargetType="ToolBar">
<Setter Property="Background" Value="Black" />
<Setter Property="Foreground" Value="White" />
</Style>

<!-- StatusBar -->
<Style TargetType="StatusBar">
<Setter Property="Background" Value="{DynamicResource Ui.Mid}" />
Expand All @@ -55,6 +49,7 @@

<Style TargetType="{x:Type TextBlock}">
<Setter Property="Foreground" Value="White"/>
<Setter Property="VerticalAlignment" Value="Center"/>
</Style>

<!-- Tab Control -->
Expand Down Expand Up @@ -107,6 +102,8 @@
<ResourceDictionary Source="Controls/ComboBoxDark.xaml" />
<ResourceDictionary Source="Controls/ButtonDark.xaml" />
<ResourceDictionary Source="Controls/ContextMenuDark.xaml" />
<ResourceDictionary Source="Controls/ToolbarDark.xaml" />
<ResourceDictionary Source="Controls/GroupBoxDark.xaml" />
</ResourceDictionary.MergedDictionaries>

</ResourceDictionary>
27 changes: 9 additions & 18 deletions win/CS/HandBrakeWPF/Views/MainView.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -610,7 +610,7 @@
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Header="Presets"
Margin="0,0,5,5"
Margin="0,5,5,5"
MaxWidth="270"
IsEnabled="{Binding HasSource, Converter={StaticResource booleanConverter}, ConverterParameter=false}"
Visibility="{Binding IsPresetPanelShowing, Converter={StaticResource boolToVisConverter}}">
Expand Down Expand Up @@ -726,10 +726,8 @@
<Button cal:Message.Attach="[Event Click] = [Action PresetAdd]" AutomationProperties.Name="Add Preset" ToolTip="{x:Static Properties:ResourcesTooltips.MainView_AddPreset}">
<Button.Content>
<StackPanel Orientation="Horizontal">
<Image Width="20"
Height="20"
Source="{Binding Converter={StaticResource themeConverter}, ConverterParameter='Add.png'}"
/>
<Image Width="18" Height="18" SnapsToDevicePixels="True"
Source="{Binding Converter={StaticResource themeConverter}, ConverterParameter='Add.png'}" />
<TextBlock Margin="2,0,0,0"
VerticalAlignment="Center"
Style="{StaticResource textBlockOrangeStyle}"
Expand All @@ -742,16 +740,12 @@
<Button Background="Transparent" cal:Message.Attach="[Event Click] = [Action PresetRemove]" AutomationProperties.Name="Remove Preset" ToolTip="{x:Static Properties:ResourcesTooltips.MainView_RemovePreset}">
<Button.Content>
<StackPanel Orientation="Horizontal">
<Image Width="20"
Height="20"
Source="{Binding Converter={StaticResource themeConverter}, ConverterParameter='Remove.png'}"
SnapsToDevicePixels="True"
/>
<Image Width="18" Height="18"
Source="{Binding Converter={StaticResource themeConverter}, ConverterParameter='Remove.png'}" SnapsToDevicePixels="True" />
<TextBlock Margin="2,0,0,0"
VerticalAlignment="Center"
Style="{StaticResource textBlockOrangeStyle}"
Text="{x:Static Properties:Resources.MainView_Remove}"
/>
Text="{x:Static Properties:Resources.MainView_Remove}" />
</StackPanel>
</Button.Content>
</Button>
Expand All @@ -760,16 +754,13 @@
<MenuItem ToolBar.OverflowMode="Never">
<MenuItem.Header>
<StackPanel Orientation="Horizontal">
<Image Width="20"
Height="20"
<Image Width="20" Height="20" SnapsToDevicePixels="True"
Source="{Binding Converter={StaticResource themeConverter}, ConverterParameter='Advanced.png'}"
RenderOptions.BitmapScalingMode="Linear"
/>
RenderOptions.BitmapScalingMode="Linear" />
<TextBlock Margin="2,0,0,0"
VerticalAlignment="Center"
Style="{StaticResource textBlockOrangeStyle}"
Text="{x:Static Properties:Resources.MainView_Options}"
/>
Text="{x:Static Properties:Resources.MainView_Options}" />
</StackPanel>
</MenuItem.Header>
<MenuItem Header="{x:Static Properties:Resources.MainView_SetDefault}" cal:Message.Attach="[Event Click] = [Action PresetSetDefault]" />
Expand Down

0 comments on commit 598e93b

Please sign in to comment.