forked from MaterialDesignInXAML/MaterialDesignInXamlToolkit
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathPickers.xaml
More file actions
191 lines (188 loc) · 13.1 KB
/
Pickers.xaml
File metadata and controls
191 lines (188 loc) · 13.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
<UserControl x:Class="MaterialDesignColors.WpfExample.Pickers"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
xmlns:domain="clr-namespace:MaterialDesignDemo.Domain"
xmlns:smtx="clr-namespace:ShowMeTheXAML;assembly=ShowMeTheXAML"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<!-- for some reason to get the validation templates to show on this page need an extra decorator. haven't figure out why yet -->
<AdornerDecorator>
<ScrollViewer>
<Grid Margin="32">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Grid.ColumnSpan="3">Classic WPF DatePicker control with Material Design theme, and new TimePicker control:</TextBlock>
<StackPanel Grid.Row="1" Grid.Column="0">
<smtx:XamlDisplay Key="pickers_1" HorizontalAlignment="Left" Margin="0 16 0 0">
<DatePicker Width="100" materialDesign:HintAssist.Hint="Pick Date" Style="{StaticResource MaterialDesignFloatingHintDatePicker}" />
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_2" HorizontalAlignment="Left" Margin="0 16 0 0" >
<DatePicker x:Name="FutureDatePicker" Width="100"
materialDesign:HintAssist.Hint="Future Date">
<DatePicker.SelectedDate>
<Binding Path="FutureValidatingDate" UpdateSourceTrigger="PropertyChanged">
<Binding.ValidationRules>
<domain:FutureDateValidationRule ValidatesOnTargetUpdated="True" />
</Binding.ValidationRules>
</Binding>
</DatePicker.SelectedDate>
</DatePicker>
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_2_disabled" HorizontalAlignment="Left" Margin="0 16 0 0" >
<DatePicker IsEnabled="False" Width="100" materialDesign:HintAssist.Hint="Disabled" />
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_3" HorizontalAlignment="Left" Margin="0 32 0 0">
<ComboBox Name="LocaleCombo" Width="50">
<ComboBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
</ComboBox>
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_4" HorizontalAlignment="Left" Margin="0 16 0 0">
<DatePicker Name="LocaleDatePicker" Width="120" materialDesign:HintAssist.Hint="Locale Date" />
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_5" HorizontalAlignment="Left" Margin="0 16 0 0">
<DatePicker Name="LocaleDatePickerRTL" Width="120" materialDesign:HintAssist.Hint="RTL Locale Date" FlowDirection="RightToLeft" />
</smtx:XamlDisplay>
</StackPanel>
<StackPanel Grid.Row="1" Grid.Column="1" >
<smtx:XamlDisplay Key="pickers_6" HorizontalAlignment="Left" Margin="0 16 0 0" VerticalAlignment="Top">
<materialDesign:TimePicker Width="100"
Style="{StaticResource MaterialDesignFloatingHintTimePicker}"
materialDesign:HintAssist.Hint="Custom hint" />
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_6_disabled" HorizontalAlignment="Left" Margin="0 16 0 0" VerticalAlignment="Top">
<materialDesign:TimePicker Width="100" IsEnabled="False"
Style="{StaticResource MaterialDesignFloatingHintTimePicker}"
materialDesign:HintAssist.Hint="Disabled" />
</smtx:XamlDisplay>
</StackPanel>
<smtx:XamlDisplay Key="pickers_7" Grid.Row="1" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0 16 0 0">
<materialDesign:TimePicker Is24Hours="True" x:Name="PresetTimePicker" Width="100" SelectedTimeChanged="PresetTimePicker_SelectedTimeChanged"/>
</smtx:XamlDisplay>
<StackPanel Grid.Row="1" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left">
<smtx:XamlDisplay Key="pickers_8" Margin="0 16 0 0">
<materialDesign:TimePicker
materialDesign:HintAssist.Hint="Validates"
IsInvalidTextAllowed="True"
Is24Hours="{Binding IsChecked, ElementName=Is24HourCheckbox}"
Width="100">
<materialDesign:TimePicker.Text>
<Binding Path="ValidatingTime" UpdateSourceTrigger="PropertyChanged">
<Binding.ValidationRules>
<domain:SimpleDateValidationRule ValidatesOnTargetUpdated="True" />
</Binding.ValidationRules>
</Binding>
</materialDesign:TimePicker.Text>
</materialDesign:TimePicker>
</smtx:XamlDisplay>
<CheckBox Content="Is 24 Hour" x:Name="Is24HourCheckbox" IsChecked="True" Margin="0,10,0,0" VerticalAlignment="Top"/>
</StackPanel>
<smtx:XamlDisplay Key="pickers_11" Grid.Row="1" Grid.Column="4" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0 16 0 0">
<materialDesign:TimePicker
materialDesign:HintAssist.Hint="With Seconds"
Is24Hours="{Binding IsChecked, ElementName=Is24HourCheckbox}"
x:Name="WithSecondsTimePicker"
WithSeconds="True"
Width="100" />
</smtx:XamlDisplay>
<TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="4" Margin="0 128 0 0">By combining the DialogHost (see MainWindow.xaml) and the Calendar and Clock controls, custom popups can be built.</TextBlock>
<smtx:XamlDisplay Key="pickers_9" Grid.Row="3" Grid.Column="0" Margin="0 32 0 0" HorizontalAlignment="Left">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Date, StringFormat=d}" VerticalAlignment="Center" FontSize="24" />
<Button Margin="8 0 0 0" Content="..."
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
materialDesign:DialogHost.DialogOpenedAttached="CalendarDialogOpenedEventHandler"
materialDesign:DialogHost.DialogClosingAttached="CalendarDialogClosingEventHandler">
<Button.CommandParameter>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Calendar x:Name="Calendar" Margin="-1 -4 -1 0" />
<StackPanel Grid.Row="1" Margin="8" HorizontalAlignment="Right" Orientation="Horizontal">
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="0" Style="{DynamicResource MaterialDesignFlatButton}">CANCEL</Button>
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="1" Style="{DynamicResource MaterialDesignFlatButton}">OK</Button>
</StackPanel>
</Grid>
</Button.CommandParameter>
</Button>
</StackPanel>
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_10" Grid.Row="3" Grid.Column="1" Margin="0 32 0 0" HorizontalAlignment="Left">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Time, StringFormat=t}" VerticalAlignment="Center" FontSize="24" />
<Button Margin="8 0 0 0" Content="..."
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
materialDesign:DialogHost.DialogOpenedAttached="ClockDialogOpenedEventHandler"
materialDesign:DialogHost.DialogClosingAttached="ClockDialogClosingEventHandler">
<Button.CommandParameter>
<Grid Margin="-1">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<materialDesign:Clock DisplayAutomation="ToSeconds" x:Name="Clock" />
<StackPanel Grid.Row="1" Margin="8" HorizontalAlignment="Right" Orientation="Horizontal">
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="0" Style="{DynamicResource MaterialDesignFlatButton}">CANCEL</Button>
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="1" Style="{DynamicResource MaterialDesignFlatButton}">OK</Button>
</StackPanel>
</Grid>
</Button.CommandParameter>
</Button>
</StackPanel>
</smtx:XamlDisplay>
<smtx:XamlDisplay Key="pickers_12" Grid.Row="3" Grid.Column="2" Margin="0 32 0 0" HorizontalAlignment="Left">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Date, StringFormat={}{0:yyyy-MM-dd HH:mm:ss}}" VerticalAlignment="Center" FontSize="24" />
<Button Margin="8 0 0 0" Content="..."
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
materialDesign:DialogHost.DialogOpenedAttached="CombinedDialogOpenedEventHandler"
materialDesign:DialogHost.DialogClosingAttached="CombinedDialogClosingEventHandler">
<Button.CommandParameter>
<Grid Margin="-1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<Calendar
x:Name="CombinedCalendar"
Margin="-1 -4 -1 0"
/>
<materialDesign:Clock
x:Name="CombinedClock"
DisplayAutomation="CycleWithSeconds"
Is24Hours="True"
/>
</StackPanel>
<StackPanel Grid.Row="1" Margin="8" HorizontalAlignment="Right" Orientation="Horizontal">
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="0" Style="{DynamicResource MaterialDesignFlatButton}">CANCEL</Button>
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="1" Style="{DynamicResource MaterialDesignFlatButton}">OK</Button>
</StackPanel>
</Grid>
</Button.CommandParameter>
</Button>
</StackPanel>
</smtx:XamlDisplay>
</Grid>
</ScrollViewer>
</AdornerDecorator>
</UserControl>