Skip to content

Commit 2513c5f

Browse files
StefanoRivolta-PrevieroStefanoRivolta-Previero
authored
Add Progressbar to Flat and Outlined buttons (#2481)
organized code with regions
1 parent 57f24ae commit 2513c5f

File tree

1 file changed

+96
-22
lines changed

1 file changed

+96
-22
lines changed

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

Lines changed: 96 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -30,27 +30,28 @@
3030

3131
<SolidColorBrush x:Key="AttentionToActionBrush" Color="{StaticResource MaterialDesignShadow}" Opacity=".23" po:Freeze="True" />
3232

33+
<!--#region Raised Button-->
34+
3335
<Style x:Key="MaterialDesignRaisedButton" TargetType="{x:Type ButtonBase}">
3436
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
3537
<Setter Property="Background" Value="{DynamicResource PrimaryHueMidBrush}"/>
3638
<Setter Property="BorderBrush" Value="{DynamicResource PrimaryHueMidBrush}"/>
3739
<Setter Property="Foreground" Value="{DynamicResource PrimaryHueMidForegroundBrush}"/>
38-
<Setter Property="wpf:ButtonProgressAssist.IndicatorForeground" Value="{DynamicResource PrimaryHueMidForegroundBrush}" />
39-
<Setter Property="wpf:ButtonProgressAssist.IndicatorBackground" Value="{DynamicResource PrimaryHueMidBrush}" />
40-
<Setter Property="wpf:RippleAssist.Feedback" Value="White" />
4140
<Setter Property="Cursor" Value="Hand"/>
42-
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth1" />
4341
<Setter Property="TextBlock.FontWeight" Value="Medium"/>
4442
<Setter Property="TextBlock.FontSize" Value="14"/>
4543
<Setter Property="BorderThickness" Value="1"/>
4644
<Setter Property="HorizontalContentAlignment" Value="Center"/>
4745
<Setter Property="VerticalContentAlignment" Value="Center"/>
4846
<Setter Property="Padding" Value="16 4 16 4"/>
4947
<Setter Property="Height" Value="32" />
48+
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth1" />
49+
<Setter Property="wpf:ButtonAssist.CornerRadius" Value="2" />
50+
<Setter Property="wpf:RippleAssist.Feedback" Value="White" />
51+
<Setter Property="wpf:ButtonProgressAssist.IndicatorForeground" Value="{DynamicResource PrimaryHueMidForegroundBrush}" />
52+
<Setter Property="wpf:ButtonProgressAssist.IndicatorBackground" Value="{DynamicResource PrimaryHueMidBrush}" />
5053
<Setter Property="wpf:ButtonProgressAssist.IsIndicatorVisible" Value="False" />
5154
<Setter Property="wpf:ButtonProgressAssist.Opacity" Value=".4" />
52-
<Setter Property="wpf:ButtonAssist.CornerRadius" Value="2" />
53-
5455
<Setter Property="Template">
5556
<Setter.Value>
5657
<ControlTemplate TargetType="{x:Type ButtonBase}">
@@ -154,28 +155,60 @@
154155
<Style x:Key="MaterialDesignRaisedAccentButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignRaisedSecondaryButton}">
155156
</Style>
156157

158+
<!--#endregion-->
159+
<!--#region Flat Button-->
157160
<Style x:Key="MaterialDesignFlatButton" TargetType="{x:Type ButtonBase}">
158161
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
159162
<Setter Property="Background" Value="Transparent"/>
160163
<Setter Property="BorderBrush" Value="Transparent"/>
161164
<Setter Property="Cursor" Value="Hand"/>
162165
<Setter Property="Foreground" Value="{DynamicResource PrimaryHueMidBrush}"/>
163-
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource PrimaryHueMidBrush}" />
164166
<Setter Property="TextBlock.FontWeight" Value="Medium"/>
165167
<Setter Property="TextBlock.FontSize" Value="14"/>
166168
<Setter Property="BorderThickness" Value="0"/>
167169
<Setter Property="HorizontalContentAlignment" Value="Center"/>
168170
<Setter Property="VerticalContentAlignment" Value="Center"/>
169171
<Setter Property="Padding" Value="16 4 16 4"/>
170172
<Setter Property="Height" Value="32" />
173+
<Setter Property="wpf:ButtonAssist.CornerRadius" Value="2" />
174+
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource PrimaryHueMidBrush}" />
175+
<Setter Property="wpf:ButtonProgressAssist.IndicatorForeground" Value="{DynamicResource PrimaryHueMidForegroundBrush}" />
176+
<Setter Property="wpf:ButtonProgressAssist.IndicatorBackground" Value="{DynamicResource PrimaryHueMidBrush}" />
177+
<Setter Property="wpf:ButtonProgressAssist.IsIndicatorVisible" Value="False" />
178+
<Setter Property="wpf:ButtonProgressAssist.Opacity" Value=".4" />
171179
<Setter Property="Template">
172180
<Setter.Value>
173181
<ControlTemplate TargetType="{x:Type ButtonBase}">
174182
<Grid>
175183
<Border Background="{TemplateBinding Background}" x:Name="border"
176184
CornerRadius="{Binding Path=(wpf:ButtonAssist.CornerRadius), RelativeSource={RelativeSource TemplatedParent}}"
177185
BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
178-
<wpf:Ripple Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Focusable="False"
186+
<ProgressBar x:Name="ProgressBar"
187+
Style="{DynamicResource MaterialDesignLinearProgressBar}"
188+
Minimum="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Minimum)}"
189+
Maximum="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Maximum)}"
190+
Foreground="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorForeground)}"
191+
Background="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorBackground)}"
192+
BorderBrush="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorBackground)}"
193+
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Value)}"
194+
IsIndeterminate="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IsIndeterminate)}"
195+
Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IsIndicatorVisible), Converter={StaticResource BooleanToVisibilityConverter}}"
196+
Height="{TemplateBinding Height}"
197+
Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ButtonBase}}, Path=ActualWidth}"
198+
Opacity="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Opacity)}"
199+
HorizontalAlignment="Left"
200+
VerticalAlignment="Center">
201+
<ProgressBar.Clip>
202+
<MultiBinding Converter="{StaticResource BorderClipConverter}">
203+
<Binding ElementName="border" Path="ActualWidth" />
204+
<Binding ElementName="border" Path="ActualHeight" />
205+
<Binding ElementName="border" Path="CornerRadius" />
206+
<Binding ElementName="border" Path="BorderThickness" />
207+
</MultiBinding>
208+
</ProgressBar.Clip>
209+
</ProgressBar>
210+
</Border>
211+
<wpf:Ripple Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Focusable="False"
179212
ContentStringFormat="{TemplateBinding ContentStringFormat}"
180213
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
181214
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
@@ -190,7 +223,6 @@
190223
</MultiBinding>
191224
</wpf:Ripple.Clip>
192225
</wpf:Ripple>
193-
</Border>
194226
</Grid>
195227
<ControlTemplate.Triggers>
196228
<Trigger Property="IsMouseOver" Value="true">
@@ -208,8 +240,6 @@
208240
</Setter>
209241
</Style>
210242

211-
212-
213243
<Style x:Key="MaterialDesignFlatLightButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFlatButton}">
214244
<Setter Property="Foreground" Value="{DynamicResource PrimaryHueLightBrush}"/>
215245
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource PrimaryHueLightBrush}"/>
@@ -242,6 +272,9 @@
242272
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth0" />
243273
</Style>
244274

275+
<!--#endregion-->
276+
<!--#region Flat Background Button-->
277+
245278
<Style x:Key="MaterialDesignFlatMidBgButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignRaisedButton}">
246279
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth0" />
247280
</Style>
@@ -265,6 +298,9 @@
265298
<Style x:Key="MaterialDesignFlatAccentBgButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFlatSecondaryMidBgButton}">
266299
</Style>
267300

301+
<!--#endregion-->
302+
<!--#region Outlined Button-->
303+
268304
<Style x:Key="MaterialDesignOutlinedButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFlatButton}">
269305
<Setter Property="BorderBrush" Value="{DynamicResource PrimaryHueMidBrush}"/>
270306
<Setter Property="BorderThickness" Value="1"/>
@@ -278,24 +314,48 @@
278314
CornerRadius="{Binding Path=(wpf:ButtonAssist.CornerRadius), RelativeSource={RelativeSource TemplatedParent}}"
279315
BorderBrush="{TemplateBinding BorderBrush}"
280316
BorderThickness="{TemplateBinding BorderThickness}">
281-
<wpf:Ripple Content="{TemplateBinding Content}"
282-
ContentTemplate="{TemplateBinding ContentTemplate}"
283-
Focusable="False"
284-
ContentStringFormat="{TemplateBinding ContentStringFormat}"
285-
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
286-
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
287-
Padding="{TemplateBinding Padding}"
288-
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
289-
<wpf:Ripple.Clip>
317+
<ProgressBar x:Name="ProgressBar"
318+
Style="{DynamicResource MaterialDesignLinearProgressBar}"
319+
Minimum="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Minimum)}"
320+
Maximum="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Maximum)}"
321+
Foreground="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorForeground)}"
322+
Background="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorBackground)}"
323+
BorderBrush="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IndicatorBackground)}"
324+
Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Value)}"
325+
IsIndeterminate="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IsIndeterminate)}"
326+
Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.IsIndicatorVisible), Converter={StaticResource BooleanToVisibilityConverter}}"
327+
Height="{TemplateBinding Height}"
328+
Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ButtonBase}}, Path=ActualWidth}"
329+
Opacity="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(wpf:ButtonProgressAssist.Opacity)}"
330+
HorizontalAlignment="Left"
331+
VerticalAlignment="Center">
332+
<ProgressBar.Clip>
290333
<MultiBinding Converter="{StaticResource BorderClipConverter}">
291334
<Binding ElementName="border" Path="ActualWidth" />
292335
<Binding ElementName="border" Path="ActualHeight" />
293336
<Binding ElementName="border" Path="CornerRadius" />
294337
<Binding ElementName="border" Path="BorderThickness" />
295338
</MultiBinding>
296-
</wpf:Ripple.Clip>
297-
</wpf:Ripple>
339+
</ProgressBar.Clip>
340+
</ProgressBar>
298341
</Border>
342+
<wpf:Ripple Content="{TemplateBinding Content}"
343+
ContentTemplate="{TemplateBinding ContentTemplate}"
344+
Focusable="False"
345+
ContentStringFormat="{TemplateBinding ContentStringFormat}"
346+
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
347+
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
348+
Padding="{TemplateBinding Padding}"
349+
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
350+
<wpf:Ripple.Clip>
351+
<MultiBinding Converter="{StaticResource BorderClipConverter}">
352+
<Binding ElementName="border" Path="ActualWidth" />
353+
<Binding ElementName="border" Path="ActualHeight" />
354+
<Binding ElementName="border" Path="CornerRadius" />
355+
<Binding ElementName="border" Path="BorderThickness" />
356+
</MultiBinding>
357+
</wpf:Ripple.Clip>
358+
</wpf:Ripple>
299359
</Grid>
300360
<ControlTemplate.Triggers>
301361
<Trigger Property="IsMouseOver" Value="true">
@@ -344,6 +404,9 @@
344404
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource SecondaryHueDarkBrush}"/>
345405
</Style>
346406

407+
<!--#endregion-->
408+
<!--#region Tool Button-->
409+
347410
<Style x:Key="MaterialDesignToolButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFlatButton}">
348411
<Setter Property="Foreground" Value="{DynamicResource MaterialDesignToolForeground}"/>
349412
<Setter Property="Padding" Value="4"/>
@@ -372,6 +435,9 @@
372435
<Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"/>
373436
</Style>
374437

438+
<!--#endregion-->
439+
<!--#region FAB-->
440+
375441
<Style x:Key="MaterialDesignFloatingActionMiniButton" TargetType="{x:Type ButtonBase}">
376442
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
377443
<Setter Property="Background" Value="{DynamicResource PrimaryHueMidBrush}"/>
@@ -549,6 +615,9 @@
549615
<Style x:Key="MaterialDesignFloatingActionAccentButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFloatingActionSecondaryButton}">
550616
</Style>
551617

618+
<!--#endregion-->
619+
<!--#region Icon Button-->
620+
552621
<Style x:Key="MaterialDesignIconButton" TargetType="{x:Type ButtonBase}" BasedOn="{StaticResource MaterialDesignFlatButton}">
553622
<Setter Property="Padding" Value="0"/>
554623
<Setter Property="Width" Value="48" />
@@ -600,6 +669,9 @@
600669
<Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"/>
601670
</Style>
602671

672+
<!--#endregion-->
673+
<!--#region Paper Button-->
674+
603675
<Style x:Key="MaterialDesignPaperButton" TargetType="{x:Type ButtonBase}">
604676
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
605677
<Setter Property="Background" Value="{DynamicResource MaterialDesignPaper}"/>
@@ -687,4 +759,6 @@
687759
<Setter Property="wpf:RippleAssist.Feedback" Value="{DynamicResource SecondaryHueDarkBrush}"/>
688760
</Style>
689761

762+
<!--#endregion-->
763+
690764
</ResourceDictionary>

0 commit comments

Comments
 (0)