Skip to content

Commit 96e7c70

Browse files
ButchersBoyButchersBoy
committed
looks like v1 of chips
1 parent 2cd22c6 commit 96e7c70

File tree

11 files changed

+268
-114
lines changed

11 files changed

+268
-114
lines changed

‎MainDemo.Wpf/App.xaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<Application x:Class="MaterialDesignColors.WpfExample.App"
22
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
33
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4-
StartupUri="ProvingGround.xaml">
4+
StartupUri="MainWindow.xaml">
55
<Application.Resources>
66
<ResourceDictionary>
77
<ResourceDictionary.MergedDictionaries>

‎MainDemo.Wpf/Chips.xaml

Lines changed: 61 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,66 @@
88
mc:Ignorable="d"
99
d:DesignHeight="300" d:DesignWidth="300">
1010
<Grid Margin="32">
11-
<materialDesign:Chip Text="Butcher's Boy" />
11+
<Grid.RowDefinitions>
12+
<RowDefinition Height="Auto" />
13+
<RowDefinition Height="Auto" />
14+
</Grid.RowDefinitions>
15+
<TextBlock Style="{StaticResource MaterialDesignTitleTextBlock}">Chips</TextBlock>
16+
<StackPanel Grid.Row="1" Margin="0 16 0 0">
17+
<WrapPanel Orientation="Horizontal">
18+
<materialDesign:Chip Content="James Willock" Margin="0 0 6 4">
19+
<materialDesign:Chip.Icon>
20+
<Image Source="Resources/ProfilePic.jpg" />
21+
</materialDesign:Chip.Icon>
22+
</materialDesign:Chip>
23+
<materialDesign:Chip Margin="0 0 4 4">
24+
Example Chip
25+
</materialDesign:Chip>
26+
<materialDesign:Chip Content="ANZ Bank"
27+
Icon="A"
28+
Margin="0 0 4 4" />
29+
<materialDesign:Chip Content="ZNA Inc"
30+
Icon="Z"
31+
Margin="0 0 4 4" />
32+
<materialDesign:Chip Content="Twitter"
33+
IconBackground="{DynamicResource PrimaryHueDarkBrush}"
34+
IconForeground="{DynamicResource PrimaryHueDarkForegroundBrush}"
35+
Margin="0 0 4 4">
36+
<materialDesign:Chip.Icon>
37+
<materialDesign:PackIcon Kind="Twitter"></materialDesign:PackIcon>
38+
</materialDesign:Chip.Icon>
39+
</materialDesign:Chip>
40+
</WrapPanel>
41+
<WrapPanel Margin="0 12 0 0" Orientation="Horizontal">
42+
<materialDesign:Chip Content="James Willock"
43+
IsDeletable="True"
44+
Margin="0 0 4 4"
45+
x:Name="ButtonsDemoChip"
46+
Click="ButtonsDemoChip_OnClick"
47+
DeleteClick="ButtonsDemoChip_OnDeleteClick"
48+
ToolTip="Just a tool tip"
49+
DeleteToolTip="Your friendly neighbour delete button"
50+
>
51+
<materialDesign:Chip.Icon>
52+
<Image Source="Resources/ProfilePic.jpg"></Image>
53+
</materialDesign:Chip.Icon>
54+
</materialDesign:Chip>
55+
<materialDesign:Chip Content="Example Chip"
56+
IsDeletable="True"
57+
ToolTip="This is an example chip"
58+
Margin="0 0 4 4">
59+
</materialDesign:Chip>
60+
<materialDesign:Chip Content="ANZ Bank"
61+
Icon="A"
62+
IsDeletable="True"
63+
Margin="0 0 4 4" />
64+
<materialDesign:Chip Content="ZNA Inc"
65+
Icon="Z"
66+
IsDeletable="True"
67+
IconBackground="{DynamicResource PrimaryHueLightBrush}"
68+
IconForeground="{DynamicResource PrimaryHueLightForegroundBrush}"
69+
Margin="0 0 4 4" />
70+
</WrapPanel>
71+
</StackPanel>
1272
</Grid>
1373
</UserControl>

