HintBox.WP

HintBox.WP is my brand new TextBox-based component for Windows Phone (8.0 and newer) providing support for hint (default text displayed when no user input is given). By using HintBox control in your WP application you can achieve the behavior you know and your users are used to from other platforms.


As long as no text is set in a HintBox control, the specified hint is displayed:

When user focuses the component, the hint disappears, letting the user to enter a text. After losing focus the component checks its content and if nothing is found, the hint is displayed again.

The hint has no impact on control properties. When you programmatically query the Text property while hint is shown, you get an empty string, just as you would expect. The same is true for FontStyle and Foreground properties. Also the TextChanged event is fired only when the value itself changes.

The hint is customizable - by setting its HintForeground and HintStyle properties you can control the color and style (normal/italic). Hint font is the same as set for the input. By default Gray color and FontStyles.Italic style is used.


Adding HintBox component to your Windows Phone project is easy, as it takes only 5 simple steps:

1. Add ExternalGoods.HintBox.WP package to your project via NuGet Package manager.
   In Visual Studio choose Tools > NuGet Package Manager > Manage NuGet Packages for Solution..., search for HintBox in upper right corner of the dialog and then click Install.
   
2. Add namespace reference to your PhoneApplicationPage.
   You can choose any prefix that does not exist on your page yet (red part), but the value (blue part) must stay the same, saying VS what assembly and namespace to look for the component.
   <phone:PhoneApplicationPage
      ...
      xmlns:extGoods="clr-namespace:ExternalGoods;assembly=ExternalGoods.HintBoxWP"
      ...
   />
   
3. Add HintBox component to your XAML layout using namespace from the previous step.
   
   <Grid>
      ...
      <extGoods:HintBox x:Name="username" Hint="Enter your name" />
      ...
   </Grid>
   
   You can then set any other common property or event, just like you would do with classic TextBox.

Table of HintBox control specific properties

type	name	meaning	default value	since
string	Hint	default text to be displayed when no user input is given	{empty string}	1.0.0
FontStyle	HintStyle	style of the hint - either Normal or Italic	FontStyles.Italic	1.0.0
Brush	HintForeground	hint brush - can be a color, gradient or pattern (similar to TextBox' Foreground property)	Colors.Gray	1.0.0

Hope this component will suit your needs and enrich your projects!