Skip to content

Commit 6e20c00

Browse files
greuelpiratgreuelpirat
authored
Page for ComboBoxes in demo app (#1749)
* created ComboBoxes.xaml (#1704) * Removed ComboBoxes from Fields.xaml and reordered elements (#1704) * centered DocumentationLink-Icon (#1704)
1 parent c0c6d5a commit 6e20c00

File tree

7 files changed

+524
-484
lines changed

7 files changed

+524
-484
lines changed

‎MainDemo.Wpf/ComboBoxes.xaml

Lines changed: 199 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,199 @@
1+
<UserControl x:Class="MaterialDesignDemo.ComboBoxes"
2+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6+
xmlns:domain="clr-namespace:MaterialDesignColors.WpfExample.Domain"
7+
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
8+
xmlns:domain1="clr-namespace:MaterialDesignDemo.Domain"
9+
xmlns:smtx="clr-namespace:ShowMeTheXAML;assembly=ShowMeTheXAML"
10+
mc:Ignorable="d"
11+
d:DesignHeight="300" d:DesignWidth="600"
12+
d:DataContext="{d:DesignInstance domain:FieldsViewModel, IsDesignTimeCreatable=False}">
13+
<UserControl.Resources>
14+
<Style x:Key="SectionTitle" TargetType="TextBlock" BasedOn="{StaticResource MaterialDesignHeadline5TextBlock }">
15+
<Setter Property="Margin" Value="0 32 0 0" />
16+
</Style>
17+
<Style TargetType="{x:Type smtx:XamlDisplay}" BasedOn="{StaticResource {x:Type smtx:XamlDisplay}}">
18+
<Setter Property="Margin" Value="16 0" />
19+
<Setter Property="VerticalAlignment" Value="Bottom" />
20+
</Style>
21+
</UserControl.Resources>
22+
<StackPanel Margin="16 0" VerticalAlignment="Top" HorizontalAlignment="Left">
23+
<TextBlock Style="{StaticResource SectionTitle}" Margin="0">ComboBoxes</TextBlock>
24+
<StackPanel Orientation="Horizontal">
25+
<StackPanel.Resources>
26+
<Style TargetType="{x:Type ComboBox}" BasedOn="{StaticResource {x:Type ComboBox}}">
27+
<Setter Property="Width" Value="96" />
28+
</Style>
29+
</StackPanel.Resources>
30+
<smtx:XamlDisplay Key="comboboxes_1">
31+
<ComboBox materialDesign:HintAssist.Hint="OS">
32+
<ComboBoxItem>Android</ComboBoxItem>
33+
<ComboBoxItem>iOS</ComboBoxItem>
34+
<ComboBoxItem>Linux</ComboBoxItem>
35+
<ComboBoxItem>Windows</ComboBoxItem>
36+
</ComboBox>
37+
</smtx:XamlDisplay>
38+
<smtx:XamlDisplay Key="comboboxes_2">
39+
<ComboBox materialDesign:HintAssist.Hint="Search"
40+
materialDesign:HintAssist.HintOpacity=".26"
41+
IsEditable="True">
42+
<ComboBoxItem>Apple</ComboBoxItem>
43+
<ComboBoxItem>Banana</ComboBoxItem>
44+
<ComboBoxItem>Pear</ComboBoxItem>
45+
<ComboBoxItem>Orange</ComboBoxItem>
46+
</ComboBox>
47+
</smtx:XamlDisplay>
48+
<smtx:XamlDisplay Key="comboboxes_3">
49+
<ComboBox Style="{StaticResource MaterialDesignFloatingHintComboBox}"
50+
materialDesign:TextFieldAssist.HasClearButton="True"
51+
materialDesign:TextFieldAssist.SuffixText="sw"
52+
materialDesign:TextFieldAssist.UnderlineBrush="{DynamicResource SecondaryAccentBrush}"
53+
materialDesign:ColorZoneAssist.Mode="Inverted"
54+
materialDesign:HintAssist.Hint="OS"
55+
materialDesign:HintAssist.HelperText="Select one OS"
56+
MinWidth="128">
57+
<ComboBoxItem>Android</ComboBoxItem>
58+
<ComboBoxItem>iOS</ComboBoxItem>
59+
<ComboBoxItem>Linux</ComboBoxItem>
60+
<ComboBoxItem>Windows</ComboBoxItem>
61+
</ComboBox>
62+
</smtx:XamlDisplay>
63+
<smtx:XamlDisplay Key="comboboxes_4">
64+
<ComboBox
65+
IsEnabled="False"
66+
materialDesign:HintAssist.Hint="Disabled Combo with Hint"
67+
materialDesign:HintAssist.IsFloating="True">
68+
<ComboBoxItem IsSelected="True">Selected</ComboBoxItem>
69+
</ComboBox>
70+
</smtx:XamlDisplay>
71+
</StackPanel>
72+
73+
<StackPanel Orientation="Horizontal" Margin="0 32 0 0">
74+
<StackPanel.Resources>
75+
<Style TargetType="{x:Type ComboBox}" BasedOn="{StaticResource {x:Type ComboBox}}">
76+
<Setter Property="Margin" Value="0 8 0 0" />
77+
<Setter Property="HorizontalAlignment" Value="Left" />
78+
</Style>
79+
</StackPanel.Resources>
80+
<smtx:XamlDisplay Key="comboboxes_9">
81+
<StackPanel>
82+
<CheckBox x:Name="DisplaySelectedItemCheckBox" IsThreeState="False" Margin="0 8 0 0">
83+
Display Selected Item In Drop Down
84+
</CheckBox>
85+
<ComboBox materialDesign:ComboBoxAssist.ShowSelectedItem="{Binding ElementName=DisplaySelectedItemCheckBox, Path=IsChecked}">
86+
<ComboBoxItem IsSelected="True">Apple</ComboBoxItem>
87+
<ComboBoxItem>Banana</ComboBoxItem>
88+
<ComboBoxItem>Pear</ComboBoxItem>
89+
<ComboBoxItem>Orange</ComboBoxItem>
90+
</ComboBox>
91+
</StackPanel>
92+
</smtx:XamlDisplay>
93+
<smtx:XamlDisplay Key="comboboxes_10">
94+
<StackPanel>
95+
<CheckBox x:Name="ClassicModeCheckBox" IsThreeState="False" IsChecked="True">Use classic mode</CheckBox>
96+
<ComboBox materialDesign:ComboBoxAssist.ClassicMode="{Binding ElementName=ClassicModeCheckBox, Path=IsChecked}">
97+
<ComboBoxItem IsSelected="True">Apple</ComboBoxItem>
98+
<ComboBoxItem>Banana</ComboBoxItem>
99+
<ComboBoxItem>Pear</ComboBoxItem>
100+
<ComboBoxItem>Orange</ComboBoxItem>
101+
</ComboBox>
102+
</StackPanel>
103+
</smtx:XamlDisplay>
104+
</StackPanel>
105+
106+
107+
<TextBlock Style="{StaticResource SectionTitle}">Virtualised ComboBoxes</TextBlock>
108+
<StackPanel Orientation="Horizontal">
109+
<smtx:XamlDisplay Key="comboboxes_5">
110+
<ComboBox materialDesign:HintAssist.Hint="Virtualisation"
111+
MinWidth="72"
112+
ItemsSource="{Binding LongListToTestComboVirtualization}"
113+
SelectedValue="{Binding SelectedValueOne}">
114+
<ComboBox.SelectedItem>
115+
<Binding Path="SelectedValueOne" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged">
116+
<Binding.ValidationRules>
117+
<domain1:NotEmptyValidationRule ValidatesOnTargetUpdated="True" />
118+
</Binding.ValidationRules>
119+
</Binding>
120+
</ComboBox.SelectedItem>
121+
<ComboBox.ItemsPanel>
122+
<ItemsPanelTemplate>
123+
<VirtualizingStackPanel />
124+
</ItemsPanelTemplate>
125+
</ComboBox.ItemsPanel>
126+
</ComboBox>
127+
</smtx:XamlDisplay>
128+
<smtx:XamlDisplay Key="comboboxes_6">
129+
<ComboBox materialDesign:HintAssist.Hint="(editable)"
130+
MinWidth="72"
131+
IsEditable="True"
132+
ItemsSource="{Binding LongListToTestComboVirtualization}">
133+
<ComboBox.Text>
134+
<Binding Path="SelectedTextTwo" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged">
135+
<Binding.ValidationRules>
136+
<domain1:NotEmptyValidationRule ValidatesOnTargetUpdated="True" />
137+
</Binding.ValidationRules>
138+
</Binding>
139+
</ComboBox.Text>
140+
<ComboBox.ItemsPanel>
141+
<ItemsPanelTemplate>
142+
<VirtualizingStackPanel />
143+
</ItemsPanelTemplate>
144+
</ComboBox.ItemsPanel>
145+
</ComboBox>
146+
</smtx:XamlDisplay>
147+
<smtx:XamlDisplay Key="comboboxes_7">
148+
<ComboBox materialDesign:HintAssist.Hint="(float hint)"
149+
ItemsSource="{Binding LongListToTestComboVirtualization}"
150+
Style="{StaticResource MaterialDesignFloatingHintComboBox}">
151+
<ComboBox.ItemsPanel>
152+
<ItemsPanelTemplate>
153+
<VirtualizingStackPanel />
154+
</ItemsPanelTemplate>
155+
</ComboBox.ItemsPanel>
156+
</ComboBox>
157+
</smtx:XamlDisplay>
158+
<smtx:XamlDisplay Key="comboboxes_8">
159+
<ComboBox materialDesign:HintAssist.Hint="(large float hint)"
160+
materialDesign:HintAssist.FloatingScale="1.5"
161+
materialDesign:HintAssist.FloatingOffset="0, -24"
162+
MinWidth="72"
163+
ItemsSource="{Binding LongListToTestComboVirtualization}"
164+
Style="{StaticResource MaterialDesignFloatingHintComboBox}">
165+
<ComboBox.ItemsPanel>
166+
<ItemsPanelTemplate>
167+
<VirtualizingStackPanel />
168+
</ItemsPanelTemplate>
169+
</ComboBox.ItemsPanel>
170+
</ComboBox>
171+
</smtx:XamlDisplay>
172+
</StackPanel>
173+
174+
175+
<TextBlock Style="{StaticResource SectionTitle}">Filled ComboBox</TextBlock>
176+
<smtx:XamlDisplay Key="comboboxes_filled_combobox" HorizontalAlignment="Left">
177+
<StackPanel>
178+
<Grid>
179+
<Grid.ColumnDefinitions>
180+
<ColumnDefinition />
181+
<ColumnDefinition />
182+
</Grid.ColumnDefinitions>
183+
<CheckBox x:Name="MaterialDesignFilledComboBoxEnabledComboBox"
184+
IsChecked="True" Margin="0,0,0,8" Content="Enabled" />
185+
<Button Content="Clear" Style="{StaticResource MaterialDesignFlatButton}" HorizontalAlignment="Right"
186+
Grid.Column="1" Click="ClearFilledComboBox_Click" />
187+
</Grid>
188+
<ComboBox Style="{StaticResource MaterialDesignFilledComboBox}" x:Name="FilledComboBox"
189+
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignFilledComboBoxEnabledComboBox}"
190+
materialDesign:HintAssist.Hint="Some item"
191+
Width="256">
192+
<ComboBoxItem Content="Item 1" />
193+
<ComboBoxItem Content="Item 2" />
194+
<ComboBoxItem Content="Item 3" />
195+
</ComboBox>
196+
</StackPanel>
197+
</smtx:XamlDisplay>
198+
</StackPanel>
199+
</UserControl>

‎MainDemo.Wpf/ComboBoxes.xaml.cs

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
using MaterialDesignColors.WpfExample.Domain;
2+
3+
namespace MaterialDesignDemo
4+
{
5+
/// <summary>
6+
/// Interaction logic for ComboBoxes.xaml
7+
/// </summary>
8+
public partial class ComboBoxes
9+
{
10+
public ComboBoxes()
11+
{
12+
InitializeComponent();
13+
DataContext = new FieldsViewModel();
14+
}
15+
16+
private void ClearFilledComboBox_Click(object sender, System.Windows.RoutedEventArgs e)
17+
{
18+
FilledComboBox.SelectedItem = null;
19+
}
20+
}
21+
}

‎MainDemo.Wpf/Domain/DocumentationLinks.xaml

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<UserControl x:Class="MaterialDesignDemo.Domain.DocumentationLinks"
22
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
33
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4-
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5-
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
4+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
66
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
77
xmlns:domain="clr-namespace:MaterialDesignColors.WpfExample.Domain"
8-
mc:Ignorable="d"
8+
mc:Ignorable="d"
99
d:DesignHeight="300" d:DesignWidth="300"
1010
d:DataContext="{d:DesignInstance domain:DemoItem, IsDesignTimeCreatable=True }">
1111
<UserControl.Resources>
@@ -15,11 +15,11 @@
1515
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.TextBlock.xaml" />
1616
</ResourceDictionary.MergedDictionaries>
1717
<DataTemplate DataType="{x:Type domain:DocumentationLink}">
18-
<Button x:Name="Root" ToolTip="Wiki Article" ToolTipService.InitialShowDelay="0"
18+
<Button x:Name="Root" ToolTip="Wiki Article" ToolTipService.InitialShowDelay="0"
1919
Style="{DynamicResource MaterialDesignFlatButton}"
2020
Command="{Binding Open}">
2121
<StackPanel Orientation="Horizontal">
22-
<materialDesign:PackIcon x:Name="PackIcon" Kind="BookOpenVariant" />
22+
<materialDesign:PackIcon x:Name="PackIcon" Kind="BookOpenVariant" VerticalAlignment="Center" />
2323
<TextBlock Margin="8 0 0 0" Style="{StaticResource MaterialDesignBody1TextBlock}"
2424
Text="{Binding Label, Mode=OneWay}" />
2525
</StackPanel>
@@ -58,12 +58,12 @@
5858
</ItemsControl.ItemsPanel>
5959
<ItemsControl.ItemContainerStyle>
6060
<Style TargetType="ContentPresenter">
61-
<Setter Property="Margin" Value="0 0 32 0"></Setter>
61+
<Setter Property="Margin" Value="0 0 8 0" />
6262
</Style>
6363
</ItemsControl.ItemContainerStyle>
6464
</ItemsControl>
6565
</StackPanel>
6666
</ScrollViewer>
6767
<Border BorderBrush="{DynamicResource MaterialDesignDivider}" BorderThickness="0 0 0 1" />
6868
</Grid>
69-
</UserControl>
69+
</UserControl>

‎MainDemo.Wpf/Domain/MainWindowViewModel.cs

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -125,8 +125,16 @@ private ObservableCollection<DemoItem> GenerateDemoItems(ISnackbarMessageQueue s
125125
new []
126126
{
127127
DocumentationLink.DemoPageLink<Fields>(),
128-
DocumentationLink.StyleLink("TextBox"),
129-
DocumentationLink.StyleLink("ComboBox"),
128+
DocumentationLink.StyleLink("TextBox")
129+
})
130+
{
131+
VerticalScrollBarVisibilityRequirement = ScrollBarVisibility.Auto
132+
},
133+
new DemoItem("ComboBoxes", new ComboBoxes(),
134+
new []
135+
{
136+
DocumentationLink.DemoPageLink<ComboBoxes>(),
137+
DocumentationLink.StyleLink("ComboBox")
130138
})
131139
{
132140
VerticalScrollBarVisibilityRequirement = ScrollBarVisibility.Auto

0 commit comments

Comments
 (0)