Implement PlaceholderText (#727)

* feat: replace Watermark with PlaceholderText in AutoCompleteBox and related controls

* fix: remove duplicate PlaceholderForeground setter.
This commit is contained in:
Dong Bin
2026-02-09 15:00:07 +08:00
committed by GitHub
parent 0f63bc68bc
commit f3f59bd5b2
12 changed files with 44 additions and 29 deletions

View File

@@ -28,7 +28,7 @@
</StackPanel.Styles>
<AutoCompleteBox
Watermark="Please select a State"
PlaceholderText="Please select a State"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
Classes="Large"
@@ -41,7 +41,7 @@
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
IsEnabled="False"
Watermark="Disabled"
PlaceholderText="Disabled"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
InnerLeftContent="https://"
@@ -52,16 +52,16 @@
<AutoCompleteBox
Width="100"
Classes="Large"
Watermark="Large"
PlaceholderText="Large"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
Width="100"
Watermark="Default"
PlaceholderText="Default"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
Width="100"
Classes="Small"
Watermark="Small"
PlaceholderText="Small"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
</StackPanel>
@@ -69,12 +69,12 @@
<AutoCompleteBox
Width="100"
IsEnabled="False"
Watermark="Disabled"
PlaceholderText="Disabled"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
Width="100"
Classes="Bordered"
Watermark="Bordered"
PlaceholderText="Bordered"
ValueMemberBinding="{Binding Name,DataType=vm:StateData}" />
<AutoCompleteBox
Width="100"

View File

@@ -28,15 +28,15 @@
<NumericUpDown
Width="100"
Classes="Large"
Watermark="Large"
PlaceholderText="Large"
ButtonSpinnerLocation="Left" />
<NumericUpDown
Width="100"
Watermark="Default"
PlaceholderText="Default"
ShowButtonSpinner="False" />
<NumericUpDown
Width="100"
Watermark="Small"
PlaceholderText="Small"
Classes="Small" />
</StackPanel>

View File

@@ -23,36 +23,36 @@
<TextBox
Width="100"
Classes="Large"
Watermark="Large" />
PlaceholderText="Large" />
<TextBox
Width="100"
Watermark="Default" />
PlaceholderText="Default" />
<TextBox
Width="100"
Classes="Small"
Watermark="Small" />
PlaceholderText="Small" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBox
Width="100"
IsEnabled="False"
Watermark="Disabled" />
PlaceholderText="Disabled" />
<TextBox
Width="100"
Classes="Bordered"
Watermark="Bordered" />
PlaceholderText="Bordered" />
<TextBox
Width="100"
Classes="Bordered"
IsEnabled="False" />
</StackPanel>
<TextBox Width="300" Classes="TextArea" Watermark="TextArea TextBox" />
<TextBox Width="300" Classes="TextArea" PlaceholderText="TextArea TextBox" />
<TextBox Width="300" Classes="TextArea ClearButton" Text="TextArea with ClearButton - text should be clearable" />
<TextBox
Width="300"
Theme="{StaticResource LooklessTextBox}"
Watermark="Lookless TextBox"
PlaceholderText="Lookless TextBox"
InnerLeftContent="https://"
InnerRightContent=".com" />
</StackPanel>

View File

@@ -4,11 +4,12 @@
<Design.PreviewWith>
<StackPanel Margin="20" Spacing="20">
<TextBox Text="Hello" />
<AutoCompleteBox Width="100" />
<AutoCompleteBox Width="100" PlaceholderText="Hello" />
</StackPanel>
</Design.PreviewWith>
<ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="MinHeight" Value="{DynamicResource AutoCompleteBoxDefaultHeight}" />
<Setter Property="MaxDropDownHeight" Value="{DynamicResource AutoCompleteMaxDropdownHeight}" />
<Setter Property="Template">
@@ -23,7 +24,8 @@
Theme="{DynamicResource NonErrorTextBox}"
InnerLeftContent="{TemplateBinding InnerLeftContent}"
InnerRightContent="{TemplateBinding InnerRightContent}"
Watermark="{TemplateBinding Watermark}" />
PlaceholderForeground="{TemplateBinding PlaceholderForeground}"
PlaceholderText="{TemplateBinding PlaceholderText}" />
<Popup
Name="PART_Popup"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
@@ -63,7 +65,8 @@
MinHeight="0"
Classes="Bordered"
DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
Watermark="{TemplateBinding Watermark}" />
PlaceholderForeground="{TemplateBinding PlaceholderForeground}"
PlaceholderText="{TemplateBinding PlaceholderText}" />
<Popup
Name="PART_Popup"
MaxHeight="{TemplateBinding MaxDropDownHeight}"

View File

@@ -9,6 +9,7 @@
<ControlTheme x:Key="{x:Type CalendarDatePicker}" TargetType="CalendarDatePicker">
<Setter Property="Background" Value="{DynamicResource CalendarDatePickerBackground}" />
<Setter Property="Foreground" Value="{DynamicResource CalendarDatePickerForeground}" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource CalendarDatePickerBorderBrush}" />
<Setter Property="BorderThickness" Value="{DynamicResource CalendarDatePickerBorderThickness}" />
<Setter Property="CornerRadius" Value="{DynamicResource CalendarDatePickerCornerRadius}" />
@@ -52,8 +53,9 @@
CornerRadius="{TemplateBinding CornerRadius}"
Foreground="{TemplateBinding Foreground}"
Theme="{DynamicResource NonErrorTextBox}"
UseFloatingWatermark="{TemplateBinding UseFloatingWatermark}"
Watermark="{TemplateBinding Watermark}">
UseFloatingPlaceholder="{TemplateBinding UseFloatingPlaceholder}"
PlaceholderForeground="{TemplateBinding PlaceholderForeground}"
PlaceholderText="{TemplateBinding PlaceholderText}">
<TextBox.Styles>
<Style Selector="TextBox#PART_TextBox:pointerover /template/ Border#PART_ContentPresenterBorder">
<!-- By default the TextBox has its own focused state, override this to disable it here -->

