How to 'format' text box values in WPF - wpf

Question

Is there an easy way to have a text box display a format in a text box and remove it when editing ?
Example : I want to ask for a money value. When the user finished entering the value 5.5, it displays $ 5.00 . When the user reclick on the textbox, it should switch back to 5.5 .
Thanks you.
Edit : What I am trying to do would be the equivalent of a converter except the textbox does not have a binding set to it.

Answer 1

There's a couple of solutions for this. Perhaps the easiest would be to implement a custom Behavior (you'll need to reference System.Windows.Interactivity.dll) & hook onto some events TextBox exposes, like GotFocus and LostFocus. Here's a sample I've done for selecting all of a TextBox's text when it gets focused:
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Interactivity;
namespace TextBoxUtility
{
public class TextBoxSelectAllOnFocusBehavior : Behavior<TextBox>
{
protected override void OnAttached()
{
base.OnAttached();
this.AssociatedObject.PreviewMouseLeftButtonDown += OnPreviewMouseLeftButtonDown;
this.AssociatedObject.GotKeyboardFocus += OnSelectAll;
this.AssociatedObject.MouseDoubleClick += OnSelectAll;
}
protected override void OnDetaching()
{
this.AssociatedObject.PreviewMouseLeftButtonDown -= OnPreviewMouseLeftButtonDown;
this.AssociatedObject.GotKeyboardFocus -= OnSelectAll;
this.AssociatedObject.MouseDoubleClick -= OnSelectAll;
base.OnDetaching();
}
private static void OnPreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
var textbox = sender as TextBox;
if (textbox != null && !textbox.IsKeyboardFocusWithin)
{
textbox.Focus();
e.Handled = true;
}
}
private static void OnSelectAll(object sender, RoutedEventArgs e)
{
var textbox = sender as TextBox;
if (textbox != null)
{
textbox.SelectAll();
}
}
Edit: Forgot to show how to hook the behavior up to the TextBox.
To attach the Behavior, in your XAML you'll need to add a namespace reference to your Behavior's namespace, and then attach it as a child of the TextBox markup like so:
<TextBox Text="{Binding ....}">
<i:Interaction.Behaviors>
<utility:TextBoxSelectAllOnFocusBehavior />
</i:Interaction.Behaviors>
</TextBox>
You could do something similar, though with yours you'd want to hook up to the LostFocus-related events and adjust the contents of the TextBox's Text property.