CODEWITHSUNDEEP
silverlightxamlwindows-phone-7controltemplate
Hieu Nguyen
Hieu Nguyen

Reputation: 404

Show Password Char by Customizing Style for PasswordBox in Silverlight for Windows Phone 7

I want to create my own password box in order to handle background state when password box is focus or lost focus. This is the style for my password box:

<Style x:Key="GamePasswordBox" TargetType="PasswordBox">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="PasswordBox">
                <Grid>
                    <vsm:VisualStateManager.VisualStateGroups>
                        <vsm:VisualStateGroup x:Name="CommonStates">
                            <vsm:VisualState x:Name="GotFocus">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To=".6"/>
                                </Storyboard>
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="LostFocus">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To="1"/>
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Border x:Name="Background" CornerRadius="0" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}">
                        <Grid Background="{TemplateBinding Background}" Margin="0">
                        </Grid>
                    </Border>
                    <ContentPresenter
                          x:Name="contentPresenter"
                          Content="{TemplateBinding Password}"
                          Margin="{TemplateBinding Padding}"
                        />
                </Grid>                    
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

The problem is the password box now shows the input chars instead of mask password chars. How to fix this problem?

Upvotes: 0

Views: 890

Answers (1)

Bill Reiss
Bill Reiss

Reputation: 3460

Looking at what gets generated by Expression Blend when templating a PasswordBox, it actually embeds another PasswordBox instead of having a ContentPresenter.

If you really need to use a ContentPresenter you may look at creating a value converter that takes the length of the string coming in and returns a string consisting of all PasswordChar with a length equal to the length of the input string.

Another option I've seen but I can't seem to find the original post right now is to use a font where every character looks like the password dot.

Edit: I found a font that is all password "bullets" you can get at http://hypv0141.appliedi.net/justbullets.ttf there may be better ones out there.

Upvotes: 1

Related Questions