Cerita Kuliah | Tanggal 22 - 11 - 2013
Asalammualaikum Wr.Wb Seperti biasanya saya akan memposting hasil tugas yang dikerjakan setiap pertemuan mata kuliah windows phone setelah selesai pembelajaran Visual Programming (Windows Phone), tugas untuk masing-masing mahasiswa adalah memposting hasil dari praktek yang telah dikerjakan pada mata kuliah tersebut. Praktek kali ini mengenai “Navigation Between Page” yaitu, cara bagaimana kita memindahkan halaman atau saya sebut link, contohnya kita akan memindahkan halaman 1, ke halaman 2, dan seterusnya. kita langsung saja pada project. Seperti biasanya setelah kita membuka aplikasi windows phone kita harus mengikuti langkah-langkah yang biasanya.
Sebelum kita memulai pada project mari kita lihat beberapa tampilan gambar untuk memudahkan pekerjaan agar tidak terlalu pusing membayangkan tentang project tersebut.
tampilan main page atau menu utama
tampilan second page
ini tampilan third page
ini tampilan fourth page
ini tampilan fifth page
Seperti biasanya setelah kita mempuka aplikasi windows phone kita harus mengikuti langkah-langkah yang biasanya. Kali ini saya akan menamakan folder windows phone saya dengan nama “Sesuai Keinginan Anda”.
Setelah aplikasi telah terbuka, bisa di lihat seperti gambar di bawah
Setelah aplikasi telah terbuka, bisa di lihat seperti gambar di bawah
Klik kanan pada file MainPage2. Lebih lanjutnya lihat pada gambar dibawah
ita akan merubah nama folder menjadi “Views”. Sekarang kita akan menambahkan halaman baru agar kita dapat masuk kehalaman berikutnya. Caranya hampir sama dengan cara diatas, bedanya kita klik kanan pada folder “Views”
Setelah itu akan mencul jendela seperti gambar disamping ini
kita akan menuliskan nama file-nya . nama file bebas sesuai dengan nama yang anda inginkan.
Setelah itu kita tinggal mempersiapkan template apa saja yang dibutuhkan. Karna dosennya memberikan tugas yaitu dengan membuat 5 file dan setiap file saling berhubungan. Yang perlu di buat yaitu kita memerlukan 5 file
Setelah 5 file telah dibuat sekarang kita akan meng-double Click pada Button1 “Page 2” dan masukan kode seperti pada gambar dibawah ini.
Setelah itu kita tinggal mempersiapkan template apa saja yang dibutuhkan. Karna dosennya memberikan tugas yaitu dengan membuat 5 file dan setiap file saling berhubungan. Yang perlu di buat yaitu kita memerlukan 5 file
Setelah 5 file telah dibuat sekarang kita akan meng-double Click pada Button1 “Page 2” dan masukan kode seperti pada gambar dibawah ini.
dibawah ini adalah script dalam tampilan mainpage.xaml :
<phone:PhoneApplicationPage
x:Class="NavigationBetweenPage.View.SecondPage"
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
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 APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Second Page" 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 Height="47" HorizontalAlignment="Left" Margin="35,29,0,0" Name="namaTB" Text="" VerticalAlignment="Top" Width="324" />
<TextBlock Height="46" HorizontalAlignment="Left" Margin="35,97,0,0" Name="umurTB" Text="" VerticalAlignment="Top" Width="324" />
<TextBlock Height="56" HorizontalAlignment="Left" Margin="35,166,0,0" Name="nameTB" Text="" VerticalAlignment="Top" Width="324" />
<HyperlinkButton Content="Go To Page 3" Height="30" HorizontalAlignment="Left" Margin="35,228,0,0" Name="ThirdHB" VerticalAlignment="Top" Width="200" NavigateUri="/View/ThirdPage.xaml" />
<Button Content="Send to Page 1" Height="72" HorizontalAlignment="Left" Margin="9,264,0,0" Name="sVaBT" VerticalAlignment="Top" Width="223" Click="sVaBT_Click" />
<Button Content="Send to Page 3" Height="72" HorizontalAlignment="Left" Margin="214,264,0,0" Name="sVbBT" VerticalAlignment="Top" Width="224" Click="sVbBT_Click" />
<Button Content="Send to Page 5" Height="72" HorizontalAlignment="Right" Margin="0,342,18,0" Name="sVdBT" VerticalAlignment="Top" Width="224" Click="sVdBT_Click" />
<Button Content="Send to Page 4" Height="72" HorizontalAlignment="Left" Margin="12,342,0,0" Name="sVcBT" VerticalAlignment="Top" Width="220" Click="sVcBT_Click" />
<TextBox Height="72" HorizontalAlignment="Left" Margin="-4,403,0,0" Name="nama1TBx" Text="" VerticalAlignment="Top" Width="460" />
</Grid>
</Grid>
<!--Sample code showing usage of ApplicationBar-->
<!--<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="MenuItem 1"/>
<shell:ApplicationBarMenuItem Text="MenuItem 2"/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>-->
</phone:PhoneApplicationPage>
dibawah ini adalah script untuk beberapa button dan hyperlink untuk memberikan perintah pada aplikasi windows phone tersebut :
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;
namespace NavigationBetweenPage.View
{
public partial class SecondPage : PhoneApplicationPage
{
public SecondPage()
{
InitializeComponent();
}
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
string nama = "";
if (NavigationContext.QueryString.TryGetValue("nama", out nama))
{
namaTB.Text = nama;
}
string umur = "";
if (NavigationContext.QueryString.TryGetValue("umur", out umur))
{
umurTB.Text = umur;
}
string name = "";
if (NavigationContext.QueryString.TryGetValue("name", out name))
{
nameTB.Text = String.Format("Name = {0}", name);
}
}
private void sVbBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/ThirdPage.xaml?name=" + nama, UriKind.Relative));
}
private void sVaBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FirstPage.xaml?name=" + nama, UriKind.Relative));
}
private void sVcBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FourthPage.xaml?name=" + nama, UriKind.Relative));
}
private void sVdBT_Click(object sender, RoutedEventArgs e)
{
string nama = nama1TBx.Text;
NavigationService.Navigate(new Uri("/View/FifthPage.xaml?name=" + nama, UriKind.Relative));
}
}
}
Posting Komentar