Introduction:
In this article I am creating a simple application for login and registration using WPF in visual studio 2010. In this application I am creating two window forms one is for Registration and another is for login. First of all user will register after then he/she can login.
Now I am going to discuss in brief about this application.
Step1: Open Visual Studio 2010 -> File -> New -> Project.
New project template will display and select WPF Application like as follows:
![NewProject1.png]()
Figure 1:
Step 2: Enter your project name and click on OK button.
Step 3: You will get the MainWindow.xaml window form, if you want to change then rename it and also change the StartupUri property of application into App.xaml like as follows:
App.xaml:
<Application x:Class="Login_WPF.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
StartupUri="Registration.xaml">
<Application.Resources></Application.Resources>
</Application>
Step 4: Now design your Registration page as figure 2 or copy and page following inline code.
Registration.xaml:
<Window x:Class="Login_WPF.Registration"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Registration" Height="387" Width="528" Background="Black">
<Grid Height="350" Width="525" Background="Bisque">
<TextBlock Height="23" HorizontalAlignment="Left" Margin="10,5,0,0" Name="textBlockHeading" Text="Registration:" VerticalAlignment="Top" Width="110" FontSize="17" FontStretch="ExtraCondensed"/>
<!--Button as a Link button using style-->
<Button Margin="451,5,12,288" Content="Login" Cursor="Hand" Click="Login_Click">
<Button.Template>
<ControlTemplate TargetType="Button">
<TextBlock TextDecorations="Underline">
<ContentPresenter />
</TextBlock>
</ControlTemplate>
</Button.Template>
<Button.Style>
<Style TargetType="Button">
<Setter Property="Foreground" Value="Navy" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="Red" />
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
<!--end Button as a Link button using style-->
<Grid Margin="31,0,29,23" Background="White" Height="264" VerticalAlignment="Bottom">
<Grid.RowDefinitions>
<RowDefinition Height="252*" />
<!-- <RowDefinition Height="12*" />-->
</Grid.RowDefinitions>
<TextBlock Height="20" HorizontalAlignment="Left" Margin="67,0,0,0" x:Name ="errormessage" VerticalAlignment="Top" Width="247" OpacityMask="Crimson" Foreground="#FFE5572C" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,20,0,0" Name="textBlockFirstname" Text="First Name:" VerticalAlignment="Top" Width="110" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,50,0,0" Name="textBlockLastName" Text="Last Name:" VerticalAlignment="Top" Width="110" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,80,0,0" Name="textBlockEmailId" Text="EmailId" VerticalAlignment="Top" Width="110" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,107,0,0" Name="textBlockPassword" Text="Password:" VerticalAlignment="Top" Width="110" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,136,0,0" Name="textBlockConfirmPwd" Text="ConfirmPassword:" VerticalAlignment="Top" Width="110" Grid.RowSpan="2" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="67,166,0,0" Name="textBlockAddress" Text="Address" VerticalAlignment="Top" Width="110" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="183,20,0,0" Name="textBoxFirstName" VerticalAlignment="Top" Width="222" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="183,50,0,0" Name="textBoxLastName" VerticalAlignment="Top" Width="222" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="183,80,0,0" Name="textBoxEmail" VerticalAlignment="Top" Width="222" />
<PasswordBox Height="23" HorizontalAlignment="Left" Margin="183,107,0,0" Name="passwordBox1" VerticalAlignment="Top" Width="222" />
<!--For password-->
<PasswordBox Height="23" HorizontalAlignment="Left" Margin="183,136,0,0" Name="passwordBoxConfirm" VerticalAlignment="Top" Width="222" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="183,0,0,66" Name="textBoxAddress" VerticalAlignment="Bottom" Width="222" />
<Button Content="Submit" Height="23" HorizontalAlignment="Left" Margin="183,204,0,0" Name="Submit" VerticalAlignment="Top" Width="70" Click="Submit_Click" />
<Button Content="Reset" Height="23" HorizontalAlignment="Left" Margin="259,204,0,0" Name="button2" VerticalAlignment="Top" Width="70" Click="button2_Click" />
<Button Content="Cancel" Height="23" HorizontalAlignment="Right" Margin="0,204,60,0" Name="button3" VerticalAlignment="Top" Width="70" Click="button3_Click" />
</Grid>
</Grid>
</Window>
![registration.png]()
Figure 2: Registration form
Registration.xaml.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Data;
using System.Data.SqlClient;
using System.Text.RegularExpressions;
namespace Login_WPF
{
/// <summary>
/// Interaction logic for Registration.xaml
/// </summary>
public partial class Registration : Window
{
public Registration()
{
InitializeComponent();
}
private void Login_Click(object sender, RoutedEventArgs e)
{
Login login = new Login();
login.Show();
Close();
}
private void button2_Click(object sender, RoutedEventArgs e)
{
Reset();
}
public void Reset()
{
textBoxFirstName.Text = "";
textBoxLastName.Text = "";
textBoxEmail.Text = "";
textBoxAddress.Text = "";
passwordBox1.Password = "";
passwordBoxConfirm.Password = "";
}
private void button3_Click(object sender, RoutedEventArgs e)
{
Close();
}
private void Submit_Click(object sender, RoutedEventArgs e)
{
if (textBoxEmail.Text.Length == 0)
{
errormessage.Text = "Enter an email.";
textBoxEmail.Focus();
}
else if (!Regex.IsMatch(textBoxEmail.Text, @"^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$"))
{
errormessage.Text = "Enter a valid email.";
textBoxEmail.Select(0, textBoxEmail.Text.Length);
textBoxEmail.Focus();
}
else
{
string firstname = textBoxFirstName.Text;
string lastname = textBoxLastName.Text;
string email = textBoxEmail.Text;
string password = passwordBox1.Password;
if (passwordBox1.Password.Length == 0)
{
errormessage.Text = "Enter password.";
passwordBox1.Focus();
}
else if (passwordBoxConfirm.Password.Length == 0)
{
errormessage.Text = "Enter Confirm password.";
passwordBoxConfirm.Focus();
}
else if (passwordBox1.Password != passwordBoxConfirm.Password)
{
errormessage.Text = "Confirm password must be same as password.";
passwordBoxConfirm.Focus();
}
else
{
errormessage.Text = "";
string address = textBoxAddress.Text;
SqlConnection con = new SqlConnection("Data Source=TESTPURU;Initial Catalog=Data;User ID=sa;Password=wintellect");
con.Open();
SqlCommand cmd = new SqlCommand("Insert into Registration (FirstName,LastName,Email,Password,Address) values('" + firstname + "','" + lastname + "','" + email + "','" + password + "','" + address + "')", con);
cmd.CommandType = CommandType.Text;
cmd.ExecuteNonQuery();
con.Close();
errormessage.Text = "You have Registered successfully.";
Reset();
}
}
}
}
}
Now I am taking another form for login as follows:
Login.xaml:
<Window x:Class="Login_WPF.Login"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Login" Height="350" Width="525">
<Grid>
<TextBlock Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="LoginHeading" Text="Login:" VerticalAlignment="Top" FontSize="17" FontStretch="ExtraCondensed"/>
<TextBlock Height="50" HorizontalAlignment="Left" Margin="24,48,0,0" Name="textBlockHeading" VerticalAlignment="Top" FontSize="12" FontStyle="Italic" Padding="5">
Note: Please login here to view the features of this site. If you are new on this site then <LineBreak /><!--line break-->
please click on
<!--textblock as a Hyperlink.-->
<TextBlock>
<Hyperlink Click="buttonRegister_Click" FontSize="14" FontStyle="Normal">Register</Hyperlink>
</TextBlock>
<!--end textblock as a hyperlink-->
button
</TextBlock>
<TextBlock Height="23" HorizontalAlignment="Left" Margin="66,120,0,0" Name="textBlock1" Text="Email" VerticalAlignment="Top" Width="67" />
<TextBlock Height="23" HorizontalAlignment="Left" Margin="58,168,0,0" Name="textBlock2" Text="Password" VerticalAlignment="Top" Width="77" />
<TextBox Height="23" HorizontalAlignment="Left" Margin="118,115,0,0" Name="textBoxEmail" VerticalAlignment="Top" Width="247" />
<PasswordBox Height="23" HorizontalAlignment="Left" Margin="118,168,0,0" Name="passwordBox1" VerticalAlignment="Top" Width="247" />
<Button Content="Login" Height="23" HorizontalAlignment="Left" Margin="118,211,0,0" Name="button1" VerticalAlignment="Top" Width="104" Click="button1_Click" />
<TextBlock Height="23" HorizontalAlignment="Left" x:Name ="errormessage" VerticalAlignment="Top" Width="247" Margin="118,253,0,0" OpacityMask="Crimson" Foreground="#FFE5572C" />
</Grid>
</Window>
![login.png]()
Figure 3: Login form.
Login.xaml.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Data;
using System.Data.SqlClient;
using System.Text.RegularExpressions;
namespace Login_WPF
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class Login : Window
{
public Login()
{
InitializeComponent();
}
Registration registration = new Registration();
Welcome welcome = new Welcome();
private void button1_Click(object sender, RoutedEventArgs e)
{
if (textBoxEmail.Text.Length == 0)
{
errormessage.Text = "Enter an email.";
textBoxEmail.Focus();
}
else if (!Regex.IsMatch(textBoxEmail.Text, @"^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9][\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]$"))
{
errormessage.Text = "Enter a valid email.";
textBoxEmail.Select(0, textBoxEmail.Text.Length);
textBoxEmail.Focus();
}
else
{
string email = textBoxEmail.Text;
string password = passwordBox1.Password;
SqlConnection con = new SqlConnection("Data Source=TESTPURU;Initial Catalog=Data;User ID=sa;Password=wintellect");
con.Open();
SqlCommand cmd = new SqlCommand("Select * from Registration where Email='" + email + "' and password='" + password + "'", con);
cmd.CommandType = CommandType.Text;
SqlDataAdapter adapter = new SqlDataAdapter();
adapter.SelectCommand = cmd;
DataSet dataSet = new DataSet();
adapter.Fill(dataSet);
if (dataSet.Tables[0].Rows.Count > 0)
{
string username = dataSet.Tables[0].Rows[0]["FirstName"].ToString() + " " + dataSet.Tables[0].Rows[0]["LastName"].ToString();
welcome.TextBlockName.Text = username;//Sending value from one form to another form.
welcome.Show();
Close();
}
else
{
errormessage.Text = "Sorry! Please enter existing emailid/password.";
}
con.Close();
}
}
private void buttonRegister_Click(object sender, RoutedEventArgs e)
{
registration.Show();
Close();
}
}
}
Welcome.xaml:
<Window x:Class="Login_WPF.Welcome"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Welcome" Height="250" Width="400">
<Grid>
<TextBlock Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" x:Name="WelcomeHeading" Text="Welcome:" VerticalAlignment="Top" FontSize="17" FontStretch="ExtraCondensed"/>
<TextBlock Height="23" HorizontalAlignment="Left" Margin="90,10,0,0" x:Name="TextBlockName" VerticalAlignment="Top" FontSize="15" FontStretch="ExtraCondensed" />
</Grid>
</Window>
At last if user login successfully then welcome message will display on another form as shown below:
![welcome.png]()
Figure 4: