WPF中TextBoxes的焦点相关文本更改

Question

我正在使用MVVM模式在WPF中编写应用程序,并且通常会使用TextBoxes.我不想让用户使用标签来了解用户文本框的用途,即我不想要这样的东西:

<TextBlock> Name: </TextBlock>
<TextBox />

相反,我希望TextBox包含自己的标签.静态地,你会这样表达:

<TextBox>Name</TextBox>

如果光标显示在文本框中,即TextBox增益焦点,我希望描述文本消失.如果TextBox留空并且失去焦点,则应再次显示描述文本.它类似于StackOverflow的搜索文本框或Firefox的搜索文本框.(如果你不确定我的意思,请告诉我).

一个TextBox的标签可能会在运行时更改,取决于例如ComboBox所选元素或ViewModel中的值.(就像在Firefox的搜索TextBox中一样,如果你从搜索引擎菜单中选择google,TextBox的标签会变为"Google",如果你选择"Yahoo"将其设置为"Yahoo").因此,我希望能够绑定标签的内容.

考虑到我可能已经在Text-Property 上有一个Binding TextBox.

如何实现这样的行为并让它可以重复使用我TextBox的任何一个？代码是受欢迎的但不是必需的; 要做什么就足够了.

先感谢您.

Answer 1

这是我认为正是您正在寻找的风格,它是纯XAML.

<Style x:Key="WatermarkTextBox" TargetType="{x:Type TextBox}">
     <Setter Property="Template">
          <Setter.Value>
               <ControlTemplate TargetType="{x:Type TextBox}">
                    <Grid>
                         <Border x:Name="BorderBase" Background="White" BorderThickness="1.4,1.4,1,1" BorderBrush="Silver"> 
                             <Label x:Name="TextPrompt" 
                                Content="{Binding RelativeSource={RelativeSource  Mode=TemplatedParent}, Path=Tag}" 
                                Background="{TemplateBinding Background}" Visibility="Collapsed" 
                                Focusable="False" Foreground="Silver"/>
                         </Border>
                         <ScrollViewer Margin="0" x:Name="PART_ContentHost" Foreground="Black"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                         <MultiTrigger>
                              <MultiTrigger.Conditions>
                                   <Condition Property="IsFocused" Value="False"/>
                                   <Condition Property="Text" Value=""/>
                              </MultiTrigger.Conditions>
                              <Setter Property="Visibility" TargetName="TextPrompt" Value="Visible"/>
                         </MultiTrigger>
                         <Trigger Property="IsFocused" Value="True">
                              <Setter Property="BorderBrush" TargetName="BorderBase" Value="Black"/>
                         </Trigger>
                         <Trigger Property="IsEnabled" Value="False">
                              <Setter Property="Foreground" Value="DimGray" />
                         </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
           </Setter.Value>
      </Setter>
 </Style>

用法是:

<TextBox Style="{StaticResource WatermarkTextBox}" Tag="Full Name"/>

其中Tag是您要显示的帮助消息.

您可以清理此样式供您自己使用,但最重要的部分是控制隐藏/显示帮助文本.

值得注意的是,已经有一个DependencyObject可用于存储帮助文本,因此您不需要使用此方法创建自己的.

FrameworkElement.Tag可用于保存有关此元素的任意信息.这就是我们设置Tag属性的原因:

http://msdn.microsoft.com/en-us/library/system.windows.frameworkelement.tag.aspx