Click here to Skip to main content
12,756,705 members (30,015 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as


3 bookmarked
Posted 6 Nov 2013

Button Inside passwordbox like Windows 8 in WPF Usercontrol

, 6 Nov 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
WPF passwordbox usercontrol


As a new WPF programmer, I wanted to simplify the function and was looking for good design controls. Microsoft Windows 8 OS has a new type of control, that is, a button inside the text-box. In my project log in screen, I planned to use this type of control. So I created a user-control for this.

Using the Code

Normally, WPF button has hover animation but we don't want it. So first, we style for this:

<Style x:Key="ButtonWithoutHover" TargetType="Button">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Margin" Value="0"/>
    <Setter Property="Template">
            <ControlTemplate TargetType="Button">
                <Border Name="border" 
                    Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" 
                    VerticalAlignment="Center" />

For binding this design, put Style="{StaticResource ButtonWithoutHover}" inside the button tag. Then, we have to put button control and passwordbox in Dockpanel.

<DockPanel Canvas.Right="2" Canvas.Top="2">
<Button Style="{StaticResource ButtonWithoutHover}" BorderThickness="3" 
BorderBrush="White" FontSize="15" DockPanel.Dock="Right" 
Content="->"  Click="onButtonClick" Grid.Column="1" >                   
<PasswordBox BorderThickness="0" Name="txtPassword" 
DockPanel.Dock="Left"  Grid.Column="0" />


At a Click event, we have to include the C#:

public event RoutedEventHandler Click;

void onButtonClick(object sender, RoutedEventArgs e)
    if (this.Click != null)
    this.Click(this, e);

Now the Button inside passwordbox user control is ready.

Implementing Steps

  1. Include the namespace of user control in new WPF application:
  2. Include the passwordbox in grid:
    <wpfCtrl:PasswordBoxWin8 Background="CadetBlue" Margin="24,12,257,258" FontSize="26" />

    I have not set the background in usercontrol. So you must specify the Background color while implementing.

Image for Controls

Points of Interest

I have learned the Dockpanel and border usages while creating this usercontrol.


  • Nov 06 2013 - Initial version


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Jagadeeswaran Natarajan
India India
Hi, I'm Jagadeeswaran Natarajan from Chennai, TamilNadu, India. In Past 4 years ( 2010 onwards) I'm working as a dot net programmer company called M Cubic Software Pvt Ltd, chennai.

I have done more then 4 project in various technologies.

You may also be interested in...

Comments and Discussions

SuggestionSome suggestions. Pin
Leung Yat Chun6-Nov-13 6:51
memberLeung Yat Chun6-Nov-13 6:51 
GeneralRe: Some suggestions. Pin
sago.jaga7-Nov-13 18:43
professionalsago.jaga7-Nov-13 18:43 
GeneralRe: Some suggestions. Pin
Leung Yat Chun8-Nov-13 5:59
memberLeung Yat Chun8-Nov-13 5:59 
QuestionSome more Pin
Ranjan.D6-Nov-13 6:09
professionalRanjan.D6-Nov-13 6:09 
AnswerRe: Some more Pin
sago.jaga6-Nov-13 19:19
professionalsago.jaga6-Nov-13 19:19 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170217.1 | Last Updated 6 Nov 2013
Article Copyright 2013 by Jagadeeswaran Natarajan
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid