Skip to content

Commit 5ea58a6

Browse files
ButchersBoyButchersBoy
committed
more styles to help you get shit right
1 parent 89e77af commit 5ea58a6

File tree

7 files changed

+97
-76
lines changed

7 files changed

+97
-76
lines changed

‎MaterialDesignColors.WpfExample/CardsWindow.xaml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,15 +37,15 @@
3737
<TextBlock TextWrapping="Wrap" VerticalAlignment="Center">A great way to keep fit and forget about the constant grind of IT.</TextBlock>
3838
</StackPanel>
3939
<StackPanel HorizontalAlignment="Right" Grid.Row="2" Orientation="Horizontal" Margin="8">
40-
<Button Style="{StaticResource MaterialDesignFlatButton}" Width="30" Padding="2 0 2 0">
40+
<Button Style="{StaticResource MaterialDesignToolButton}" Width="30" Padding="2 0 2 0">
4141
<Viewbox Width="16" Height="16">
4242
<Canvas Width="24" Height="24">
4343
<Path Data="M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z"
4444
Fill="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=Foreground}" />
4545
</Canvas>
4646
</Viewbox>
4747
</Button>
48-
<Button Style="{StaticResource MaterialDesignFlatButton}" Width="30" Padding="2 0 2 0">
48+
<Button Style="{StaticResource MaterialDesignToolButton}" Width="30" Padding="2 0 2 0">
4949
<Viewbox Width="16" Height="16">
5050
<Canvas Width="24" Height="24">
5151
<Path Data="M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5C2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z"

‎MaterialDesignColors.WpfExample/ColorZoneWindow.xaml

