Hello World in Windows Phone Seven

Hello Word

Baiklah pertama-pertama sebelum kita membuat Hello Word, saya asumsikan anda sudah menginstal dan dapat membuat "New Project" dalam Visual Studio Express for Windows Phone Seven. jika anda belum menginstal dan belum dapat membuat "New Project" anda dapat melihat tutorialnya pada halaman penginstalan visual studio .

Berikut ini adalah langkah membuat "Hello Word" di Windows Phone Seven.

1. Buka Visual Studio 2010 for Windows Phone 7.
2. Pilih File → New Project → Silverlight for Windows Phone → Windows Phone Application.
3. Beri nama HelloWorld
4. Double-click pada halaman MainPage.xaml pada Solution Explorer

Secara default anda dapat melihat tampilan design Windows Phone disisi kiri. Anda dapat menambahkan elemen baru seperti tombol, textbox dengan cara drag n drop kedalam tampilan design atau anda juga dapat menambahkan manual dengan mengetikan kode XAML.




5. Pada TitleGrid yang ada didalam LayoutRoot ubah teks yang akan ditampilkan sebagai title dari aplikasi yang dibuat:
<!--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 FIRST PROJECT" Style="{StaticResource PhoneTextNormalStyle}"/> <TextBlock x:Name="PageTitle" Text="Hello World" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel>


6. Kemudian buat sebuah Grid baru dengan nama ContentPanel. Kemudian tulis kode XAML berikut:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <TextBlock x:Name="hello1" Text="Nama : Dyan Yulfiaini" Style="{StaticResource PhoneTextTitle2Style}" /> <TextBlock x:Name="hello2" Text="NIM : 49011005 " Margin="12,57,-12,-57" Style="{StaticResource PhoneTextTitle2Style}" /> </Grid>


7. Seluruh Source Dalam MainPage.xaml
<phone:PhoneApplicationPage x:Class="MyFirstProject.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"> <!--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 FIRST PROJECT" Style="{StaticResource PhoneTextNormalStyle}"/> <TextBlock x:Name="PageTitle" Text="Hello World" 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"> <TextBlock x:Name="hello1" Text="Nama : Dyan Yulfiaini" Style="{StaticResource PhoneTextTitle2Style}" /> <TextBlock x:Name="hello2" Text="NIM : 49011005 " Margin="12,57,-12,-57" Style="{StaticResource PhoneTextTitle2Style}" /> </Grid> </Grid> </phone:PhoneApplicationPage>


8. Sebelum menjalankan aplikasi anda dapat memilih target deployment dari aplikasi anda. Ada dua pilihan yaitu Windows Phone Emulator atau Windows Phone Device.



9. Jalankan aplikasi anda dengan menekan tombol F5. Maka Visual Studio akan menjalankan Emulator dan mendeploy aplikasi anda.



10. Tampilan pada emulator