Skip to content

Various changes for cards and shadows #2765

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Keboo merged 6 commits into from
Jul 8, 2022
Merged

Various changes for cards and shadows #2765

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
2e1ee65
Various changes for cards and shadows
ElieTaillard Jul 6, 2022
6855ad5
add new depth lvl and mark old ones obselete
ElieTaillard Jul 8, 2022
e798c89
change default shadow depth on cards
ElieTaillard Jul 8, 2022
5cda8e4
adjust shadows
ElieTaillard Jul 8, 2022
79bdaf8
remove [Obselete] to fix the pipeline
ElieTaillard Jul 8, 2022
b351e01
add obselete attribute
ElieTaillard Jul 8, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
206 changes: 190 additions & 16 deletions MainDemo.Wpf/Shadows.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
materialDesign:ShadowAssist.ShadowDepth="Depth4"
Content="DEPTH 4"/>
</smtx:XamlDisplay>

<smtx:XamlDisplay UniqueKey="shadow_5" Margin="16 0 0 0">
<Button
Style="{StaticResource MaterialDesignRaisedButton}"
Expand All @@ -60,15 +60,15 @@
<StackPanel
Orientation="Horizontal"
Margin="0 32 0 0">
<smtx:XamlDisplay UniqueKey="shadow_6">
<smtx:XamlDisplay UniqueKey="shadow_9">
<Button
Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
materialDesign:ShadowAssist.ShadowDepth="Depth1"
Content="1"/>
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_7"
UniqueKey="shadow_10"
Margin="16 0 0 0">
<Button
Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
Expand All @@ -77,7 +77,7 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_8"
UniqueKey="shadow_11"
Margin="16 0 0 0">
<Button
Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
Expand All @@ -86,16 +86,16 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_9"
UniqueKey="shadow_12"
Margin="16 0 0 0">
<Button
Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
materialDesign:ShadowAssist.ShadowDepth="Depth4"
Content="4"/>
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_10"
UniqueKey="shadow_13"
Margin="16 0 0 0">
<Button
Style="{StaticResource MaterialDesignFloatingActionMiniButton}"
Expand All @@ -107,15 +107,15 @@
<StackPanel
Orientation="Horizontal"
Margin="0 32 0 0">
<smtx:XamlDisplay UniqueKey="shadow_11">
<smtx:XamlDisplay UniqueKey="shadow_17">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth1"
Padding="32"
Content="DEPTH 1"/>
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_12"
UniqueKey="shadow_18"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth2"
Expand All @@ -124,7 +124,7 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_13"
UniqueKey="shadow_19"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth3"
Expand All @@ -133,16 +133,16 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_14"
UniqueKey="shadow_20"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth4"
Padding="32"
Content="DEPTH 4"/>
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_15"
UniqueKey="shadow_21"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth5"
Expand All @@ -154,7 +154,7 @@
<StackPanel
Orientation="Horizontal"
Margin="0 32 0 0">
<smtx:XamlDisplay UniqueKey="shadow_16">
<smtx:XamlDisplay UniqueKey="shadow_26">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth3"
materialDesign:ShadowAssist.ShadowEdges="Bottom,Right"
Expand All @@ -163,7 +163,7 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_17"
UniqueKey="shadow_27"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth3"
Expand All @@ -173,7 +173,7 @@
</smtx:XamlDisplay>

<smtx:XamlDisplay
UniqueKey="shadow_18"
UniqueKey="shadow_28"
Margin="16 0 0 0">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth3"
Expand All @@ -182,6 +182,180 @@
Content="CUSTOM CLIP"/>
</smtx:XamlDisplay>
</StackPanel>
<TextBlock Style="{DynamicResource MaterialDesignHeadline5TextBlock}" Margin="0,45,0,10">
New Depth Shadow System
</TextBlock>
<Separator Style="{DynamicResource MaterialDesignSeparator}" Margin="0,0,0,16"/>
<WrapPanel Orientation="Horizontal">
<smtx:XamlDisplay
UniqueKey="new_shadow_card_0dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_0dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 0dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_1dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_1dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 1dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_2dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_2dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 2dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_3dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_3dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 3dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_4dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_4dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 4dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_5dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_5dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 5dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_6dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_6dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 6dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_7dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_7dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 7dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_8dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_8dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 8dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_12dp"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_12dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 12dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_16"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_16dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 16dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
<smtx:XamlDisplay
UniqueKey="new_shadow_card_24"
Margin="0,0,16,32">
<materialDesign:Card
materialDesign:ShadowAssist.ShadowDepth="Depth_24dp"
Width="150"
Height="80">
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center">
Depth 24dp
</TextBlock>
</materialDesign:Card>
</smtx:XamlDisplay>
</WrapPanel>
</StackPanel>
</UserControl>

