Skip to content

TextBox: Respect externally set TextBox.Padding in triggers #3074

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 4 commits into from
Feb 11, 2023
Merged

TextBox: Respect externally set TextBox.Padding in triggers #3074

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
db631e5
Extract TextBox.Padding setters into style overrides instead of triggers
nicolaihenriksen Feb 6, 2023
f6eaf90
Fixing PasswordBox
nicolaihenriksen Feb 10, 2023
4b3dff7
Fixing ComboBox
nicolaihenriksen Feb 10, 2023
e0048e9
Fix MD3 demo app
nicolaihenriksen Feb 10, 2023
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
11 changes: 11 additions & 0 deletions MainDemo.Wpf/Domain/SmartHintViewModel.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ namespace MaterialDesignDemo.Domain;

internal class SmartHintViewModel : ViewModelBase
{
private bool _floatHint = true;
private FloatingHintHorizontalAlignment _selectedAlignment = FloatingHintHorizontalAlignment.Inherit;
private double _selectedFloatingScale = 0.75;
private bool _showClearButton = true;
Expand All @@ -18,6 +19,16 @@ internal class SmartHintViewModel : ViewModelBase

public IEnumerable<string> ComboBoxOptions { get; } = new[] {"Option 1", "Option 2", "Option 3"};

public bool FloatHint
{
get => _floatHint;
set
{
_floatHint = value;
OnPropertyChanged();
}
}

public FloatingHintHorizontalAlignment SelectedAlignment
{
get => _selectedAlignment;
Expand Down
6 changes: 2 additions & 4 deletions MainDemo.Wpf/MainWindow.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,13 +60,11 @@
Width="200"
Margin="16,4"
materialDesign:HintAssist.Hint="Search"
materialDesign:HintAssist.IsFloating="True"
materialDesign:TextFieldAssist.DecorationVisibility="Collapsed"
materialDesign:TextFieldAssist.HasClearButton="True"
materialDesign:TextFieldAssist.HasOutlinedTextField="True"
materialDesign:TextFieldAssist.TextFieldCornerRadius="4"
DockPanel.Dock="Top"
Text="{Binding SearchKeyword, UpdateSourceTrigger=PropertyChanged}" />
Text="{Binding SearchKeyword, UpdateSourceTrigger=PropertyChanged}"
Style="{StaticResource MaterialDesignOutlinedTextBox}"/>

<ListBox x:Name="DemoItemsListBox"
Margin="0,16,0,16"
Expand Down
16 changes: 15 additions & 1 deletion MainDemo.Wpf/SmartHint.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,8 @@

<GroupBox Grid.Row="0" Margin="8,0,16,16" Header="Hint Settings" Style="{StaticResource MaterialDesignCardGroupBox}">
<StackPanel Orientation="Horizontal" Margin="10">
<TextBlock Text="FloatingHintHorizontalAlignment:" VerticalAlignment="Center" />
<CheckBox Content="IsFloating" IsChecked="{Binding FloatHint}" />
<TextBlock Text="Alignment:" VerticalAlignment="Center" Margin="20,0,0,0" />
<ComboBox VerticalAlignment="Center" Margin="5,0,0,0" ItemsSource="{Binding HorizontalAlignmentOptions}" SelectedItem="{Binding SelectedAlignment, Mode=TwoWay}" />
<TextBlock Text="FloatingScale:" VerticalAlignment="Center" Margin="20,0,0,0" />
<ComboBox VerticalAlignment="Center" Margin="5,0,0,0" ItemsSource="{Binding FloatingScaleOptions}" SelectedItem="{Binding SelectedFloatingScale, Mode=TwoWay}" ItemStringFormat="F2" />
Expand Down Expand Up @@ -84,6 +85,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -114,6 +116,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -144,6 +147,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -176,6 +180,7 @@
<Style TargetType="{x:Type RichTextBox}" BasedOn="{StaticResource MaterialDesignRichTextBox}">
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -209,6 +214,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -239,6 +245,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -269,6 +276,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -302,6 +310,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -332,6 +341,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -362,6 +372,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -395,6 +406,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
<Setter Property="ItemsSource" Value="{Binding ComboBoxOptions}" />
<Setter Property="IsEditable" Value="True" />
</Style>
Expand Down Expand Up @@ -427,6 +439,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
<Setter Property="ItemsSource" Value="{Binding ComboBoxOptions}" />
<Setter Property="IsEditable" Value="True" />
</Style>
Expand Down Expand Up @@ -459,6 +472,7 @@
<Setter Property="materialDesign:TextFieldAssist.HasClearButton" Value="{Binding ShowClearButton}" />
<Setter Property="materialDesign:TextFieldAssist.HasLeadingIcon" Value="{Binding ShowLeadingIcon}" />
<Setter Property="materialDesign:TextFieldAssist.LeadingIcon" Value="{StaticResource LeadingIcon}" />
<Setter Property="materialDesign:HintAssist.IsFloating" Value="{Binding FloatHint}" />
<Setter Property="ItemsSource" Value="{Binding ComboBoxOptions}" />
<Setter Property="IsEditable" Value="True" />
</Style>
Expand Down
5 changes: 2 additions & 3 deletions MaterialDesign3.Demo.Wpf/MainWindow.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,13 +109,12 @@
<TextBox x:Name="DemoItemsSearchBox"
Margin="16,4,16,4"
materialDesign:HintAssist.Hint="Search"
materialDesign:HintAssist.IsFloating="True"
materialDesign:TextFieldAssist.DecorationVisibility="Collapsed"
materialDesign:TextFieldAssist.HasClearButton="True"
materialDesign:TextFieldAssist.HasOutlinedTextField="True"
materialDesign:TextFieldAssist.TextFieldCornerRadius="8"
DockPanel.Dock="Top"
Text="{Binding SearchKeyword, UpdateSourceTrigger=PropertyChanged}" />
Text="{Binding SearchKeyword, UpdateSourceTrigger=PropertyChanged}"
Style="{StaticResource MaterialDesignOutlinedTextBox}"/>
<ListBox x:Name="DemoItemsListBox"
Margin="12,16,12,16"
AutomationProperties.Name="DemoPagesListBox"
Expand Down
2 changes: 2 additions & 0 deletions MaterialDesignThemes.Wpf/Constants.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ namespace MaterialDesignThemes.Wpf;
public static class Constants
{
public static readonly Thickness TextBoxDefaultPadding = new Thickness(0, 4, 0, 4);
public static readonly Thickness FilledTextBoxDefaultPadding = new Thickness(16, 8, 12, 8);
public static readonly Thickness OutlinedTextBoxDefaultPadding = new Thickness(16, 16, 12, 16);
public static readonly Thickness DefaultTextBoxViewMargin = new Thickness(1, 0, 1, 0);
public static readonly Thickness DefaultTextBoxViewMarginEmbedded = new Thickness(0);
public const double TextBoxNotEnabledOpacity = 0.56;
Expand Down
3 changes: 1 addition & 2 deletions MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.ComboBox.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -481,7 +481,6 @@
</AdornerDecorator>
<ControlTemplate.Triggers>
<Trigger Property="wpf:TextFieldAssist.HasFilledTextField" Value="True">
<Setter Property="Padding" Value="16,8,12,8" />
<Setter TargetName="HelperTextWrapper" Property="Margin" Value="16,0,0,0" />
</Trigger>
<Trigger Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True">
Expand Down Expand Up @@ -880,7 +879,7 @@
TargetType="{x:Type ComboBox}"
BasedOn="{StaticResource MaterialDesignFloatingHintComboBox}">
<Setter Property="Background" Value="{DynamicResource MaterialDesignTextFieldBoxBackground}" />
<Setter Property="Padding" Value="12,8,8,8" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.FilledTextBoxDefaultPadding}" />
<Setter Property="VerticalAlignment" Value="Stretch" />
<Setter Property="VerticalContentAlignment" Value="Stretch" />
<Setter Property="wpf:ComboBoxAssist.ShowSelectedItem" Value="True" />
Expand Down
8 changes: 4 additions & 4 deletions MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.PasswordBox.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -268,14 +268,12 @@
</MultiTrigger>
<Trigger Property="wpf:TextFieldAssist.HasFilledTextField" Value="True">
<Setter Property="Background" Value="{DynamicResource MaterialDesignTextFieldBoxBackground}" />
<Setter Property="Padding" Value="16,8,12,8" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
</Trigger>
<Trigger Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True">
<Setter Property="BorderBrush" Value="{DynamicResource MaterialDesignTextAreaBorder}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Padding" Value="16,16,12,16" />
<Setter Property="VerticalContentAlignment" Value="Top" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
Expand Down Expand Up @@ -469,13 +467,15 @@
<Setter Property="wpf:TextFieldAssist.HasFilledTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4,4,0,0" />
<Setter Property="wpf:TextFieldAssist.UnderlineCornerRadius" Value="0" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.FilledTextBoxDefaultPadding}" />
</Style>

<Style x:Key="MaterialDesignOutlinedPasswordBox"
TargetType="{x:Type PasswordBox}"
BasedOn="{StaticResource MaterialDesignFloatingHintPasswordBox}">
<Setter Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.OutlinedTextBoxDefaultPadding}" />
</Style>

