How to show text as background in TextBox correctly? - wpf

Question

i have a TextBox and a text hint that show as background:
but location of text as background which is not part of the Text of the base TextBox is not correctly.
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:v="clr-namespace:WpfApplication2"
Title="MainWindow" Height="350" Width="525">
<Grid>
<TextBox HorizontalAlignment="Left" Height="23" Margin="152,19,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120"
v:Autocomplete.Hint ="abcd"/>
</Grid>
Autocomplete.cs:
namespace WpfApplication2
{
public static class Autocomplete
{
#region Hint
public static string GetHint(DependencyObject obj)
{
return (string)obj.GetValue(HintProperty);
}
public static void SetHint(DependencyObject obj, string value)
{
obj.SetValue(HintProperty, value);
}
public static readonly DependencyProperty HintProperty =
DependencyProperty.RegisterAttached("Hint", typeof(string), typeof(Autocomplete), new PropertyMetadata(string.Empty, OnTextBoxBaseFocus));
private static string hintText = string.Empty;
private static void OnTextBoxBaseFocus(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
TextBoxBase txtBase = (TextBoxBase)d;
hintText = GetHint(d);
if (txtBase == null)
return;
if ((string)e.NewValue != null && !GetHint(d).Contains(" "))
{
txtBase.GotFocus += txtBase_GotFocus;
txtBase.LostFocus += txtBase_LostFocus;
}
else
txtBase.TextChanged -= OnChanged;
}
static void txtBase_GotFocus(object sender, RoutedEventArgs e)
{
AutocompleteText(sender);
}
static void txtBase_LostFocus(object sender, RoutedEventArgs e)
{
TextBoxBase txtBase = (TextBoxBase)sender;
// Hide Autocomplete hint
txtBase.Background = null;
}
private static void OnChanged(object sender, TextChangedEventArgs e)
{
AutocompleteText(sender);
}
private static void AutocompleteText(object sender)
{
TextBoxBase txtBase = (TextBoxBase)sender;
if (txtBase != null && txtBase.Focus())
{
// Show Autocomplete hint
var visual = new TextBlock()
{
FontStyle = FontStyles.Normal,
Text = hintText,
Foreground = Brushes.Gray
};
txtBase.Background = new VisualBrush(visual)
{
Stretch = Stretch.None,
AlignmentX = AlignmentX.Left,
AlignmentY = AlignmentY.Center,
Transform = new TranslateTransform(3, 0)
};
}
else
{
// Hide Autocomplete hint
txtBase.Background = null;
}
}
#endregion
}
}
i expected:
How to show Autocomplete.Hint as expected?.Thanks for help me !

Answer 1

One way around this is to use a TextBox as your visual instead of TextBlock. This TextBox must have the same BorderThickness and the same Size as the original TextBoxBase. Therefore your AutocompleteText method should change like this:
private static void AutocompleteText(object sender)
{
TextBoxBase txtBase = (TextBoxBase)sender;
if (txtBase != null && txtBase.Focus())
{
// Show Autocomplete hint
var visual = new TextBox()
{
BorderThickness = txtBase.BorderThickness,
BorderBrush = Brushes.Transparent,
Width = txtBase.ActualWidth,
Height = txtBase.ActualHeight,
Text = hintText,
Foreground = Brushes.Gray
};
txtBase.Background = new VisualBrush(visual)
{
Stretch = Stretch.None,
};
}
else
{
// Hide Autocomplete hint
txtBase.Background = null;
}
}