Step 1 : Open Visual Studio.
- Select new -> project
- Select your preferred language
- Select Silverlight for Windows Phone application
- Name the project
- Now name the project "WindowsPhoneApplication"
Step 2 : In the design page we will use an image control, a word box and a button control to customize the control as shown below.
Code
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="LockingSystem" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Image Height="150" HorizontalAlignment="Left" Margin="116,123,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="200" Source="/PhoneApp8;component/Images/folder-png-i6.png" MouseLeftButtonDown="mouse_Click" />
<wordBox Height="72" HorizontalAlignment="Left" Margin="170,365,0,0" Name="wordBox1" VerticalAlignment="Top" Width="280" Visibility="Collapsed" />
<TextBlock Height="49" HorizontalAlignment="Left" Margin="12,376,0,0" Name="textBlock1" Text="ward" VerticalAlignment="Top" Width="140" FontSize="32" Visibility="Collapsed" />
<Button Content="OK" Height="72" HorizontalAlignment="Left" Margin="173,495,0,0" Name="button1" VerticalAlignment="Top" Width="110" Click="Button_Click" Visibility="Collapsed" />
</Grid>
Step 3 : The whole code of the MainPage.xaml page is:
Code
<phone:PhoneApplicationPage
x:Class="PhoneApp8.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded">
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="LockingSystem" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Image Height="150" HorizontalAlignment="Left" Margin="116,123,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="200" Source="/PhoneApp8;component/Images/folder-png-i6.png"
MouseLeftButtonDown="mouse_Click" />
<wordBox Height="72" HorizontalAlignment="Left" Margin="170,365,0,0" Name="wordBox1" VerticalAlignment="Top" Width="280" Visibility="Collapsed" />
<TextBlock Height="49" HorizontalAlignment="Left" Margin="12,376,0,0" Name="textBlock1" Text="ward" VerticalAlignment="Top" Width="140" FontSize="32" Visibility="Collapsed" />
<Button Content="OK" Height="72" HorizontalAlignment="Left" Margin="173,495,0,0" Name="button1" VerticalAlignment="Top" Width="110" Click="Button_Click" Visibility="Collapsed" />
</Grid>
</Grid>
</phone:PhoneApplicationPage>
Step 4 : Now we will add a pivot page on our project to implement image gallery, the customize code of this page is given below.
Code
<phone:PhoneApplicationPage
x:Class="PhoneApp8.PivotPage1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">
<!--LayoutRoot is the root grid where all page content is placed-->
<controls:Pivot Title="Album" Visibility="Visible">
<controls:Pivot.Background>
<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
<GradientStop Color="White" Offset="0.192" />
<GradientStop Color="Black" Offset="0.92400000244379044" />
</LinearGradientBrush>
</controls:Pivot.Background>
<controls:PivotItem Header=">>Image1 " FontSize="8" Height="Auto" >
<Image Source="/PhoneApp8;component/Images/Chrysanthemum.jpg"></Image>
</controls:PivotItem>
<controls:PivotItem Header=">>Image2 " FontSize="8">
<Image Source="/PhoneApp8;component/Images/dreamhome.jpg"></Image>
</controls:PivotItem>
<controls:PivotItem Header=">>Image3 " FontSize="8">
<Image Source="/PhoneApp8;component/Images/image2.jpg"></Image>
</controls:PivotItem>
<controls:PivotItem Header=">>Image4 " FontSize="8">
<Image Source="/PhoneApp8;component/Images/images1.jpg"></Image>
</controls:PivotItem>
<controls:PivotItem Header=">>Image5 " FontSize="8">
<Image Source="/PhoneApp8;component/Images/Lighthouse1.jpg"></Image>
</controls:PivotItem>
<controls:PivotItem Header=">>Image6 " FontSize="8">
<Image Source="/PhoneApp8;component/Images/Tulips.jpg"></Image>
</controls:PivotItem>
</controls:Pivot>
</phone:PhoneApplicationPage>
Step 5 : Now we will go to the code behind file of the MainPage.xaml page to write the code for On click event of button control.
Code
private void Button_Click(object sender, RoutedEventArgs e)
{
// Obtain a virtual store for the application.
IsolatedStorageFile myStore = IsolatedStorageFile.GetUserStoreForApplication();
// Create a new folder and call it "MyFolder".
myStore.CreateDirectory("MyFolder");
// Specify the file path and options.
using (var isoFileStream = new IsolatedStorageFileStream("MyFolder\\myFile.txt", FileMode.OpenOrCreate, FileAccess.Write, myStore))
{
//Write the data
using (var isoFileWriter = new StreamWriter(isoFileStream))
{
isoFileWriter.WriteLine("12345");
}
}
try
{
// Specify the file path and options.
using (var isoFileStream = new IsolatedStorageFileStream("MyFolder\\myFile.txt", FileMode.Open, myStore))
{
// Read the data.
using (var isoFileReader = new StreamReader(isoFileStream))
{
str1 = isoFileReader.ReadLine();
if (str1 == wordBox1.word)
{
NavigationService.Navigate(new Uri("/PivotPage1.xaml", UriKind.Relative));
}
else
{
wordBox1.Focus();
}
}
}
}
catch
{
// Handle the case when the user attempts to click the Read button first.
textBlock1.Text = "Need to create directory and the file first.";
}
}
Step 6 : The final source code of the MainPage.xaml.cs file is:
Code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.IO.IsolatedStorage;
using System.IO;
namespace PhoneApp8
{
public partial class MainPage : PhoneApplicationPage
{
String str1;
// Constructor
public MainPage()
{
InitializeComponent();
}
private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
}
private void mouse_Click(object sender, MouseButtonEventArgs e)
{
textBlock1.Visibility = System.Windows.Visibility.Visible;
wordBox1.Visibility = System.Windows.Visibility.Visible;
button1.Visibility = System.Windows.Visibility.Visible;
}
private void Button_Click(object sender, RoutedEventArgs e)
{
// Obtain a virtual store for the application.
IsolatedStorageFile myStore = IsolatedStorageFile.GetUserStoreForApplication();
// Create a new folder and call it "MyFolder".
myStore.CreateDirectory("MyFolder");
// Specify the file path and options.
using (var isoFileStream = new IsolatedStorageFileStream("MyFolder\\myFile.txt", FileMode.OpenOrCreate, FileAccess.Write, myStore))
{
//Write the data
using (var isoFileWriter = new StreamWriter(isoFileStream))
{
isoFileWriter.WriteLine("12345");
}
}
try
{
// Specify the file path and options.
using (var isoFileStream = new IsolatedStorageFileStream("MyFolder\\myFile.txt", FileMode.Open, myStore))
{
// Read the data.
using (var isoFileReader = new StreamReader(isoFileStream))
{
str1 = isoFileReader.ReadLine();
if (str1 == wordBox1.word)
{
NavigationService.Navigate(new Uri("/PivotPage1.xaml", UriKind.Relative));
}
else
{
wordBox1.Focus();
}
}
}
}
catch
{
// Handle the case when the user attempts to click the Read button first.
textBlock1.Text = "Need to create directory and the file first.";
}
}
}
}
Step 7 : Press F5 to run the application.
Output