2 changes: 1 addition & 1 deletion MaterialDesignThemes.Wpf/Card.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ namespace MaterialDesignThemes.Wpf
public class Card : ContentControl
{
private Border? _clipBorder;
private const double DefaultUniformCornerRadius = 2.0;
private const double DefaultUniformCornerRadius = 4.0;
public const string ClipBorderPartName = "PART_ClipBorder";

#region DependencyProperty : UniformCornerRadiusProperty
Expand Down
16 changes: 16 additions & 0 deletions MaterialDesignThemes.Wpf/Converters/ShadowInfo.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,12 +15,28 @@ static ShadowInfo()

ShadowsDictionary = new Dictionary<ShadowDepth, DropShadowEffect?>
{
// Obselete
#region ObseleteDepth
{ ShadowDepth.Depth0, null },
{ ShadowDepth.Depth1, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth1"] },
{ ShadowDepth.Depth2, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth2"] },
{ ShadowDepth.Depth3, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth3"] },
{ ShadowDepth.Depth4, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth4"] },
{ ShadowDepth.Depth5, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth5"] },
#endregion
Comment on lines +19 to +28
Copy link
Copy Markdown
Member

@Keboo Keboo Jul 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To fix the pipeline failing on warnings. We can simply suppress these. This will ensure that people properly update their enum values before removing them in 5.x.

Suggested change
#region ObseleteDepth
{ ShadowDepth.Depth0, null },
{ ShadowDepth.Depth1, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth1"] },
{ ShadowDepth.Depth2, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth2"] },
{ ShadowDepth.Depth3, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth3"] },
{ ShadowDepth.Depth4, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth4"] },
{ ShadowDepth.Depth5, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth5"] },
#endregion
#region ObseleteDepth
#pragma warning disable CS0618 // Type or member is obsolete
{ ShadowDepth.Depth0, null },
{ ShadowDepth.Depth1, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth1"] },
{ ShadowDepth.Depth2, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth2"] },
{ ShadowDepth.Depth3, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth3"] },
{ ShadowDepth.Depth4, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth4"] },
{ ShadowDepth.Depth5, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth5"] },
#pragma warning restore CS0618 // Type or member is obsolete

Copy link
Copy Markdown
Collaborator Author

@ElieTaillard ElieTaillard Jul 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Perfect, thank you, I'll do that


{ ShadowDepth.Depth_0dp, null },
{ ShadowDepth.Depth_1dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_1dp"] },
{ ShadowDepth.Depth_2dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_2dp"] },
{ ShadowDepth.Depth_3dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_3dp"] },
{ ShadowDepth.Depth_4dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_4dp"] },
{ ShadowDepth.Depth_5dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_5dp"] },
{ ShadowDepth.Depth_6dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_6dp"] },
{ ShadowDepth.Depth_7dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_7dp"] },
{ ShadowDepth.Depth_8dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_8dp"] },
{ ShadowDepth.Depth_12dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_12dp"] },
{ ShadowDepth.Depth_16dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_16dp"] },
{ ShadowDepth.Depth_24dp, (DropShadowEffect)resourceDictionary["MaterialDesignShadowDepth_24dp"] }
};
}

Expand Down
17 changes: 16 additions & 1 deletion MaterialDesignThemes.Wpf/ShadowAssist.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,27 @@ namespace MaterialDesignThemes.Wpf

public enum ShadowDepth
{
#region ObseleteDepth
Depth0,
Depth1,
Depth2,
Depth3,
Depth4,
Depth5
Depth5,
#endregion
Copy link
Copy Markdown
Member

@Keboo Keboo Jul 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think actually putting the Obsolete attribute on these is a good idea. What are your thoughts on these suggested update values (since there are no exact equivalents)?

[Obsolete("Use Depth_0dp instead")]
Depth0,
[Obsolete("Considersing Depth_2dp instead")]
Depth1,
[Obsolete("Considersing Depth_3dp instead")]
Depth2,
[Obsolete("Considersing Depth_7dp instead")]
Depth3,
[Obsolete("Considersing Depth_12dp instead")]
Depth4,
[Obsolete("Considersing Depth_24dp instead")]
Depth5,

Copy link
Copy Markdown
Collaborator Author

@ElieTaillard ElieTaillard Jul 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That sounds good to me


Depth_0dp,
Depth_1dp,
Depth_2dp,
Depth_3dp,
Depth_4dp,
Depth_5dp,
Depth_6dp,
Depth_7dp,
Depth_8dp,
Depth_12dp,
Depth_16dp,
Depth_24dp
}

[Flags]
Expand Down
2 changes: 1 addition & 1 deletion MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.Card.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

<Style x:Key="MaterialDesignElevatedCard" TargetType="{x:Type wpf:Card}">
<Setter Property="Background" Value="{DynamicResource MaterialDesignCardBackground}" />
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth2" />
<Setter Property="wpf:ShadowAssist.ShadowDepth" Value="Depth_1dp" />
<Setter Property="Focusable" Value="False"/>
<Setter Property="Template">
<Setter.Value>
Expand Down
Loading