Lines changed: 84 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -12,70 +12,88 @@
1212
Background="{DynamicResource MaterialDesignPaper}"
1313
FontFamily="pack://application:,,,/MaterialDesignThemes.Wpf;component/Resources/Roboto/#Roboto"
1414
Title="Colour Zones" Height="600" Width="800">
15-
<StackPanel Margin="16">
16-
<TextBlock FontSize="16">Colour Zones</TextBlock>
17-
<TextBlock TextWrapping="Wrap" Margin="0 16 0 0">The ColorZone control allows you to easily define striking blocks of colour to give your application extra clarity and style, whilst still remaining within the bounds of your Material Design palette.</TextBlock>
18-
<TextBlock Margin="0 16 0 0" FontSize="10">Invert the basic paper/body colours.</TextBlock>
19-
<wpf:ColorZone Mode="Inverted" Padding="16">
20-
<StackPanel Orientation="Horizontal">
21-
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
22-
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
23-
</StackPanel>
24-
</wpf:ColorZone>
25-
<TextBlock Margin="0 16 0 0" FontSize="10">Use primary light back and fore colours.</TextBlock>
26-
<wpf:ColorZone Mode="PrimaryLight" Padding="16">
27-
<StackPanel Orientation="Horizontal">
28-
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
29-
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
30-
</StackPanel>
31-
</wpf:ColorZone>
32-
<TextBlock Margin="0 16 0 0" FontSize="10">Use primary mid colours, and nest colour zones!</TextBlock>
33-
<wpf:ColorZone Mode="PrimaryMid" Padding="16">
34-
<StackPanel Orientation="Horizontal">
35-
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
36-
<wpf:ColorZone Mode="Standard" Padding="8 4 8 4" CornerRadius="2"
37-
Margin="16 0 0 0"
38-
Effect="{DynamicResource MaterialDesignShadowDepth1}">
39-
<Grid>
40-
<Grid.ColumnDefinitions>
41-
<ColumnDefinition Width="Auto" />
42-
<ColumnDefinition Width="*" />
43-
<ColumnDefinition Width="Auto" />
44-
</Grid.ColumnDefinitions>
45-
<Button Style="{DynamicResource MaterialDesignToolButton}">
46-
<Viewbox Width="16" Height="16" VerticalAlignment="Center" Opacity=".56">
47-
<Canvas Width="24" Height="24">
48-
<Path Data="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"
49-
Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=wpf:ColorZone}, Path=Foreground}" />
50-
</Canvas>
51-
</Viewbox>
52-
</Button>
53-
<TextBox Grid.Column="1" Margin="8 0 0 0" wpf:TextField.Hint="Build a search bar" MinWidth="200" VerticalAlignment="Center" />
54-
<Button Style="{DynamicResource MaterialDesignToolButton}" Grid.Column="2">
55-
<Viewbox Width="16" Height="16" Margin="8 0 0 0" Opacity=".56">
56-
<Canvas Width="24" Height="24">
57-
<Path Data="M12,2A3,3 0 0,1 15,5V11A3,3 0 0,1 12,14A3,3 0 0,1 9,11V5A3,3 0 0,1 12,2M19,11C19,14.53 16.39,17.44 13,17.93V21H11V17.93C7.61,17.44 5,14.53 5,11H7A5,5 0 0,0 12,16A5,5 0 0,0 17,11H19Z"
58-
Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=wpf:ColorZone}, Path=Foreground}" />
59-
</Canvas>
60-
</Viewbox>
61-
</Button>
62-
</Grid>
63-
</wpf:ColorZone>
64-
</StackPanel>
65-
</wpf:ColorZone>
66-
<TextBlock Margin="0 16 0 0" FontSize="10">Add in a corner radius and shadow.</TextBlock>
67-
<wpf:ColorZone Mode="PrimaryDark" Padding="16" CornerRadius="3" Effect="{DynamicResource MaterialDesignShadowDepth3}" Margin="2">
68-
<StackPanel Orientation="Horizontal">
69-
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
70-
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
71-
</StackPanel>
72-
</wpf:ColorZone>
73-
<TextBlock Margin="0 16 0 0" FontSize="10">Use accent back and fore colours.</TextBlock>
74-
<wpf:ColorZone Mode="Accent" Padding="16">
75-
<StackPanel Orientation="Horizontal">
76-
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
77-
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
78-
</StackPanel>
79-
</wpf:ColorZone>
80-
</StackPanel>
15+
<ScrollViewer>
16+
<StackPanel Margin="16">
17+
<TextBlock FontSize="16">Colour Zones</TextBlock>
18+
<TextBlock TextWrapping="Wrap" Margin="0 16 0 0">The ColorZone control allows you to easily define striking blocks of colour to give your application extra clarity and style, whilst still remaining within the bounds of your Material Design palette.</TextBlock>
19+
<TextBlock Margin="0 16 0 0" FontSize="10">Invert the basic paper/body colours.</TextBlock>
20+
<wpf:ColorZone Mode="Inverted" Padding="16">
21+
<DockPanel>
22+
<StackPanel Orientation="Horizontal">
23+
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
24+
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
25+
</StackPanel>
26+
<Button Style="{DynamicResource MaterialDesignToolForegroundButton}" DockPanel.Dock="Right" HorizontalAlignment="Right">
27+
<Viewbox Width="16" Height="16">
28+
<Canvas Width="24" Height="24">
29+
<Path Data="M2,21L23,12L2,3V10L17,12L2,14V21Z" Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button}, Path=Foreground}" />
30+
</Canvas>
31+
</Viewbox>
32+
</Button>
33+
</DockPanel>
34+
</wpf:ColorZone>
35+
<TextBlock Margin="0 16 0 0" FontSize="10">Use primary light back and fore colours.</TextBlock>
36+
<wpf:ColorZone Mode="PrimaryLight" Padding="16">
37+
<StackPanel Orientation="Horizontal">
38+
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
39+
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
40+
</StackPanel>
41+
</wpf:ColorZone>
42+
<TextBlock Margin="0 16 0 0" FontSize="10">Use primary mid colours, and nest colour zones!</TextBlock>
43+
<wpf:ColorZone Mode="PrimaryMid" Padding="16">
44+
<StackPanel Orientation="Horizontal">
45+
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
46+
<wpf:ColorZone Mode="Standard" Padding="8 4 8 4" CornerRadius="2" Panel.ZIndex="1"
47+
Margin="16 0 0 0"
48+
Effect="{DynamicResource MaterialDesignShadowDepth1}">
49+
<Grid>
50+
<Grid.ColumnDefinitions>
51+
<ColumnDefinition Width="Auto" />
52+
<ColumnDefinition Width="*" />
53+
<ColumnDefinition Width="Auto" />
54+
</Grid.ColumnDefinitions>
55+
<Button Style="{DynamicResource MaterialDesignToolButton}">
56+
<Viewbox Width="16" Height="16" VerticalAlignment="Center" Opacity=".56">
57+
<Canvas Width="24" Height="24">
58+
<Path Data="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"
59+
Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=wpf:ColorZone}, Path=Foreground}" />
60+
</Canvas>
61+
</Viewbox>
62+
</Button>
63+
<TextBox Grid.Column="1" Margin="8 0 0 0" wpf:TextField.Hint="Build a search bar" MinWidth="200" VerticalAlignment="Center" />
64+
<Button Style="{DynamicResource MaterialDesignToolButton}" Grid.Column="2">
65+
<Viewbox Width="16" Height="16" Margin="8 0 0 0" Opacity=".56">
66+
<Canvas Width="24" Height="24">
67+
<Path Data="M12,2A3,3 0 0,1 15,5V11A3,3 0 0,1 12,14A3,3 0 0,1 9,11V5A3,3 0 0,1 12,2M19,11C19,14.53 16.39,17.44 13,17.93V21H11V17.93C7.61,17.44 5,14.53 5,11H7A5,5 0 0,0 12,16A5,5 0 0,0 17,11H19Z"
68+
Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=wpf:ColorZone}, Path=Foreground}" />
69+
</Canvas>
70+
</Viewbox>
71+
</Button>
72+
</Grid>
73+
</wpf:ColorZone>
74+
<Button Style="{DynamicResource MaterialDesignToolForegroundButton}" Margin="8 0 0 0" Panel.ZIndex="0">
75+
<Viewbox Width="16" Height="16">
76+
<Canvas Width="24" Height="24">
77+
<Path Data="M2,21L23,12L2,3V10L17,12L2,14V21Z" Fill="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=Button}, Path=Foreground}" />
78+
</Canvas>
79+
</Viewbox>
80+
</Button>
81+
</StackPanel>
82+
</wpf:ColorZone>
83+
<TextBlock Margin="0 16 0 0" FontSize="10">Add in a corner radius and shadow.</TextBlock>
84+
<wpf:ColorZone Mode="PrimaryDark" Padding="16" CornerRadius="3" Effect="{DynamicResource MaterialDesignShadowDepth3}" Margin="2">
85+
<StackPanel Orientation="Horizontal">
86+
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
87+
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
88+
</StackPanel>
89+
</wpf:ColorZone>
90+
<TextBlock Margin="0 16 0 0" FontSize="10">Use accent back and fore colours.</TextBlock>
91+
<wpf:ColorZone Mode="Accent" Padding="16">
92+
<StackPanel Orientation="Horizontal">
93+
<ToggleButton Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
94+
<TextBlock VerticalAlignment="Center" Margin="16 0 0 0">Material Design In XAML Toolkit</TextBlock>
95+
</StackPanel>
96+
</wpf:ColorZone>
97+
</StackPanel>
98+
</ScrollViewer>
8199
</Window>