‎MainDemo.Wpf/Chips.xaml.cs

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,5 +24,16 @@ public Chips()
2424
{
2525
InitializeComponent();
2626
}
27+
28+
private void ButtonsDemoChip_OnClick(object sender, RoutedEventArgs e)
29+
{
30+
Console.WriteLine("Chip clicked.");
31+
}
32+
33+
private void ButtonsDemoChip_OnDeleteClick(object sender, RoutedEventArgs e)
34+
{
35+
Console.WriteLine("Chip delete clicked.");
36+
}
37+
2738
}
2839
}

‎MainDemo.Wpf/MainWindow.xaml

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,11 @@
8888
<wpfExample:Sliders />
8989
</domain:DemoItem.Content>
9090
</domain:DemoItem>
91+
<domain:DemoItem Name="Chips">
92+
<domain:DemoItem.Content>
93+
<wpfExample:Chips />
94+
</domain:DemoItem.Content>
95+
</domain:DemoItem>
9196
<domain:DemoItem Name="Typography">
9297
<domain:DemoItem.Content>
9398
<wpfExample:Typography />

‎MainDemo.Wpf/ProvingGround.xaml

Lines changed: 16 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -24,33 +24,31 @@
2424

2525
<StackPanel>
2626
<WrapPanel Margin="24" Orientation="Horizontal">
27-
<materialDesign:Chip Text="James Willock"
28-
Margin="0 0 6 4">
27+
<materialDesign:Chip Content="James Willock" Margin="0 0 6 4">
2928
<materialDesign:Chip.Icon>
30-
<Image Source="Resources/ProfilePic.jpg"></Image>
29+
<Image Source="Resources/ProfilePic.jpg" />
3130
</materialDesign:Chip.Icon>
3231
</materialDesign:Chip>
33-
<materialDesign:Chip Text="Example Chip"
34-
Margin="0 0 4 4" />
35-
<materialDesign:Chip Text="ANZ Bank"
32+
<materialDesign:Chip Margin="0 0 4 4">
33+
Example Chip
34+
</materialDesign:Chip>
35+
<materialDesign:Chip Content="ANZ Bank"
3636
Icon="A"
3737
Margin="0 0 4 4" />
38-
<materialDesign:Chip Text="ZNA Inc"
38+
<materialDesign:Chip Content="ZNA Inc"
3939
Icon="Z"
40-
IconBackground="{DynamicResource PrimaryHueMidBrush}"
41-
IconForeground="{DynamicResource PrimaryHueMidForegroundBrush}"
4240
Margin="0 0 4 4" />
43-
<materialDesign:Chip Text="Twitter"
44-
IconBackground="{DynamicResource PrimaryHueMidBrush}"
45-
IconForeground="{DynamicResource PrimaryHueMidForegroundBrush}"
41+
<materialDesign:Chip Content="Twitter"
42+
IconBackground="{DynamicResource PrimaryHueDarkBrush}"
43+
IconForeground="{DynamicResource PrimaryHueDarkForegroundBrush}"
4644
Margin="0 0 4 4">
4745
<materialDesign:Chip.Icon>
4846
<materialDesign:PackIcon Kind="Twitter"></materialDesign:PackIcon>
4947
</materialDesign:Chip.Icon>
5048
</materialDesign:Chip>
5149
</WrapPanel>
5250
<WrapPanel Margin="24" Orientation="Horizontal">
53-
<materialDesign:Chip Text="James Willock"
51+
<materialDesign:Chip Content="James Willock"
5452
IsDeletable="True"
5553
Margin="0 0 4 4"
5654
x:Name="ButtonsDemoChip"
@@ -63,20 +61,20 @@
6361
<Image Source="Resources/ProfilePic.jpg"></Image>
6462
</materialDesign:Chip.Icon>
6563
</materialDesign:Chip>
66-
<materialDesign:Chip Text="Example Chip"
64+
<materialDesign:Chip Content="Example Chip"
6765
IsDeletable="True"
6866
ToolTip="This is an example chip"
6967
Margin="0 0 4 4">
7068
</materialDesign:Chip>
71-
<materialDesign:Chip Text="ANZ Bank"
69+
<materialDesign:Chip Content="ANZ Bank"
7270
Icon="A"
7371
IsDeletable="True"
7472
Margin="0 0 4 4" />
75-
<materialDesign:Chip Text="ZNA Inc"
73+
<materialDesign:Chip Content="ZNA Inc"
7674
Icon="Z"
7775
IsDeletable="True"
78-
IconBackground="{DynamicResource PrimaryHueMidBrush}"
79-
IconForeground="{DynamicResource PrimaryHueMidForegroundBrush}"
76+
IconBackground="{DynamicResource PrimaryHueLightBrush}"
77+
IconForeground="{DynamicResource PrimaryHueLightForegroundBrush}"
8078
Margin="0 0 4 4" />
8179
</WrapPanel>
8280
</StackPanel>

