Permite convertir el texto "defecto" que aparezca en un cuadro de texto vacío sin enfoque utilizando XAML

Question

Quiero crear un cuadro de texto, lo que tendría un texto gris "por defecto" aparece en ella, si es

a) vacío

b) perdió el foco

cuando el usuario ingresa al cuadro de texto, el texto gris "predeterminado" desaparecerá.

He intentado hacer esto usando ControlTemplate.Triggers, pero no puedo encontrar la propiedad HasFocus.

¿Cuál es la mejor manera de hacerlo con XAML?

Answer 1

Si bien no hay un beneficio real en la reinvención de la rueda, puede ser interesante ver cómo se puede hacer esto. La manera más fácil de hacer esto (en XAML puro) es crear un ControlTemplate para la TextBox que se superpone a una TextBlock cuando no está enfocada y no contiene texto:

<ControlTemplate TargetType="TextBox"> 
<Grid> 
    <TextBox Text="{Binding Text, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}" /> 
    <TextBlock HorizontalAlignment="Center" 
       VerticalAlignment="Center" 
       Text="Your Prompt Here" 
       Margin="5,0,5,0" 
       Foreground="#FF808080" 
       FontStyle="Italic" 
       IsHitTestVisible="False" 
       x:Name="UserMessage" 
       Visibility="Hidden"/> 
</Grid> 
<ControlTemplate.Triggers> 
    <MultiTrigger> 
     <MultiTrigger.Conditions> 
      <Condition Property="Text" Value=""/> 
      <Condition Property="IsKeyboardFocusWithin" Value="False"/> 
      </MultiTrigger.Conditions> 
     <Setter Property="Visibility" TargetName="UserMessage" Value="Visible"/> 
    </MultiTrigger> 
</ControlTemplate.Triggers> 
</ControlTemplate> 

la MultiTrigger significa "establecer la visibilidad a Visible si la propiedad Text está vacío y el cuadro de texto no tiene el foco del teclado"

Si quieres que esto sea más reutilizable entonces se podría crear un control personalizado con esto, ya que es la plantilla predeterminada y con una propiedad de dependencia que contiene el mensaje de solicitud

Answer 2

Simplemente puede usar Extended WPF Toolkit 's .

Escribí una pequeña guía basada en su comentario sobre cómo agregar y usar la biblioteca en su proyecto.

Paso 1) Haga clic derecho en References en su proyecto y elija Add Reference.

Paso 2) localizar e incorporar el archivo DLL WPFToolkit.Extended.dll.

Paso 3) Última es necesario agregar el código XAML.

<Window x:Class="WpfApplication2.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:extToolkit="http://schemas.xceed.com/wpf/xaml/toolkit" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <extToolkit:WatermarkTextBox Watermark="Enter First Name" /> 
    </Grid> 
</Window> 

La clave aquí es añadir el reference al archivo DLL.

xmlns:extToolkit="http://schemas.xceed.com/wpf/xaml/toolkit" 

Entonces simplemente puede usarlo en XAML de esta manera.

<extToolkit:WatermarkTextBox Watermark="Enter First Name" />