‎MaterialDesignColors.WpfExample/Palette.xaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
</Border>
3838
<Border Background="{DynamicResource SecondaryAccentBrush}"
3939
Grid.Row="4">
40-
<TextBlock>Accent</TextBlock>
40+
<TextBlock Foreground="{DynamicResource SecondaryAccentForegroundBrush}">Accent</TextBlock>
4141
</Border>
4242
</Grid>
4343
</UserControl>

‎MaterialDesignColors.WpfExample/PaletteSelectorWindow.xaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
xmlns:wpf="clr-namespace:MaterialDesignThemes.Wpf;assembly=MaterialDesignThemes.Wpf"
88
xmlns:materialDesignColors="clr-namespace:MaterialDesignColors;assembly=MaterialDesignColors"
99
mc:Ignorable="d"
10-
Title="PaletteSelectorWindow" Height="600" Width="800"
10+
Title="Palette Selector" Height="600" Width="800"
1111
TextElement.Foreground="{DynamicResource MaterialDesignBody}"
1212
Background="{DynamicResource MaterialDesignPaper}"
1313
FontFamily="pack://application:,,,/MaterialDesignThemes.Wpf;component/Resources/Roboto/#Roboto"

‎MaterialDesignColors.WpfExample/ProgressWindow.xaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
44
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
55
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
6+
Background="{DynamicResource MaterialDesignPaper}"
67
mc:Ignorable="d"
78
Title="Progress Indicators" Height="300" Width="600" Left="40" Top="40">
89
<Grid>

‎MaterialDesignThemes.Wpf/Themes/Generic.xaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -262,6 +262,7 @@
262262
<Style TargetType="{x:Type local:ColorZone}">
263263
<Setter Property="Background" Value="{DynamicResource MaterialDesignPaper}" />
264264
<Setter Property="Foreground" Value="{DynamicResource MaterialDesignBody}" />
265+
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
265266
<Setter Property="VerticalAlignment" Value="Top" />
266267
<Setter Property="IsTabStop" Value="False" />
267268
<Setter Property="Template">

‎MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.Button.xaml

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -120,15 +120,16 @@
120120

121121
<Style x:Key="MaterialDesignToolButton" TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignFlatButton}">
122122
<Setter Property="Foreground" Value="#616161"/>
123-
<!--
124-
<Setter Property="Width" Value="40"/>
125-
<Setter Property="Height" Value="40"/>
126-
-->
127-
<Setter Property="FontSize" Value="18"/>
128123
<Setter Property="Padding" Value="4"/>
129124
<Setter Property="wpf:VisualFeedbackAssist.ClipToBounds" Value="False"/>
130125
</Style>
131-
126+
127+
<Style x:Key="MaterialDesignToolForegroundButton" TargetType="{x:Type Button}" BasedOn="{StaticResource MaterialDesignFlatButton}">
128+
<Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"/>
129+
<Setter Property="Padding" Value="4"/>
130+
<Setter Property="wpf:VisualFeedbackAssist.ClipToBounds" Value="False"/>
131+
</Style>
132+
132133
<Style x:Key="MaterialDesignFloatingActionButton" TargetType="{x:Type Button}">
133134
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
134135
<Setter Property="Background" Value="{DynamicResource PrimaryHueMidBrush}"/>

0 commit comments

Comments
 (0)