<!-- ******************** "Reveal" PasswordBox styles below ***************************** -->
Expand Down Expand Up @@ -772,14 +772,12 @@
</MultiTrigger>
<Trigger Property="wpf:TextFieldAssist.HasFilledTextField" Value="True">
<Setter Property="Background" Value="{DynamicResource MaterialDesignTextFieldBoxBackground}" />
<Setter Property="Padding" Value="16,8,12,8" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
</Trigger>
<Trigger Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True">
<Setter Property="BorderBrush" Value="{DynamicResource MaterialDesignTextAreaBorder}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Padding" Value="16,16,12,16" />
<Setter Property="VerticalContentAlignment" Value="Top" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
Expand Down Expand Up @@ -986,13 +984,15 @@
<Setter Property="wpf:TextFieldAssist.HasFilledTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4,4,0,0" />
<Setter Property="wpf:TextFieldAssist.UnderlineCornerRadius" Value="0" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.FilledTextBoxDefaultPadding}" />
</Style>

<Style x:Key="MaterialDesignOutlinedRevealPasswordBox"
TargetType="{x:Type PasswordBox}"
BasedOn="{StaticResource MaterialDesignFloatingHintRevealPasswordBox}">
<Setter Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.OutlinedTextBoxDefaultPadding}" />
</Style>

