Skip to content

Commit 9fca81e

Browse files
database64128database64128
authored
🪄 Demo app: Rearrange fields (#2524)
1 parent b77b755 commit 9fca81e

File tree

2 files changed

+89
-45
lines changed

2 files changed

+89
-45
lines changed

‎MainDemo.Wpf/Fields.xaml

Lines changed: 88 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
</Style>
3737
</UserControl.Resources>
3838

39-
<StackPanel Margin="16 0 16 16">
39+
<StackPanel Margin="8 0 16 16">
4040
<Grid VerticalAlignment="Top">
4141
<Grid.ColumnDefinitions>
4242
<ColumnDefinition Width="Auto"/>
@@ -130,12 +130,34 @@
130130
VerticalAlignment="Center"/>
131131
</smtx:XamlDisplay>
132132

133+
<smtx:XamlDisplay
134+
UniqueKey="fields_16"
135+
Grid.Row="5"
136+
Grid.Column="1"
137+
Margin="0 8">
138+
<TextBox
139+
Style="{StaticResource MaterialDesignFloatingHintTextBox}"
140+
Text="Good stuff"
141+
VerticalAlignment="Center"
142+
materialDesign:TextFieldAssist.HasClearButton="True"
143+
materialDesign:TextFieldAssist.PrefixText="$"
144+
materialDesign:TextFieldAssist.SuffixText="mm">
145+
<materialDesign:HintAssist.Hint>
146+
<StackPanel
147+
Orientation="Horizontal"
148+
Margin="-2 0 0 0">
149+
<materialDesign:PackIcon Kind="AccessPoint"/>
150+
<TextBlock Text="WiFi"/>
151+
</StackPanel>
152+
</materialDesign:HintAssist.Hint>
153+
</TextBox>
154+
</smtx:XamlDisplay>
155+
133156
<materialDesign:PackIcon
134157
Grid.Row="1"
135158
Grid.Column="2"
136159
Kind="Key"
137-
Foreground="{Binding ElementName=PasswordBox, Path=BorderBrush}"
138-
HorizontalAlignment="Right"/>
160+
Foreground="{Binding ElementName=PasswordBox, Path=BorderBrush}" />
139161

140162
<smtx:XamlDisplay
141163
UniqueKey="fields_7"
@@ -268,29 +290,6 @@
268290
</RichTextBox>
269291
</Grid>
270292
</smtx:XamlDisplay>
271-
272-
<smtx:XamlDisplay
273-
UniqueKey="fields_16"
274-
Grid.Row="5"
275-
Grid.Column="1"
276-
Margin="0 8">
277-
<TextBox
278-
Style="{StaticResource MaterialDesignFloatingHintTextBox}"
279-
Text="Good stuff"
280-
VerticalAlignment="Center"
281-
materialDesign:TextFieldAssist.HasClearButton="True"
282-
materialDesign:TextFieldAssist.PrefixText="$"
283-
materialDesign:TextFieldAssist.SuffixText="mm">
284-
<materialDesign:HintAssist.Hint>
285-
<StackPanel
286-
Orientation="Horizontal"
287-
Margin="-2 0 0 0">
288-
<materialDesign:PackIcon Kind="AccessPoint"/>
289-
<TextBlock Text="WiFi"/>
290-
</StackPanel>
291-
</materialDesign:HintAssist.Hint>
292-
</TextBox>
293-
</smtx:XamlDisplay>
294293
</Grid>
295294

296295
<Grid Margin="0 48 0 0">
@@ -303,8 +302,6 @@
303302
<ColumnDefinition Width="Auto"/>
304303
<ColumnDefinition Width="Auto"/>
305304
<ColumnDefinition Width="Auto"/>
306-
<ColumnDefinition Width="Auto"/>
307-
<ColumnDefinition Width="Auto"/>
308305
</Grid.ColumnDefinitions>
309306

310307
<Grid.Resources>
@@ -325,13 +322,6 @@
325322
Style="{StaticResource MaterialDesignHeadline5TextBlock}"
326323
Text="Filled fields"/>
327324

328-
<TextBlock
329-
Grid.Column="2"
330-
Grid.Row="0"
331-
Grid.ColumnSpan="2"
332-
Style="{StaticResource MaterialDesignHeadline5TextBlock}"
333-
Text="Outlined fields"/>
334-
335325
<smtx:XamlDisplay
336326
Grid.Row="1"
337327
Grid.Column="0"
@@ -355,23 +345,75 @@
355345
<smtx:XamlDisplay
356346
Grid.Row="1"
357347
Grid.Column="1"
348+
UniqueKey="fields_27">
349+
<StackPanel>
350+
<CheckBox
351+
x:Name="MaterialDesignFilledTextBoxTextCountComboBox"
352+
Content="View Text Input Count"/>
353+
354+
<TextBox
355+
Style="{StaticResource MaterialDesignFilledTextBox}"
356+
VerticalAlignment="Top"
357+
TextWrapping="Wrap"
358+
MaxLength="40"
359+
materialDesign:TextFieldAssist.CharacterCounterVisibility="{Binding Path=IsChecked, ElementName=MaterialDesignFilledTextBoxTextCountComboBox, Converter={StaticResource BooleanToVisibilityConverter}}"
360+
materialDesign:HintAssist.Hint="This is a limited text area"/>
361+
</StackPanel>
362+
</smtx:XamlDisplay>
363+
364+
<smtx:XamlDisplay
365+
Grid.Row="1"
366+
Grid.Column="2"
358367
UniqueKey="fields_28">
359368
<StackPanel>
360369
<CheckBox
361-
x:Name="MaterialDesignFilledPasswordFieldPasswordBoxEnabledComboBox"
370+
x:Name="MaterialDesignFilledPasswordBoxEnabledComboBox"
362371
Content="Enabled"/>
363372

364373
<PasswordBox
365374
Style="{StaticResource MaterialDesignFilledPasswordBox}"
366375
VerticalAlignment="Top"
367-
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignFilledPasswordFieldPasswordBoxEnabledComboBox}"
376+
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignFilledPasswordBoxEnabledComboBox}"
368377
materialDesign:HintAssist.Hint="Password"/>
369378
</StackPanel>
370379
</smtx:XamlDisplay>
380+
</Grid>
381+
382+
<Grid Margin="0 48 0 0">
383+
<Grid.RowDefinitions>
384+
<RowDefinition/>
385+
<RowDefinition/>
386+
</Grid.RowDefinitions>
387+
388+
<Grid.ColumnDefinitions>
389+
<ColumnDefinition Width="Auto"/>
390+
<ColumnDefinition Width="Auto"/>
391+
<ColumnDefinition Width="Auto"/>
392+
</Grid.ColumnDefinitions>
393+
394+
<Grid.Resources>
395+
<Style TargetType="{x:Type smtx:XamlDisplay}" BasedOn="{StaticResource {x:Type smtx:XamlDisplay}}">
396+
<Setter Property="Width" Value="200"/>
397+
<Setter Property="VerticalAlignment" Value="Top"/>
398+
<Setter Property="Margin" Value="0 0 16 0"/>
399+
</Style>
400+
401+
<Style TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}">
402+
<Setter Property="Margin" Value="0 8"/>
403+
<Setter Property="IsChecked" Value="True"/>
404+
</Style>
405+
</Grid.Resources>
406+
407+
<TextBlock
408+
Grid.Row="0"
409+
Grid.Column="0"
410+
Grid.ColumnSpan="2"
411+
Style="{StaticResource MaterialDesignHeadline5TextBlock}"
412+
Text="Outlined fields"/>
371413

