Using custom properties in WPF styles

Question

I have this text box:

<TextBox/>

I want to add a watermark to it to say, Enter your message here...

Since its not supported out of the box, this successfully does the trick:

<Style TargetType="TextBox" xmlns:sys="clr-namespace:System;assembly=mscorlib">
    <Style.Resources>
        <VisualBrush x:Key="CueBannerBrush" AlignmentX="Left" AlignmentY="Center" Stretch="None">
            <VisualBrush.Visual>
                <Label Content="Enter your message here..." Foreground="LightGray" Padding="10 0 0 0" />
            </VisualBrush.Visual>
        </VisualBrush>
    </Style.Resources>
    <Style.Triggers>
        <Trigger Property="Text" Value="{x:Static sys:String.Empty}">
            <Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
        </Trigger>
        <Trigger Property="Text" Value="{x:Null}">
            <Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
        </Trigger>
        <Trigger Property="IsKeyboardFocused" Value="True">
            <Setter Property="Background" Value="White" />
        </Trigger>
    </Style.Triggers>
</Style>

But is there a way to extend TextBox with a XAML property for WatermarkText, as follows and have my style pick it up and use it, or is there some other way to do it (C#, etc.)?

<TextBox WatermarkText="Enter your message here..."/>

If you want to use your current approach, and just have a property to piggy back in the string with. Just replace "Enter your message here..." with "{TemplateBinding Tag}" and utilize the Tag Property so it would be <TextBox Tag="Your Text Here" .... — Chris W.
– Chris W., Commented Jun 21, 2016 at 15:46
@ChrisW. That should work just fine but I would not be able to further extend my XAML element anymore once I use up my Tag. There must be a better way... — Alexandru
– Alexandru, Commented Jun 21, 2016 at 15:47
People have done it a number of different ways you can find with a quick google search. Personally last time I needed to I think I just made a custom template with an added TextBlock bound to Tag that on Focus collapsed visibility, and when the text property value ={x:Null} false (with datatrigger) it also collapsed visibility. Didn't take long from what I recall. Like 10mins. — Chris W.
– Chris W., Commented Jun 21, 2016 at 15:51
Wow putridparrot.com/blog/basics-of-extending-a-wpf-control Exact same problem :) But he had to create a new control that extends TextBox. Is that necessary? — Alexandru
– Alexandru, Commented Jun 21, 2016 at 16:02
Another option I've thought of is hard-coding two different style resources using <Style x:Key="MessageWatermark"/> where MessageWatermark contains a hard-coded string itself for example and referencing them <TextBox Style="{StaticResource MessageWatermark}"/> — Alexandru
– Alexandru, Commented Jun 21, 2016 at 16:13

unkreativ · Accepted Answer · 2016-06-21 17:33:48Z

1

The best way to do this is using Attached Dependency Properties that you can bind in the style. Just keep in mind that binding an attached dependency property is

Text={Binding (AttachedPropertyName)}

The () make the trick.

Have a look at Mahapps. It's a nice design framework and providing a TextBoxHelper class doing all this. It's open source so you can see how it is implemented using attached properties.

answered Jun 21, 2016 at 17:33

unkreativ

4902 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:52:31Z

The easiest way to do what I need is to just put a label in the same position as the text box without hit test visibility in the .xaml:

<TextBox Name="Username" Grid.Row="2" Height="40" FontFamily="Segoe UI" FontSize="20" VerticalContentAlignment="Center" TextChanged="Username_TextChanged"/>
<Label Name="UsernameLabel" Content="Username" Grid.Row="2" FontFamily="Segoe UI" FontSize="20" Foreground="LightGray" Padding="5" IsHitTestVisible="False" />

In the .cs:

private void Hostname_TextChanged(object sender, TextChangedEventArgs e)
{
    UpdateLabel(Hostname, HostnameLabel);
}

private void UpdateLabel(TextBox textBox, Label label)
{
    label.Visibility = String.IsNullOrWhiteSpace(textBox.Text) ? Visibility.Visible : Visibility.Hidden;
}

This works for password boxes too, which are sealed, so you cannot inherit them anyways if you tried to extend sealed controls.

Collectives™ on Stack Overflow

Using custom properties in WPF styles

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related