</ResourceDictionary>
4 changes: 2 additions & 2 deletions MaterialDesignThemes.Wpf/Themes/MaterialDesignTheme.TextBox.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -303,14 +303,12 @@
</MultiTrigger>
<Trigger Property="wpf:TextFieldAssist.HasFilledTextField" Value="True">
<Setter Property="Background" Value="{DynamicResource MaterialDesignTextFieldBoxBackground}" />
<Setter Property="Padding" Value="16,8,12,8" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
</Trigger>
<Trigger Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True">
<Setter Property="BorderBrush" Value="{DynamicResource MaterialDesignTextAreaBorder}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Padding" Value="16,16,12,16" />
<Setter TargetName="Hint" Property="wpf:TextFieldAssist.TextBoxViewMargin" Value="{x:Static wpf:Constants.DefaultTextBoxViewMarginEmbedded}" />
<Setter TargetName="HelperTextTextBlock" Property="Margin" Value="16,0,0,0" />
<Setter TargetName="Hint" Property="FloatingOffset">
Expand Down Expand Up @@ -512,13 +510,15 @@
<Setter Property="wpf:TextFieldAssist.HasFilledTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4,4,0,0" />
<Setter Property="wpf:TextFieldAssist.UnderlineCornerRadius" Value="0" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.FilledTextBoxDefaultPadding}" />
</Style>

<Style x:Key="MaterialDesignOutlinedTextBox"
TargetType="{x:Type TextBox}"
BasedOn="{StaticResource MaterialDesignFloatingHintTextBox}">
<Setter Property="wpf:TextFieldAssist.HasOutlinedTextField" Value="True" />
<Setter Property="wpf:TextFieldAssist.TextFieldCornerRadius" Value="4" />
<Setter Property="Padding" Value="{x:Static wpf:Constants.OutlinedTextBoxDefaultPadding}" />
</Style>

</ResourceDictionary>