372414
<smtx:XamlDisplay
373415
Grid.Row="1"
374-
Grid.Column="2"
416+
Grid.Column="0"
375417
UniqueKey="fields_26">
376418

377419
<StackPanel>
@@ -390,13 +432,14 @@
390432
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignOutlinedTextBoxEnabledComboBox}"/>
391433
</StackPanel>
392434
</smtx:XamlDisplay>
435+
393436
<smtx:XamlDisplay
394437
Grid.Row="1"
395-
Grid.Column="3"
438+
Grid.Column="1"
396439
UniqueKey="fields_29">
397440
<StackPanel>
398441
<CheckBox
399-
x:Name="MaterialDesignOutlinedPasswordFieldTextCountComboBox"
442+
x:Name="MaterialDesignOutlinedTextBoxTextCountComboBox"
400443
Content="View Text Input Count"/>
401444

402445
<TextBox
@@ -405,24 +448,25 @@
405448
Height="100"
406449
TextWrapping="Wrap"
407450
MaxLength="40"
408-
materialDesign:TextFieldAssist.CharacterCounterVisibility="{Binding Path=IsChecked, ElementName=MaterialDesignOutlinedPasswordFieldTextCountComboBox, Converter={StaticResource BooleanToVisibilityConverter}}"
451+
materialDesign:TextFieldAssist.CharacterCounterVisibility="{Binding Path=IsChecked, ElementName=MaterialDesignOutlinedTextBoxTextCountComboBox, Converter={StaticResource BooleanToVisibilityConverter}}"
409452
VerticalScrollBarVisibility="Auto"
410453
materialDesign:HintAssist.Hint="This is a limited text area"/>
411454
</StackPanel>
412455
</smtx:XamlDisplay>
456+
413457
<smtx:XamlDisplay
414458
Grid.Row="1"
415-
Grid.Column="4"
459+
Grid.Column="2"
416460
UniqueKey="fields_30">
417461
<StackPanel>
418462
<CheckBox
419-
x:Name="MaterialDesignOutlinedPasswordFieldPasswordBoxEnabledComboBox"
463+
x:Name="MaterialDesignOutlinedPasswordBoxEnabledComboBox"
420464
Content="Enabled"/>
421465

422466
<PasswordBox
423467
Style="{StaticResource MaterialDesignOutlinedPasswordBox}"
424468
VerticalAlignment="Top"
425-
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignOutlinedPasswordFieldPasswordBoxEnabledComboBox}"
469+
IsEnabled="{Binding Path=IsChecked, ElementName=MaterialDesignOutlinedPasswordBoxEnabledComboBox}"
426470
materialDesign:HintAssist.Hint="Password"/>
427471
</StackPanel>
428472
</smtx:XamlDisplay>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
<Setter Property="Opacity" Value="{Binding Path=(wpf:HintAssist.HintOpacity), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
3838
<Setter Property="Text" Value="{Binding Path=(wpf:HintAssist.HelperText), RelativeSource={RelativeSource Mode=TemplatedParent}}" />
3939
</Style>
40-
40+
4141
<Style x:Key="MaterialDesignTextBoxBase" TargetType="{x:Type TextBoxBase}">
4242
<Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type FrameworkElement}}, Path=(TextElement.Foreground)}"/>
4343
<Setter Property="BorderBrush" Value="{DynamicResource MaterialDesignTextBoxBorder}" />

0 commit comments

Comments
 (0)