‎MaterialDesignThemes.Wpf/Chip.cs

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
namespace MaterialDesignThemes.Wpf
1414
{
1515
[TemplatePart(Name = DeleteButtonPartName, Type = typeof(Button))]
16-
public class Chip : Button
16+
public class Chip : ButtonBase
1717
{
1818
private ButtonBase _deleteButton;
1919

@@ -51,15 +51,6 @@ public Brush IconForeground
5151
set { SetValue(IconForegroundProperty, value); }
5252
}
5353

54-
public static readonly DependencyProperty TextProperty = DependencyProperty.Register(
55-
"Text", typeof (string), typeof (Chip), new PropertyMetadata(default(string)));
56-
57-
public string Text
58-
{
59-
get { return (string) GetValue(TextProperty); }
60-
set { SetValue(TextProperty, value); }
61-
}
62-
6354
public static readonly DependencyProperty IsDeletableProperty = DependencyProperty.Register(
6455
"IsDeletable", typeof (bool), typeof (Chip), new PropertyMetadata(default(bool)));
6556

@@ -98,7 +89,7 @@ public object DeleteToolTip
9889
get { return (object) GetValue(DeleteToolTipProperty); }
9990
set { SetValue(DeleteToolTipProperty, value); }
10091
}
101-
92+
10293
/// <summary>
10394
/// Event correspond to delete button left mouse button click
10495
/// </summary>

‎MaterialDesignThemes.Wpf/MaterialDesignThemes.Wpf.csproj

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,10 @@
7575
<SubType>Designer</SubType>
7676
<Generator>MSBuild:Compile</Generator>
7777
</Page>
78+
<Page Include="Themes\MaterialDesignTheme.Chip.xaml">
79+
<SubType>Designer</SubType>
80+
<Generator>MSBuild:Compile</Generator>
81+
</Page>
7882
<Page Include="Themes\MaterialDesignTheme.Clock.xaml">
7983
<SubType>Designer</SubType>
8084
<Generator>MSBuild:Compile</Generator>

‎MaterialDesignThemes.Wpf/Themes/Generic.xaml

Lines changed: 2 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
in your App.xaml
1717
-->
1818
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Card.xaml" />
19+
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Chip.xaml" />
1920
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Clock.xaml" />
2021
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.PopupBox.xaml" />
2122
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.RatingBar.xaml" />
@@ -32,8 +33,7 @@
3233

3334
<converters:BrushToRadialGradientBrushConverter x:Key="BrushToRadialGradientBrushConverter" />
3435
<converters:DrawerOffsetConverter x:Key="DrawerOffsetConverter" />
35-
<converters:NullableToVisibilityConverter x:Key="NullableToVisibilityConverter" />
36-
36+
3737
<Style TargetType="{x:Type local:Ripple}">
3838
<Setter Property="RecognizesAccessKey" Value="True" />
3939
<Setter Property="HorizontalAlignment" Value="Stretch" />
@@ -397,86 +397,6 @@
397397
</Setter>
398398
</Style>
399399

