extended - Cuadro de texto de marca de agua wpf xceed toolkit que muestra la marca de agua hasta la primera entrada
extended wpf toolkit github (1)
He modificado el estilo predeterminado para ti. Ahora la marca de agua se muestra con el color predeterminado (ligeramente más oscuro) del sistema de "texto inactivo" predeterminado, y la opacidad de la marca de agua cambia a 0,4 cuando recibe el enfoque pero no tiene contenido. Una vez que tiene texto, la marca de agua desaparece por completo. Se ve bastante bien, creo:
<LinearGradientBrush x:Key="TextBoxBorder" EndPoint="0,20" MappingMode="Absolute" StartPoint="0,0">
<GradientStop Color="#ABADB3" Offset="0.05" />
<GradientStop Color="#E2E3EA" Offset="0.07" />
<GradientStop Color="#E3E9EF" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="TextBox_MouseOver" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#5794BF" Offset="0.05" />
<GradientStop Color="#B7D5EA" Offset="0.07" />
<GradientStop Color="#C7E2F1" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="TextBox_Focused" EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="#3D7BAD" Offset="0.05" />
<GradientStop Color="#A4C9E3" Offset="0.07" />
<GradientStop Color="#B7D9ED" Offset="1" />
</LinearGradientBrush>
<SolidColorBrush x:Key="TextBox_DisabledBorder" Color="#ADB2B5" />
<SolidColorBrush x:Key="TextBox_DisabledBackground" Color="#F4F4F4" />
<DataTemplate x:Key="DefaultWatermarkTemplate">
<ContentControl Content="{Binding}" Foreground="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" Focusable="False" />
</DataTemplate>
<Style TargetType="{x:Type extToolkit:WatermarkTextBox}">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" />
<Setter Property="BorderBrush" Value="{StaticResource TextBoxBorder}" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Padding" Value="3" />
<Setter Property="AllowDrop" Value="true" />
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst" />
<Setter Property="Stylus.IsFlicksEnabled" Value="False" />
<Setter Property="WatermarkTemplate" Value="{StaticResource DefaultWatermarkTemplate}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type extToolkit:WatermarkTextBox}">
<Grid>
<Border x:Name="Border" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="1" Background="{TemplateBinding Background}" />
<Border x:Name="MouseOverVisual" Opacity="0" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{StaticResource TextBox_MouseOver}" CornerRadius="1" />
<Border x:Name="FocusVisual" Opacity="0" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{StaticResource TextBox_Focused}" CornerRadius="1" />
<ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
<ContentPresenter x:Name="PART_WatermarkHost"
Content="{TemplateBinding Watermark}"
ContentTemplate="{TemplateBinding WatermarkTemplate}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
IsHitTestVisible="False"
Margin="{TemplateBinding Padding}"
Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Text" Value="" />
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Visibility" TargetName="PART_WatermarkHost" Value="Visible" />
</MultiTrigger.Setters>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsKeyboardFocusWithin" Value="True" />
<Condition Property="Text" Value="" />
</MultiTrigger.Conditions>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="PART_WatermarkHost" Storyboard.TargetProperty="Opacity" To=".33" Duration="0:0:0.2" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="PART_WatermarkHost" Storyboard.TargetProperty="Opacity" Duration="0:0:0.4" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
<Trigger Property="Text" Value="">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="PART_WatermarkHost" Storyboard.TargetProperty="Opacity" Duration="0:0:0.4" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="PART_WatermarkHost" Storyboard.TargetProperty="Opacity" To="0" Duration="0:0:0.2" />
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="MouseOverVisual" Property="Opacity" Value="1" />
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter TargetName="FocusVisual" Property="Opacity" Value="1" />
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource TextBox_DisabledBorder}" />
<Setter TargetName="Border" Property="Background" Value="{StaticResource TextBox_DisabledBackground}" />
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
La forma más fácil de aplicar esto a través de su aplicación es soltar ese XAML en Application.Resources
en su App.xaml
. Siéntase libre de modificar los colores y los valores de opacidad.
El comportamiento predeterminado es que la marca de agua desaparece cuando el cuadro de texto obtiene el foco. Me gustaría hacer que el contenido de la marca de agua desaparezca solo cuando el usuario escriba el primer carácter y luego vuelva a aparecer si se borra el texto. Alguien tiene una buena manera de lograr esto?