Step 1: Create a New Universal Windows Platform Project and Write the Name According to your Project.

New project

Step 2: Now pick the MainPage.xaml file.

Main page

Step 3: Now Insidethe Main Grid you can make the design according to your application like this.

  1. <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
  3. <Grid.RowDefinitions>
  5. <RowDefinition Height="0.15*" />
  7. <RowDefinition Height="0.85*" />
  9. </Grid.RowDefinitions>
  11. <Border Grid.Row="0" Background="LightBlue">
  13. <TextBlock Name="Login" Text="Login Form"
  14. TextAlignment="Center" FontSize="30" FontStyle="Italic"
  15. FontWeight="ExtraBlack"></TextBlock>
  17. </Border>
  19. <StackPanel x:Name="stackone" Grid.Row="1">
  21. <TextBox PlaceholderText="Enter Email" Width="300"
  22. Margin="0,50,0,0"></TextBox>
  24. <TextBox PlaceholderText="Enter Password"
  25. Width="300" Margin="0,10,0,0"></TextBox>
  27. <RelativePanel HorizontalAlignment="Center"
  28. Margin="0,10,0,0">
  30. <Button x:Name="loginbtn" Content="Login"
  31. Height="35" Width="65" Click="loginbtn_Click"></Button>
  33. <Button x:Name="cancelbtn" Content="Cancel"
  34. Height="35" Width="65" Margin="10,0,0,0"
  35. RelativePanel.RightOf="loginbtn" Click="cancelbtn_Click"></Button>
  37. </RelativePanel>
  39. </StackPanel>
  41. </Grid>
  43. </Page>

Step 4: Actually the design is here of the code above.

Design

Step 5: Now Do This Step: Create a New Form Here. In This Example I Made a Registration Form.

blank app

Step 6: Now make Registration Form Design According to your Application like this:

  1. <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
  3. <Grid.RowDefinitions>
  5. <RowDefinition Height="0.15*"></RowDefinition>
  7. <RowDefinition Height="0.85*"></RowDefinition>
  9. </Grid.RowDefinitions>
  11. <Border Grid.Row="0" Background="Gainsboro">
  13. <TextBlock Name="Reg" Text="Registration Form"
  14. TextAlignment="Center" VerticalAlignment="Center"
  15. FontSize="30" FontWeight="Black" FontStyle="Italic"></TextBlock>
  17. </Border>
  19. <StackPanel Grid.Row="1">
  21. <TextBox PlaceholderText="Enter First Name"
  22. Width="300" Margin="0,50,0,0"></TextBox>
  24. <TextBox PlaceholderText="Enter Last Name"
  25. Width="300" Margin="0,10,0,0"></TextBox>
  27. <TextBox PlaceholderText="Enter Email" Width="300"
  28. Margin="0,10,0,0"></TextBox>
  30. <TextBox PlaceholderText="Enter Address"
  31. Width="300" Margin="0,10,0,0"></TextBox>
  33. <RelativePanel x:Name="inside" Grid.Row="1"
  34. HorizontalAlignment="Center" Margin="0,20,0,0">
  36. <Button x:Name="savebtn" Content="Save" Height="50"
  37. Width="70"></Button>
  39. <Button x:Name="cancelbtn" Content="Cancel"
  40. Height="50" Width="70" RelativePanel.RightOf="savebtn"
  41. Margin="10,0,0,0"></Button>
  43. </RelativePanel>
  45. </StackPanel>
  47. </Grid>
  49. </Page>

Step 7: Actually the Design of the Above code is here.

rtegistratio

Step 8: Now We Want To Click On Login and Show the Next Page of Registration.

For This Purpose We Go To In MainPage.Xaml .CS File and behind the Login button Event We Add this Line Of Code.

  1. private void loginbtn_Click(object sender, RoutedEventArgs e)
  2. {
  4. this.Frame.Navigate(typeof(Registration));
  6. }

Step 9: Now Run The Application and See Your Application and Splash Screen.

Demo

Step 10: Now Login Appears and Click On the Button; It Takes You to Registration Form.

Login

Click On Login Button.

Login Button

3 Comments

Join the conversation! Your thoughts help the community grow.

  • Guest UserPosted Jun 30, 2016, 12:17 PM

    So this information can be used later

  • Guest UserPosted Jun 30, 2016, 12:16 PM

    Kindly tell me how to store the values of login form using isolated storage for login pages.