View File

@@ -92,7 +92,7 @@
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Foreground="{TemplateBinding Foreground}"
Text="{TemplateBinding Text, Mode=TwoWay}"
Watermark="{TemplateBinding PlaceholderText}"
PlaceholderText="{TemplateBinding PlaceholderText}"
IsVisible="{TemplateBinding IsEditable}" />
<Button

View File

@@ -77,7 +77,7 @@
<TextBox
IsVisible="{Binding !SelectingFolder}"
Text="{Binding FileName}"
Watermark="{DynamicResource STRING_CHOOSER_FILE_NAME}" />
PlaceholderText="{DynamicResource STRING_CHOOSER_FILE_NAME}" />
</DockPanel>
<CheckBox
VerticalAlignment="Center"

View File

@@ -6,6 +6,7 @@
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="CornerRadius" Value="{DynamicResource NumericUpDownCornerRadius}" />
<Setter Property="MinHeight" Value="{DynamicResource NumericUpDownDefaultHeight}" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="Template">
<ControlTemplate TargetType="NumericUpDown">
<DataValidationErrors>
@@ -38,7 +39,8 @@
Theme="{DynamicResource NonErrorTextBox}"
InnerLeftContent="{TemplateBinding InnerLeftContent}"
InnerRightContent="{TemplateBinding InnerRightContent}"
Watermark="{TemplateBinding Watermark}" />
PlaceholderForeground="{TemplateBinding PlaceholderForeground}"
PlaceholderText="{TemplateBinding PlaceholderText}" />
</ButtonSpinner>
</DataValidationErrors>
</ControlTemplate>

View File

