Control Styling Tips: PasswordBox
Hello!
In this article, I’d like to provide you with some information and tips that you’ll find useful when styling a Silverlight 3 PasswordBox.
Visual states. CommonStates (Normal, MouseOver and Disabled), FocusStates (Unfocused and Focused) and ValidationStates (Valid, InvalidUnfocused and InvalidFocused).
Template parts. ContentElement (FrameworkElement)
Try template binding: Background, BorderBrush, Foreground, BorderThickness or Padding.
Here’s some artwork you might want to try turning into a PasswordBox:
The XAML that corresponds to the above image is:
<Grid Height="20" Width="120">
<Rectangle Fill="#FF333333" RadiusX="5" RadiusY="5"/>
<TextBlock Margin="5,0" Foreground="White" Text="*****" VerticalAlignment="Center"/>
</Grid>
To make a PasswordBox out of the above XAML:
- Select [Grid] and click Tools > Make Into Control > PasswordBox > OK.
- Select [Grid] . In the Parts panel, double-click ContentElement.
- Select [TextBlock] . Copy its Margin and VerticalAlignment property values to ContentElement. Delete [TextBlock] .
- In the Style, set Foreground to White.
- Scope up. Set Password to ‘abcde’ and PasswordChar to ‘*’.
You should now have a working PasswordBox!
- Steve