This documentation is archived and is not being maintained.

How to: Aid Usability of a TextBox Using a Background Image

The following example shows how to aid usability of a TextBox by displaying an explanatory background image inside of the TextBox until the user inputs text, at which point the image is removed. In addition, the background image is restored again if the user removes their input. See illustration below.

A TextBox with a background image

The reason a background image is used in this example rather then simply manipulating the Text property of TextBox, is that a background image will not interfere with data binding.


    <TextBox Name="myTextBox" TextChanged="OnTextBoxTextChanged" Width="200">
        <ImageBrush ImageSource="TextBoxBackground.gif" AlignmentX="Left" Stretch="None" />
using System;
using System.Windows;
using System.Windows.Input;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Imaging;

namespace SDKSample
    public partial class TextBoxBackgroundExample : Page

        void OnTextBoxTextChanged(object sender, TextChangedEventArgs e)

            if (myTextBox.Text == "")
                // Create an ImageBrush.
                ImageBrush textImageBrush = new ImageBrush();
                textImageBrush.ImageSource =
                    new BitmapImage(
                        new Uri(@"TextBoxBackground.gif", UriKind.Relative)
                textImageBrush.AlignmentX = AlignmentX.Left;
                textImageBrush.Stretch = Stretch.None;
                // Use the brush to paint the button's background.
                myTextBox.Background = textImageBrush;


                myTextBox.Background = null;