@@ -21,6 +21,7 @@
<ControlTheme x:Key="{x:Type TextBox}" TargetType="TextBox">
<Setter Property="Foreground" Value="{DynamicResource TextBoxForeground}" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="Background" Value="{DynamicResource TextBoxDefaultBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
<Setter Property="SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
@@ -66,8 +67,8 @@
Name="PART_Watermark"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Opacity="0.5"
Text="{TemplateBinding Watermark}"
Foreground="{TemplateBinding PlaceholderForeground}"
Text="{TemplateBinding PlaceholderText}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}">
<TextBlock.IsVisible>
@@ -254,6 +255,7 @@
<ControlTheme x:Key="NonErrorTextBox" TargetType="TextBox">
<Setter Property="Foreground" Value="{DynamicResource TextBoxForeground}" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="Background" Value="{DynamicResource TextBoxDefaultBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource TextBoxDefaultBorderBrush}" />
<Setter Property="SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
@@ -300,7 +302,8 @@
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Opacity="0.5"
Text="{TemplateBinding Watermark}"
Foreground="{TemplateBinding PlaceholderForeground}"
Text="{TemplateBinding PlaceholderText}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}">
<TextBlock.IsVisible>
@@ -487,6 +490,7 @@
<ControlTheme x:Key="LooklessTextBox" TargetType="TextBox">
<Setter Property="Foreground" Value="{DynamicResource TextBoxForeground}" />
<Setter Property="PlaceholderForeground" Value="{DynamicResource TextBoxPlaceholderForeground}" />
<Setter Property="SelectionBrush" Value="{DynamicResource TextBoxSelectionBackground}" />
<Setter Property="SelectionForegroundBrush" Value="{DynamicResource TextBoxSelectionForeground}" />
<Setter Property="CaretBrush" Value="{DynamicResource TextBoxTextCaretBrush}" />
@@ -520,7 +524,8 @@
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Opacity="0.5"
Text="{TemplateBinding Watermark}"
Foreground="{TemplateBinding PlaceholderForeground}"
Text="{TemplateBinding PlaceholderText}"
TextAlignment="{TemplateBinding TextAlignment}"
TextWrapping="{TemplateBinding TextWrapping}">
<TextBlock.IsVisible>

View File

@@ -7,6 +7,7 @@
<StaticResource x:Key="TextBoxPressedBackground" ResourceKey="SemiColorFill2" />
<StaticResource x:Key="TextBoxFocusBorderBrush" ResourceKey="SemiColorPrimary" />
<StaticResource x:Key="TextBoxForeground" ResourceKey="SemiColorText0" />
<StaticResource x:Key="TextBoxPlaceholderForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="TextBoxInnerForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="TextBoxDisabledBackground" ResourceKey="SemiColorDisabledFill" />
<StaticResource x:Key="TextBoxDisabledForeground" ResourceKey="SemiColorDisabledText" />

View File

@@ -7,6 +7,7 @@
<StaticResource x:Key="TextBoxPressedBackground" ResourceKey="SemiColorHighlightText" />
<StaticResource x:Key="TextBoxFocusBorderBrush" ResourceKey="SemiColorHighlight" />
<StaticResource x:Key="TextBoxForeground" ResourceKey="SemiColorWindowText" />
<StaticResource x:Key="TextBoxPlaceholderForeground" ResourceKey="SemiColorWindowText" />
<StaticResource x:Key="TextBoxInnerForeground" ResourceKey="SemiColorWindowText" />
<StaticResource x:Key="TextBoxDisabledBackground" ResourceKey="SemiColorWindow" />
<StaticResource x:Key="TextBoxDisabledForeground" ResourceKey="SemiColorGrayText" />

View File

@@ -7,6 +7,7 @@
<StaticResource x:Key="TextBoxPressedBackground" ResourceKey="SemiColorFill2" />
<StaticResource x:Key="TextBoxFocusBorderBrush" ResourceKey="SemiColorPrimary" />
<StaticResource x:Key="TextBoxForeground" ResourceKey="SemiColorText0" />
<StaticResource x:Key="TextBoxPlaceholderForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="TextBoxInnerForeground" ResourceKey="SemiColorText2" />
<StaticResource x:Key="TextBoxDisabledBackground" ResourceKey="SemiColorDisabledFill" />
<StaticResource x:Key="TextBoxDisabledForeground" ResourceKey="SemiColorDisabledText" />