400-
<Style TargetType="{x:Type local:Chip}">
401-
<Setter Property="Height" Value="32" />
402-
<Setter Property="HorizontalAlignment" Value="Left" />
403-
<Setter Property="FontSize" Value="13" />
404-
<Setter Property="Background" Value="#12000000" />
405-
<Setter Property="IconBackground" Value="#FF009587" />
406-
<Setter Property="IconForeground" Value="#FFfafafa" />
407-
<Setter Property="Cursor" Value="Hand" />
408-
<Setter Property="Template">
409-
<Setter.Value>
410-
<ControlTemplate TargetType="{x:Type local:Chip}">
411-
<Grid>
412-
<Grid.ColumnDefinitions>
413-
<ColumnDefinition Width="Auto" />
414-
<ColumnDefinition Width="*" />
415-
<ColumnDefinition Width="Auto" />
416-
</Grid.ColumnDefinitions>
417-
<Border CornerRadius="16" Background="{TemplateBinding Background}" Grid.ColumnSpan="3" />
418-
<ContentControl Content="{TemplateBinding Icon}"
419-
x:Name="IconControl"
420-
Background="{TemplateBinding IconBackground}"
421-
Foreground="{TemplateBinding IconForeground}"
422-
FontSize="17"
423-
FontWeight="Regular"
424-
Visibility="{TemplateBinding Icon, Converter={StaticResource NullVisibilityConverter}}"
425-
VerticalAlignment="Center"
426-
VerticalContentAlignment="Center"
427-
HorizontalContentAlignment="Center"
428-
Height="32" Width="32">
429-
<ContentControl.Clip>
430-
<EllipseGeometry RadiusX="16" RadiusY="16" Center="16,16" />
431-
</ContentControl.Clip>
432-
<ContentControl.Template>
433-
<ControlTemplate TargetType="ContentControl">
434-
<Border Background="{TemplateBinding Background}">
435-
<ContentPresenter Content="{TemplateBinding Content}"
436-
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
437-
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
438-
</Border>
439-
</ControlTemplate>
440-
</ContentControl.Template>
441-
</ContentControl>
442-
<TextBlock Text="{TemplateBinding Text}"
443-
x:Name="TextBlock"
444-
VerticalAlignment="Center"
445-
Margin="8 0 12 0"
446-
Grid.Column="1"/>
447-
<Button Grid.Column="2" Visibility="{TemplateBinding IsDeletable, Converter={StaticResource BooleanToVisibilityConverter}}"
448-
x:Name="PART_DeleteButton"
449-
ToolTip="{TemplateBinding DeleteToolTip}"
450-
Margin="-6 0 8 0"
451-
VerticalAlignment="Center"
452-
Width="16" Height="16">
453-
<Button.Template>
454-
<ControlTemplate>
455-
<Grid>
456-
<Ellipse x:Name="Bg" Fill="#FFA6A6A6" Stroke="#FF009587" StrokeThickness="0" />
457-
<local:PackIcon Kind="Close" Width="12" Height="12"
458-
HorizontalAlignment="Center"
459-
VerticalAlignment="Center" />
460-
</Grid>
461-
<ControlTemplate.Triggers>
462-
<Trigger Property="IsMouseOver" Value="True">
463-
<Setter TargetName="Bg" Property="StrokeThickness" Value="1" />
464-
</Trigger>
465-
</ControlTemplate.Triggers>
466-
</ControlTemplate>
467-
</Button.Template>
468-
</Button>
469-
</Grid>
470-
<ControlTemplate.Triggers>
471-
<Trigger SourceName="IconControl" Property="Visibility" Value="Collapsed">
472-
<Setter TargetName="TextBlock" Property="Margin" Value="12 0 12 0" />
473-
</Trigger>
474-
</ControlTemplate.Triggers>
475-
</ControlTemplate>
476-
</Setter.Value>
477-
</Setter>
478-
</Style>
479-
480400
<Style TargetType="{x:Type local:ColorZone}">
481401
<Setter Property="Background" Value="{DynamicResource MaterialDesignPaper}" />
482402
<Setter Property="Foreground" Value="{DynamicResource MaterialDesignBody}" />

0 commit comments

Comments
 (0)