Tutorial Koding: Windows Phone

Showing posts with label Windows Phone. Show all posts

Navigasi Halaman dengan Efek Transisi di Windows Phone

Assalamualakum agan semua,,<br />
karna sudah lumayan lama saya tidak memposting, oleh karena itu kali ini saya ingin kembali memposting tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-navigasi-halaman-dengan-efek.html">Navigasi Halaman dengan Efek Transisi di Windows Phone</a>,<br />
<br />
Mungkin sebelumnya saya juga pernah memposting tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-navigasi-halaman-di-windows.html">Membuat Navigasi Halaman di Windows Phone</a>, tapi pada postingan kali ini akan sedikit berbeda, karena pada postingan kali ini tidak hanya membuat navigasi halaman saja, tapi juga memberikan efek ketika berpindah halaman agar aplikasi kita terlihat lebih menarik :D. Oke langsung saja<br />
<br />
Langkah - langkah <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-navigasi-halaman-dengan-efek.html">Navigasi Halaman dengan Efek Transisi di Windows Phone</a><br />
<br />
1. Buat sebuah projek Windows Phone Apps - Blank App<br />
<br />
2.  Seperti pada tutorial sebelumnya kita perlu menambahkan Windows Phone Toolkit pada references project kita dengan cara Klik kanan pada References -> Manage NuGet Packages -> Cari Windows Phone Toolkit -> Klik Install<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" title="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" width="320" /></a></div>
<br />
3. Pada file mainpage.xaml tambahkan 1 button dengan script dibawah ini<br />
<br />
<pre class="brush:html">
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button Content="Ke Halaman 1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,130,0,0" Width="456" Click="Button_Click"/>

</Grid></pre>
<pre class="brush:html"></pre>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9JY08AoYhhQLCBaKJBx9F67wk3gmVB6pSn1NsNvZeI2Xat_rIQ6dH-Kw0dcO0e2X23vFR_OixuIy4ipM-JnMTUUpVZeXdIbDo8w6EtECvqXsO5Eb5vM4faa7rxQuEV0MlR-pgzVtLPwRC/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9JY08AoYhhQLCBaKJBx9F67wk3gmVB6pSn1NsNvZeI2Xat_rIQ6dH-Kw0dcO0e2X23vFR_OixuIy4ipM-JnMTUUpVZeXdIbDo8w6EtECvqXsO5Eb5vM4faa7rxQuEV0MlR-pgzVtLPwRC/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+1.png" width="200" /></a></div>
<pre class="brush:html"></pre>
<br />
4. Pada bagian Inisialisasi di mainpage.xaml.cs tambahkan script dibawah ini<br />
<br />
            // anda bisa mengganti SlideTransitionMode sesuai dengan keinginan<br />
            NavigationInTransition navigateInTransition = new NavigationInTransition();<br />
            navigateInTransition.Backward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeIn };<br />
            navigateInTransition.Forward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeIn };<br />
<br />
            NavigationOutTransition navigateOutTransition = new NavigationOutTransition();<br />
            navigateOutTransition.Backward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeOut };<br />
            navigateOutTransition.Forward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeOut };<br />
            TransitionService.SetNavigationInTransition(this, navigateInTransition);<br />
            TransitionService.SetNavigationOutTransition(this, navigateOutTransition);<br />
Sehingga menjadi<br />
<pre class="brush:html">public MainPage()
        {
            InitializeComponent();

// anda bisa mengganti SlideTransitionMode sesuai dengan keinginan
            NavigationInTransition navigateInTransition = new NavigationInTransition();
            navigateInTransition.Backward = new SlideTransition { Mode = SlideTransitionMode.SlideRightFadeIn };
            navigateInTransition.Forward = new SlideTransition { Mode = SlideTransitionMode.SlideLeftFadeIn };

</Grid></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3uvhGb5cVbCLWKR3LXv0LsSX4lgZbc_amH-YcqVWzzS4w45Ff7wjANGZfGRDF6ee97elwjaePM5KAm-LsMVxz5KckwMkiJ5aWc4TrpNRv042mfIpYfwftBUxIoUBaTE28TUcunzDEJ3oA/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3uvhGb5cVbCLWKR3LXv0LsSX4lgZbc_amH-YcqVWzzS4w45Ff7wjANGZfGRDF6ee97elwjaePM5KAm-LsMVxz5KckwMkiJ5aWc4TrpNRv042mfIpYfwftBUxIoUBaTE28TUcunzDEJ3oA/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+2.png" width="194" /></a></div>
<br />
8. Pada bagian Inisialisasi di Page1.xaml.cs tambahkan script dibawah ini<br />
<br />
<pre class="brush:html">// anda bisa mengganti SlideTransitionMode sesuai dengan keinginan
            NavigationInTransition navigateInTransition = new NavigationInTransition();
            navigateInTransition.Backward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeIn };
            navigateInTransition.Forward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeIn };

NavigationOutTransition navigateOutTransition = new NavigationOutTransition();
            navigateOutTransition.Backward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeOut }; 
            navigateOutTransition.Forward = new SlideTransition { Mode = SlideTransitionMode.SlideDownFadeOut };
            TransitionService.SetNavigationInTransition(this, navigateInTransition);
            TransitionService.SetNavigationOutTransition(this, navigateOutTransition);
</pre>
<div>
<br /></div>
9. Pada event button_Click tambahkan script dibawah ini untuk berpindah ke halaman MainPage.xaml<br />
<br />
<pre class="brush:html">NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));</pre>
<div style="text-align: center;">
<br />
<div style="text-align: left;">
10. Buka file App.xaml.cs ganti RootFrame = new PhoneApplicationFrame() menjadi RootFrame = new TransitionFrame();</div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigyGZELZNqGVkQicYm5-Of9Ay10tF3hkU0ZHMZE121bLDI8HpbcgxPjceGmn9YLgB69A9jvPKmaeOYo7vcTPeluLNIQk9NhvwLnQEsQx9Uv0h4kojwFazszkXB84Mzjg6SLgehZ8gOedYA/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="87" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigyGZELZNqGVkQicYm5-Of9Ay10tF3hkU0ZHMZE121bLDI8HpbcgxPjceGmn9YLgB69A9jvPKmaeOYo7vcTPeluLNIQk9NhvwLnQEsQx9Uv0h4kojwFazszkXB84Mzjg6SLgehZ8gOedYA/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+6.png" width="320" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
11. Jalankan program tersebut dengan menekan F5 maka akan seperti gambar dibawah ini</div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbI2DX2NckRGwBVXVbRLndcBl9_KiJ6GFz7ha7NmEMBAia5J9flwdb5kPgbaKUucrpbByMUiNZ4vBfVXaz_nkJyR7m1TTpinlqJ0a-GFYWbduJdTwOFrUzAyITfmOQKIx1RX9-SHxassSz/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbI2DX2NckRGwBVXVbRLndcBl9_KiJ6GFz7ha7NmEMBAia5J9flwdb5kPgbaKUucrpbByMUiNZ4vBfVXaz_nkJyR7m1TTpinlqJ0a-GFYWbduJdTwOFrUzAyITfmOQKIx1RX9-SHxassSz/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+3.png" width="172" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkCwjYpfVJIBDLJ-17QwPM14tmaz7tn5B3MpAaJ-rz3ZqH2OOVVJzfOU2nuIgW46C8hu9nhyphenhyphenCXtt_Zv7n7QpJI5Epaij1290QlnVKfXSLoVWlFbJjMEMzxmV7M2pZmDuVa-QEyUyupXQmb/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkCwjYpfVJIBDLJ-17QwPM14tmaz7tn5B3MpAaJ-rz3ZqH2OOVVJzfOU2nuIgW46C8hu9nhyphenhyphenCXtt_Zv7n7QpJI5Epaij1290QlnVKfXSLoVWlFbJjMEMzxmV7M2pZmDuVa-QEyUyupXQmb/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+4.png" width="174" /></a></div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMo71vBRKMK7dygTuSgz-WJTKzY9jxbJomYW7HLHD3eGudtpNya3-_QJ5jWVnuEgs5e_KRofmJjDKiiOJSxl_r4VElmwOIvavryrp7xmqkwoheYLIZS5NCr4XmDK_SOy2IL6J5O-aMQBF_/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMo71vBRKMK7dygTuSgz-WJTKzY9jxbJomYW7HLHD3eGudtpNya3-_QJ5jWVnuEgs5e_KRofmJjDKiiOJSxl_r4VElmwOIvavryrp7xmqkwoheYLIZS5NCr4XmDK_SOy2IL6J5O-aMQBF_/s1600/Navigasi+Halaman+dengan+Efek+Transisi+di+Windows+Phone+5.png" width="171" /></a></div>
<div style="text-align: left;">
<br /></div>
Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/wocm74d7m5rl">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>
<br />
Sekian pembahasan tetang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-navigasi-halaman-dengan-efek.html">Navigasi Halaman dengan Efek Transisi di Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini

Navigasi Halaman dengan Efek Transisi di Windows Phone

Assalamualakum agan semua,, karna sudah lumayan lama saya tidak memposting, oleh karena itu kali ini saya ingin kembali memposting tentang ...

Friday, January 16, 2015

Membuat Context Menu di Wndows Phone

Assalamualakum semuanya,,<br />
pada malam hari ini, untuk mengisi waktu luang saya ingin memposting tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-context-menu-di-wndows-phone.html">Membuat Context Menu di Wndows Phone</a>.<br />
Apa itu Context Menu ?<br />
Context Menu adalah menu-menu yang akan muncul ketika kita menekan sebuah tombol atau item pada sebuah list<br />
<br />
Langkah - langkah <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-context-menu-di-wndows-phone.html">Membuat Context Menu di Wndows Phone</a>.<br />
<br />
1. Buat sebuah Windows Phone Project Baru<br />
<br />
2.  Seperti pada tutorial sebelumnya kita perlu menambahkan Windows Phone Toolkit pada references project kita dengan cara Klik kanan pada References -> Manage NuGet Packages -> Cari Windows Phone Toolkit -> Klik Install<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" title="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" width="320" /></a></div><br />
3. Tambahkan script dibawah ini pada bagian atas file mainpage.xaml<br />
<br />
<pre class="brush:html">xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"</pre><br />
4. Tambahkan 1 buat button dan juga ContextMenuService dengan script dibawah ini<br />
<br />
<pre class="brush:html">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="Tutorial Koding" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="Context Menu" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button x:Name="btn" Content="Tampilkan Context Menu" Grid.Row="0" Click="btn_Click" Margin="59,254,42,268">
                <toolkit:ContextMenuService.ContextMenu>
                    <toolkit:ContextMenu x:Name="MyContextMenu">
                        <toolkit:MenuItem x:Name="menu_tambah" Header="Tambah" Click="menu_tambah_Click" />
                        <toolkit:MenuItem x:Name="menu_hapus" Header="Hapus" Click="menu_hapus_Click" />
                    </toolkit:ContextMenu>
                </toolkit:ContextMenuService.ContextMenu>
            </Button>
        </Grid>

</Grid></pre><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXdNtGlY9IevFv8TaGODuJ7SBcolIM97t6zBd6dahWwM1tvYxFudTngR-LU4tiqCmj_WkE3CAHHSzHx4FgFALfsvMf1NVQGpedGlw4kphtf8HMi9vqvMDaAWEO8_Gs0tfh_iwjhnh3aFSo/s1600/Membuat+Context+Menu+di+Wndows+Phone+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Context Menu di Wndows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXdNtGlY9IevFv8TaGODuJ7SBcolIM97t6zBd6dahWwM1tvYxFudTngR-LU4tiqCmj_WkE3CAHHSzHx4FgFALfsvMf1NVQGpedGlw4kphtf8HMi9vqvMDaAWEO8_Gs0tfh_iwjhnh3aFSo/s1600/Membuat+Context+Menu+di+Wndows+Phone+3.png" title="Membuat Context Menu di Wndows Phone" width="199" /></a></div><br />
<br />
5. Tambahkan script dibawah ini pada file mainpage.xaml.cs untuk menghandle event ketika tombol tampilkan di klik dan menu-menu lainnya di klik<br />
<br />
<pre class="brush:html">private void menu_tambah_Click(object sender, RoutedEventArgs e)
        {
// memunculkan pesan ketika context menu tambah ditekan
            MessageBox.Show("Menu Tambah di Tekan");
        }

private void menu_hapus_Click(object sender, RoutedEventArgs e)
        {
// memunculkan pesan ketika context menu hapus ditekan
            MessageBox.Show("Menu Hapus ditekan");
        }

private void btn_Click(object sender, RoutedEventArgs e)
        {
// menampilkan context menu
            MyContextMenu.IsOpen = true;
        }
</pre><div></div>6. Jalankan program tersebut dengan menekan F5 maka akan seperti gambar dibawah ini<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiru8zuDj1kCFR7wSEgy1430qGrfSVoFmPvfh6Qs0D9i-3jT3M08qT57oIEnuPzijun_neNaBmnGYOPcQwpvFt-a3qA4fcJEJhcBKd9wThOecWqJHXmzMe_haVTuXV3vAtKiAi3HRwjRjTX/s1600/Membuat+Context+Menu+di+Wndows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Context Menu di Wndows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiru8zuDj1kCFR7wSEgy1430qGrfSVoFmPvfh6Qs0D9i-3jT3M08qT57oIEnuPzijun_neNaBmnGYOPcQwpvFt-a3qA4fcJEJhcBKd9wThOecWqJHXmzMe_haVTuXV3vAtKiAi3HRwjRjTX/s1600/Membuat+Context+Menu+di+Wndows+Phone+2.png" title="Membuat Context Menu di Wndows Phone" width="175" /></a></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl3qp2WkbQWN5n_VKS0T5cELiDmdYblMJR9zJG6O3EIL42eXXZaoecx-Sn2trn7NuGvx1pC__srNj_ybMrb7AAsA2D1TBHoWIxKFy5afZLGX0hUxDCMYyFvpSElDjFVcOUO5xtE66vC1UY/s1600/Membuat+Context+Menu+di+Wndows+Phone.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Context Menu di Wndows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjl3qp2WkbQWN5n_VKS0T5cELiDmdYblMJR9zJG6O3EIL42eXXZaoecx-Sn2trn7NuGvx1pC__srNj_ybMrb7AAsA2D1TBHoWIxKFy5afZLGX0hUxDCMYyFvpSElDjFVcOUO5xtE66vC1UY/s1600/Membuat+Context+Menu+di+Wndows+Phone.png" title="Membuat Context Menu di Wndows Phone" width="171" /></a></div><div style="text-align: center;">Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/b9geaqoydoxu">disini</a></div><div style="text-align: center;">dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/membuat-context-menu-di-wndows-phone.html">Membuat Context Menu di Wndows Phone</a>.<br />
<br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini</pre></pre></pre>

Membuat Context Menu di Wndows Phone

Assalamualakum semuanya,, pada malam hari ini, untuk mengisi waktu luang saya ingin memposting tentang Membuat Context Menu di Wndows Phon...

Saturday, January 10, 2015

Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone

Assalamualaikum semua,, Setelah beberapa hari yang lalu saya memposting tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-di.html">Menampilkan Lokasi Device di Map di Windows Phone</a>, kali ini saya akan memposting hal yang tidak jauh beda,<br />
Hanya saja pada postingan yang kali ini Lokasi Device yang di tampilkan di map akan secara Real Time, jadi ketika lokasi device berpindah maka Lokasi yang di map juga akan berubah secara langsung sesuai dengan koordinat yang baru. Hal ini biasanya digunakan jika kita ingin membuat sebuah GPS atau yang lainnya.<br />
<br />
Langkah - langkah <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-secara.html">Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone</a><br />
<br />
1. Buat sebuah project Windows Phone App baru<br />
<br />
2. Seperti pada tutorial sebelumnya kita perlu menambahkan Windows Phone Toolkit pada references project kita dengan cara Klik kanan pada References -> Manage NuGet Packages -> Cari Windows Phone Toolkit -> Klik Install<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" title="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" width="320" /></a></div>
<br />
3. Buka <b>Capabilities </b>pada file <b>WMAppManifest.xml</b> centang <b>ID_CAP_MAP </b>dan <b>ID_CAP_LOCATION</b><br />
<b><br />
</b> <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp4q7B69My0aaSUDap0kWNFTK8GjrEjeXjgU-86ZvRDnvpQ8fgLlY6vGHMSVrzYgw_DIYcFGeRmghvIxJw9di2H9K1QQw0irazkk-2XzoNPq_K6vDoTf3S9SldTNfx1VyhwRY-dD5XCmLq/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" border="0" height="109" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp4q7B69My0aaSUDap0kWNFTK8GjrEjeXjgU-86ZvRDnvpQ8fgLlY6vGHMSVrzYgw_DIYcFGeRmghvIxJw9di2H9K1QQw0irazkk-2XzoNPq_K6vDoTf3S9SldTNfx1VyhwRY-dD5XCmLq/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+2.png" title="Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone" width="320" /></a></div>
<b><br />
</b> 4. Tambahkan 1 Map, 6 Textblock dan 1 Button atau anda bisa mengcopy script dibawah ini<br />
<br />
<pre class="brush:html">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="Lokasi Real Time" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="50"/>
        </StackPanel>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,1,12,-1">
            <Button x:Name="btn_start" Content="Mulai Melacak" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,564,0,0" Width="446" Click="btn_start_Click"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Latitude :" VerticalAlignment="Top" Margin="28,497,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Longitude :" VerticalAlignment="Top" Margin="28,532,0,0" FontSize="20"/>
            <TextBlock x:Name="txt_longitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,532,0,0"/>
            <TextBlock x:Name="txt_latitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,497,0,0"/>
            <TextBlock x:Name="lbl_status" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="158,465,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Status :" VerticalAlignment="Top" Margin="27,465,0,0"/>

<maps:Map x:Name="map" HorizontalAlignment="Left" VerticalAlignment="Top" Height="465" Width="446" ZoomLevel="14">
                <toolkit:MapExtensions.Children>
                    <toolkit:Pushpin x:Name="pushpinlokasi" Content="Posisi Saya"/>
                </toolkit:MapExtensions.Children>
            </maps:Map>
        </Grid>
    </Grid></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_TjFEByiXtxDXok1Cv2-D37jF1dPdLVIF7iJ683jUuCZYEnmMud8X_1i1nibO2xYZJqakikPtFZAOCTz8kmweeE61G1374ksZMq9Cmz5aLy9FYqq_2_oRt8XGx0mbeZEGonmab5XpKzvO/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_TjFEByiXtxDXok1Cv2-D37jF1dPdLVIF7iJ683jUuCZYEnmMud8X_1i1nibO2xYZJqakikPtFZAOCTz8kmweeE61G1374ksZMq9Cmz5aLy9FYqq_2_oRt8XGx0mbeZEGonmab5XpKzvO/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+1.png" width="202" /></a></div>
<br />
<br />
5. Tambahkan script dibawah ini pada file .xaml.cs<br />
<br />
<pre class="brush:html">// Namespace yang diperlukan
using System.Threading.Tasks;
using Windows.Devices.Geolocation;
using Microsoft.Phone.Maps.Toolkit;
using Microsoft.Phone.Maps.Controls;</pre>
<br />
6. Tambahkan script dibawah ini di atas constructor mainpage.xaml.cs<br />
<br />
<pre class="brush:html">// deklarasi variable
Geolocator geolocator = null;
bool lacak = false;</pre>
<br />
7. Pada event btn_start_Click Tambahkan script dibawah ini<br />
<br />
<pre class="brush:html">private void btn_start_Click(object sender, RoutedEventArgs e)
        {
            if (lacak == false)
            {
                geolocator = new Geolocator();
                // menentukan akurasi
                geolocator.DesiredAccuracy = PositionAccuracy.High;
                // jarak perpindahan dalam satuan meter
                geolocator.MovementThreshold = 20;
                
                geolocator.StatusChanged += geolocator_StatusChanged;
                geolocator.PositionChanged += geolocator_PositionChanged;

lacak = true;
                btn_start.Content = "Berhenti Melacak"; 
            }
            else
            {
                // menghapus event handler
                geolocator.PositionChanged -= geolocator_PositionChanged;
                geolocator.StatusChanged -= geolocator_StatusChanged;
                
                geolocator = null;

lacak = false;
                btn_start.Content = "Mulai Melacak";
            }
        }</pre>
<br />
8. Buat event untuk menghandle geolocator_PositionChanged dan geolocator_StatusChanged<br />
<br />
<pre class="brush:html">        void geolocator_PositionChanged(Geolocator sender, PositionChangedEventArgs args)
        {
            Dispatcher.BeginInvoke(() =>
            {
                // menampilkan koordinat yang baru
                txt_latitude.Text = args.Position.Coordinate.Latitude.ToString();
                txt_longitude.Text = args.Position.Coordinate.Longitude.ToString();

// memindahkan pushpin berdasarkan koordinat yang baru
                Pushpin pushpin = (Pushpin)this.FindName("pushpinlokasi");
                pushpin.GeoCoordinate = new System.Device.Location.GeoCoordinate(args.Position.Coordinate.Latitude,args.Position.Coordinate.Longitude);
                map.Center = new System.Device.Location.GeoCoordinate(args.Position.Coordinate.Latitude, args.Position.Coordinate.Longitude);
            });
        }

void geolocator_StatusChanged(Geolocator sender, StatusChangedEventArgs args)
        {
            string status = "";
   
            switch (args.Status)
            {
                case PositionStatus.Disabled:
                    status = "Lokasi dinonaktifkan pada pengaturan telepon";
                    break;
                case PositionStatus.Initializing:
                    status = "Menginisialisasi";
                    break;
                case PositionStatus.NoData:
                    status = "Gagal mendapatkan lokasi";
                    break;
                case PositionStatus.Ready:
                    status = "Lokasi telah di dapatkan";
                    break;
            }
            // menampilkan status pada label status
            Dispatcher.BeginInvoke(() =>
            {
                lbl_status.Text = status;
            });
        }</pre>
<br />
9. Jalankan program dengan menekan F5 maka akan seperti gambar dibawah ini<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOPz-13Hr6VYcY8UJ5LJlYdYzqeL_JdhzT-AmEYGaj1txDJQuKdAHuoQQ7wHcHfc86aosVZGDeSnHlMHT1v1X87cMpK48hQT07mo9_jM8HCoLUY9Wpa3ihgQPn3ZZUt-AAg4zr7rwltFf6/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+2.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOPz-13Hr6VYcY8UJ5LJlYdYzqeL_JdhzT-AmEYGaj1txDJQuKdAHuoQQ7wHcHfc86aosVZGDeSnHlMHT1v1X87cMpK48hQT07mo9_jM8HCoLUY9Wpa3ihgQPn3ZZUt-AAg4zr7rwltFf6/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+2.png" width="174" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Ketka pertama kali dijalankan</td></tr>
</tbody></table>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjL2Qy-6E40vyNvf7MXYLY0ucu9iVrdCO2SMPFkrlcMFmn5aTO8y08rXkB6l_fqxWyBtKLxPasPKOmh-EuNYyk7QwgMcUW8AF0EosyHEG8MpSrYrBPbOk55bJtYCePKuh-vApUQAO1QjBv/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+3.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjL2Qy-6E40vyNvf7MXYLY0ucu9iVrdCO2SMPFkrlcMFmn5aTO8y08rXkB6l_fqxWyBtKLxPasPKOmh-EuNYyk7QwgMcUW8AF0EosyHEG8MpSrYrBPbOk55bJtYCePKuh-vApUQAO1QjBv/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+3.png" width="177" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Menemukan lokasi device</td></tr>
</tbody></table>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFVkxsMZaZPBUX64TvJZbp3kNL1VqLKirQGDdOvn30kWC52Z9AtfGCae1g_AIw4Oa4aMIXJo6_RHkWJ1GHtPaT-hI8V4sW6fjUjGgLs7-bEKacYP1nVrmlsINdgdPyG2WfqA8Z3JPs1Ucx/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+4.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFVkxsMZaZPBUX64TvJZbp3kNL1VqLKirQGDdOvn30kWC52Z9AtfGCae1g_AIw4Oa4aMIXJo6_RHkWJ1GHtPaT-hI8V4sW6fjUjGgLs7-bEKacYP1nVrmlsINdgdPyG2WfqA8Z3JPs1Ucx/s1600/Menampilkan+Lokasi+Device+di+Map+Secara+Real+Time+di+Windows+Phone+4.png" width="174" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Ketika lokasi device berpindah maka pushpin akan ikut berpindah</td></tr>
</tbody></table>
<br />
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/3b35ghuscqjz">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>
<br />
Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-secara.html">Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini

Menampilkan Lokasi Device di Map Secara Real Time di Windows Phone

Assalamualaikum semua,, Setelah beberapa hari yang lalu saya memposting tentang Menampilkan Lokasi Device di Map di Windows Phone , kali ini...

Tuesday, January 06, 2015

Menampilkan Lokasi Device di Map di Windows Phone

Assalamualaikum semua, setelah kemarin saya memposting tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-map-berdasarkan-longitude.html">Menampilkan Map Berdasarkan Latitude dan Longitude</a>.<br />
Pada malam hari ini saya ingin membahas tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-di.html">Menampilkan Lokasi Device di Map di Windows Phone</a>, pertama-tama kita perlu mendapatkan koordinat dari device kita, lalu kita menambahkan sebuah pushpin ke map berdasarkan koordinat dari device kita.<br />
oke langsung saja<br />
<br />
Langkah  - Langkah <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-di.html">Menampilkan Lokasi Device di Map di Windows Phone</a><br />
<br />
1. Buat sebuah Windows Phone App project baru<br />
<br />
2. Tambahkan references Windows Phone Toolkit dengan cara klik kanan references > Manage Nuget Packages > cari Windows Phone Toolkit > Install<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Lokasi Device di Map di Windows Phone" border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilM8dSaCUGS1n96u6w5gWUMmxH19ydOSn28yv4G7rk4twllbAqoZC6VHmPMJpI1LEfP8fEq5EhbWzBrj10EgqV1aO9X1clPeRVjxfLuLts8aB87hNS3PmUsCvZXxYVqYNbBPnHeVbrAnaA/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" title="Menampilkan Lokasi Device di Map di Windows Phone" width="320" /></a></div>
<br />
<br />
3. Tambahkan 1 button, 1 map dan 4 textblock, atau anda dapat mengcopykan script dibawah ini ke dalam file .xaml anda<br />
<br />
<pre class="brush:html">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        
        
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="Tutorial Koding" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="Lokasi Device" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

<maps:Map x:Name="map" HorizontalAlignment="Left" VerticalAlignment="Top" Height="438" Width="446"/>
            
            <Button x:Name="btn_temukan" Content="Temukan Lokasi Device" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,525,0,0" Width="446" Click="btn_temukan_Click"/>
            <TextBlock x:Name="txt_latitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="133,448,0,0"/>
            <TextBlock x:Name="txt_longitude" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Top" Margin="133,488,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Longitude :" VerticalAlignment="Top" Margin="10,488,0,0"/>
            <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Latitude :" VerticalAlignment="Top" Margin="10,443,0,0"/>

</Grid>

</Grid></pre>
<pre class="brush:html"></pre>
 maka tampilannya kan seperti gambar dibawah ini<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1I_yuq2dsHb6-oUWlmUiQ7RhWv2j2bT1PoWuyV-zqW9N414V0QIn9v9vdnbVQ4DejXOaCIAMaAHUfDJjjVPkuHbQ4Nk3Ca5C7t_EfeBTSFRPkTKoT_yHDShPJDxnWBQmlcWmEhSDKrTLb/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1I_yuq2dsHb6-oUWlmUiQ7RhWv2j2bT1PoWuyV-zqW9N414V0QIn9v9vdnbVQ4DejXOaCIAMaAHUfDJjjVPkuHbQ4Nk3Ca5C7t_EfeBTSFRPkTKoT_yHDShPJDxnWBQmlcWmEhSDKrTLb/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+1.png" width="196" /></a></div>
<br />
4. Buka <b>Capabilities </b>pada file <b>WMAppManifest.xml</b> centang <b>ID_CAP_MAP </b>dan <b>ID_CAP_LOCATION</b><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWWKZqzCQQ9u4fN_U15gi4Y2jOfZowMcyiPm8LY3qSlY6i7R9KTXJkv_aiO5D6Im69YyAzYQvckz7Zvd9euDemUzOd2zvkSGxg-HNC5Fvtr6MgZoTVCG73rNkZIew4OC8Qyi2UCNJFmWGy/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="109" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWWKZqzCQQ9u4fN_U15gi4Y2jOfZowMcyiPm8LY3qSlY6i7R9KTXJkv_aiO5D6Im69YyAzYQvckz7Zvd9euDemUzOd2zvkSGxg-HNC5Fvtr6MgZoTVCG73rNkZIew4OC8Qyi2UCNJFmWGy/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+2.png" width="320" /></a></div>
<b> </b> <br />
5. Import 4 namespace dibawah ini pada file .xaml anda<br />
<pre class="brush:html">using System.Threading.Tasks;
using Windows.Devices.Geolocation;
using Microsoft.Phone.Maps.Toolkit;
using Microsoft.Phone.Maps.Controls;
using System.Windows.Media;</pre>
<br />
6. Tambahkan script dibawah ini pada event btn_temukan_Click<br />
<pre class="brush:html">
        private async void btn_temukan_Click(object sender, RoutedEventArgs e)
        {
            Geolocator geolocator = new Geolocator();
            geolocator.DesiredAccuracyInMeters = 50;

try
            {

Geoposition geoposition = await geolocator.GetGeopositionAsync(
                    maximumAge: TimeSpan.FromMinutes(5),
                    timeout: TimeSpan.FromSeconds(10)
                    );

// Windows Phone 8.1
                //Geoposition position = await geolocator.GetGeopositionAsync();
                //txt_latitude.Text = position.Coordinate.Point.Position.Latitude.ToString();
                //txt_longitude.Text = position.Coordinate.Point.Position.Longitude.ToString();

double latitude = geoposition.Coordinate.Latitude;
                double longitude = geoposition.Coordinate.Longitude;

txt_latitude.Text = latitude.ToString();
                txt_longitude.Text = longitude.ToString();

// menandai map
                Pushpin pushpin = new Pushpin();
                pushpin.Content = "Lokasi Saya";
                pushpin.Background = new SolidColorBrush(Colors.Blue);
                // Menambahkan pushpin ke MapOverlay
                MapOverlay overlay = new MapOverlay();
                overlay.Content = pushpin;
                overlay.GeoCoordinate = new System.Device.Location.GeoCoordinate(latitude, longitude);
                overlay.PositionOrigin = new Point(0, 0.5);

// menyesuaikan koorinate MapOverlay
                MapLayer layer = new MapLayer();
                layer.Add(overlay);
                // Menambahkan MapLayer ke map
                map.Layers.Add(layer);
                // Mengatur posisi tengah map
                map.Center = new System.Device.Location.GeoCoordinate(latitude, longitude);
                map.ZoomLevel = 14;
            }
            catch (Exception ex)
            {
                MessageBox.Show(ex.Message);
            }
        }</pre>
<br />
5. Jalankan program tersebut dengan menekan F5 lalu tekan tombol <b>Temukan Lokasi Device</b> maka akan seperti gambar dibawah ini<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUtPkg4G41bUlqYaru9N_gfvwwSXQm3uTu0VewfByOp-P5bj-zRQbwPQy7xJDbJgBGpxyTwyliOdV-CsAmg7obw-HG9pDvze3mj7DvYWylaK8333KdGDQlzRmqCLrxEIFR356eoY2VPjcU/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUtPkg4G41bUlqYaru9N_gfvwwSXQm3uTu0VewfByOp-P5bj-zRQbwPQy7xJDbJgBGpxyTwyliOdV-CsAmg7obw-HG9pDvze3mj7DvYWylaK8333KdGDQlzRmqCLrxEIFR356eoY2VPjcU/s1600/Menampilkan+Lokasi+Device+di+Map+di+Windows+Phone+7.png" width="176" /></a></div>
<br />
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/cwnke6ihfi87">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>
<br />
Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-lokasi-device-di-map-di.html">Menampilkan Lokasi Device di Map di Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini

Menampilkan Lokasi Device di Map di Windows Phone

Assalamualaikum semua, setelah kemarin saya memposting tentang Menampilkan Map Berdasarkan Latitude dan Longitude . Pada malam hari ini say...

Saturday, January 03, 2015

Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone

Assalamukum agan semua,,,<br />
untuk mengawali hari pertam di tahun 2015 ini :D, saya ingin memposting tentang Windows Phone lagi, kali ini tentang bagaimana cara Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone,<br />
biaasanya cara ini digunakan jika kita ingin membuat tempat pariwisata ataupun yang lainnya..<br />
<br />
Langkah - langkah <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-map-berdasarkan-longitude.html">Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone</a><br />
<br />
1. Buat sebuah Project Windows Phone App baru<br />
<br />
2. Tambahkan references Windows Phone Toolkit dengan cara klik kanan references > Manage Nuget Packages > Cari Windows Phone Toolkit > Install<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWkTA69_OL7kHqy0Y-ks7jPJ5enDUufEvYglFrak7TqeZBtP_mFOEUOV2T0Ykg_1GoxUdx8lIGrRcGac3YT0hGO_pSHc_3q3wGNSxlELIJPHN_L1GXYQV1fCUg0r4SM6KHqV_19PDLOw3F/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" border="0" height="70" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWkTA69_OL7kHqy0Y-ks7jPJ5enDUufEvYglFrak7TqeZBtP_mFOEUOV2T0Ykg_1GoxUdx8lIGrRcGac3YT0hGO_pSHc_3q3wGNSxlELIJPHN_L1GXYQV1fCUg0r4SM6KHqV_19PDLOw3F/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+2.png" title="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" width="320" /></a></div>
<br />
<br />
<br />
2. Tambahkan 1 map, 2 textbox dan textblock dan buat sebuah application bar<br />
<br />
<pre class="brush:html">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

<!-- LOCALIZATION NOTE:
            To localize the displayed strings copy their values to appropriately named
            keys in the app's neutral language resource file (AppResources.resx) then
            replace the hard-coded text value between the attributes' quotation marks
            with the binding clause whose path points to that string name.

For example:

Text="{Binding Path=LocalizedResources.ApplicationTitle, Source={StaticResource LocalizedStrings}}"

This binding points to the template's string resource named "ApplicationTitle".

Adding supported languages in the Project Properties tab will create a
            new resx file per language that can carry the translated values of your
            UI strings. The binding in these examples will cause the value of the
            attributes to be drawn from the .resx file that matches the
            CurrentUICulture of the app at run time.
         -->

<!--Uncomment to see an alignment grid to help ensure your controls are
            aligned on common boundaries.  The image has a top margin of -32px to
            account for the System Tray. Set this to 0 (or remove the margin altogether)
            if the System Tray is hidden.

Before shipping remove this XAML and the image itself.-->
        
        
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="Tutorial Koding" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="Map" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <maps:Map x:Name="mymap" HorizontalAlignment="Left" Grid.Row="0" VerticalAlignment="Top" Height="404" Width="456"/>
            <TextBlock HorizontalAlignment="Left" Margin="10,429,0,0" TextWrapping="Wrap" Text="Longitude" VerticalAlignment="Top"/>
            <TextBox x:Name="txt_longitude" HorizontalAlignment="Left" Height="72" TextWrapping="Wrap" VerticalAlignment="Top" Width="340" Margin="116,404,0,0"/>
            <TextBlock HorizontalAlignment="Left" Margin="10,486,0,0" TextWrapping="Wrap" Text="Latitude" VerticalAlignment="Top"/>
            <TextBox  x:Name="txt_latitude" HorizontalAlignment="Left" Height="72" TextWrapping="Wrap" VerticalAlignment="Top" Width="340" Margin="116,461,0,0"/>
        </Grid>
    </Grid>

<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar Mode="Default" Opacity="1" IsMenuEnabled="True" IsVisible="True">
            <shell:ApplicationBarIconButton x:Name="cari" Text="Cari" IconUri="/Assets/AppBar/feature.search.png" Click="cari_Click"/>
            <shell:ApplicationBarIconButton x:Name="zoommore" Text="Zoom In" IconUri="/Assets/AppBar1/add.png" Click="zoommore_Click"/>
            <shell:ApplicationBarIconButton x:Name="zoomless" Text="Zoom Out" IconUri="/Assets/AppBar2/minus.png" Click="zoomless_Click"/>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd0D_H_hOa7QbSgyhB3kdokH07fvo5tsrmByVTm-e5XAVFZdHKXZy1D7j7vB78ilE5mLWum8RhXh1c_HsOFR8RtNi8f1F0h3efnY0z4LUu8ZgOxoTKNOsnXmw2Hjm1oBnUuVPvZmV7tiJp/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd0D_H_hOa7QbSgyhB3kdokH07fvo5tsrmByVTm-e5XAVFZdHKXZy1D7j7vB78ilE5mLWum8RhXh1c_HsOFR8RtNi8f1F0h3efnY0z4LUu8ZgOxoTKNOsnXmw2Hjm1oBnUuVPvZmV7tiJp/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+1.png" title="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" width="190" /></a></div>
<br />
<br />
3. Buka <b>Capabilities</b> pada file <b>WMAppManifest.xml</b> centang ID_CAP_MAP<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNsNMATARqbciDdxpMC_skVK_myVmu8dzDA9uNSc6xskjRLGETJ4geFQbdBf-q9glEVhLfMqxdjsLhJW_S0kejjE_Qm9gnIx-9I-It4MIXeaFcgwJ3PcK3iJJ_QDDJhGzI39ML2Ir2iqzT/s1600/Screenshot_2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" border="0" height="69" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNsNMATARqbciDdxpMC_skVK_myVmu8dzDA9uNSc6xskjRLGETJ4geFQbdBf-q9glEVhLfMqxdjsLhJW_S0kejjE_Qm9gnIx-9I-It4MIXeaFcgwJ3PcK3iJJ_QDDJhGzI39ML2Ir2iqzT/s1600/Screenshot_2.png" title="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" width="320" /></a></div>
<br />
4. Import 4 namespace dibawah ini pada file .xaml anda<br />
<br />
<pre class="brush:html">using System.Threading.Tasks;
using Windows.Devices.Geolocation;
using Microsoft.Phone.Maps.Toolkit;
using Microsoft.Phone.Maps.Controls;
using System.Windows.Media;</pre>
<br />
5. Pada event cari_Click tambahkan script dibawah ini<br />
<br />
<pre class="brush:html">private void cari_Click(object sender, EventArgs e)
        {
            // Membuat Pushpin
            Pushpin mypushpin = new Pushpin();
            mypushpin.Content = "Lokasi";

// Menambahkan pushpin ke MapOverlay
            MapOverlay myoverlay = new MapOverlay();
            myoverlay.Content = mypushpin;
            // menyesuaikan koorinate MapOverlay
            myoverlay.GeoCoordinate = new System.Device.Location.GeoCoordinate(Convert.ToDouble(txt_latitude.Text), Convert.ToDouble(txt_longitude.Text));
            myoverlay.PositionOrigin = new Point(0, 0.5);
            
            // tambahkan MapOverlay ke MapLayer
            MapLayer mylayer = new MapLayer();
            mylayer.Add(myoverlay);

// Menambahkan MapLayer ke map
            mymap.Layers.Add(mylayer);
            // Mengatur posisi tengah map
            mymap.Center = new System.Device.Location.GeoCoordinate(Convert.ToDouble(txt_latitude.Text), Convert.ToDouble(txt_longitude.Text));
            mymap.ZoomLevel = 14;
        }
</pre>
<br />
6. Pada event zoommore_Click dan zoomless_Click tambahkan script dibawah ini<br />
<br />
<pre class="brush:html">        private void zoommore_Click(object sender, EventArgs e)
        {
            // memperbesar map
            mymap.ZoomLevel = Math.Min(mymap.ZoomLevel + 1, 20);
        }

private void zoomless_Click(object sender, EventArgs e)
        {
            // memperkecil map
            mymap.ZoomLevel = Math.Max(mymap.ZoomLevel - 1, 1);
        }
</pre>
<br />
7. Jalankan Aplikasi tersebut dengan menekan F5 maka akan seperti gambar dibawah ini<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxzMhecDuzx7tNEZhkefl9ys4cUwByCHx0kfsS8qOtPWam0RQIDBUaGqW1a5XF8izAUwlEvt2gzqSqLClOerx90aytHxJHr8U3mjo5M4SowzacvNcUY0aMOIFFF3BJCldOraQBF8aC91YE/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxzMhecDuzx7tNEZhkefl9ys4cUwByCHx0kfsS8qOtPWam0RQIDBUaGqW1a5XF8izAUwlEvt2gzqSqLClOerx90aytHxJHr8U3mjo5M4SowzacvNcUY0aMOIFFF3BJCldOraQBF8aC91YE/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+4.png" title="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" width="171" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0SjLJLwOBmP6V46R1nMPinPUkAhvV3Ah06jhnOvgbp3SEuF-feea_Somlp3pY6hRHeS36gZu23pfsJ9X2YBNysy8yiM34xkL1P28XItuBatMFLNfcN2UJO-11_xLOKpnkem7WFpYEr7-J/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0SjLJLwOBmP6V46R1nMPinPUkAhvV3Ah06jhnOvgbp3SEuF-feea_Somlp3pY6hRHeS36gZu23pfsJ9X2YBNysy8yiM34xkL1P28XItuBatMFLNfcN2UJO-11_xLOKpnkem7WFpYEr7-J/s1600/Menampilkan+Map+Berdasarkan+Longitude+dan+Latitude+Windows+Phone+3.png" title="Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone" width="175" /></a></div>
<br />
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/5tzfdo3nye9b">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>
<br />
Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2015/01/menampilkan-map-berdasarkan-longitude.html">Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini. . .

Menampilkan Map Berdasarkan Longitude dan Latitude Windows Phone

Assalamukum agan semua,,, untuk mengawali hari pertam di tahun 2015 ini :D, saya ingin memposting tentang Windows Phone lagi, kali ini tent...

Thursday, January 01, 2015

Membuat System Tray/Status Bar di Windows Phone

Assalamualaikum...<br />
Karena sudah salam saya tidak memposting tutorial, pada malam ini saya ingin memposting sebuah tutorial sederhana tentang Membuat System Tray di Windows Phone.<br />
<div>
Apa itu System Tray ?</div>
<div>
System Tray adalah sebuah area di bagian atas device anda di mana pada area ini berisi tentang informasi konektivitas device anda, misalkan jika lokasi device dihidupkan, jika device anda mengaktifkan getaran dan banyak lagi.</div>
<div>
<br /></div>
<div>
Langkah - langkah untuk Membuat System Tray/Status Bar di Windows Phone </div>
<div>
<br /></div>
<div>
1. Buka Visual Studio yang ada punya (disini saya menggunakan visual studio 2013)</div>
<div>
<br /></div>
<div>
2. Buat sebuah project Windows Phone Apps, pilih Blank App</div>
<div>
<br /></div>
<div>
3. Tambah 2 buah button dan atur posisi dan yang lainnya seperti gambar dibawah ini</div>
<div>
</div>
<div>
<pre class="brush:html"><Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <Button x:Name="btn_tampil" Content="Tampilkan" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="72,190,0,0" Width="290" Click="btn_tampil_Click"/>
    <Button x:Name="btn_sembunyi" Content="Sembunyikan" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="72,89,0,0" Width="290" Click="btn_sembunyi_Click"/>
</Grid>
</pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF-GJ_vocDNyF-UOMFIKs58H2UV-_dVWPa9VKiOqK2r2IJdv45ror6_3Eqf956z65hks3i7zdbOTZK4mBWKzSnPAlzf2CFr4jsSbjEh21qsod5yZ_pAPObUPgu_BmgDpy-iMLzok4Cizre/s1600/Screenshot_1.png" imageanchor="1"><img alt="Membuat System Tray/Status Bar di Windows Phone " border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF-GJ_vocDNyF-UOMFIKs58H2UV-_dVWPa9VKiOqK2r2IJdv45ror6_3Eqf956z65hks3i7zdbOTZK4mBWKzSnPAlzf2CFr4jsSbjEh21qsod5yZ_pAPObUPgu_BmgDpy-iMLzok4Cizre/s1600/Screenshot_1.png" title="Membuat System Tray/Status Bar di Windows Phone " width="209" /></a></div>
<br />
4. Tambahkan script dibawah ini pada bagian Constructor<br />
<pre class="brush:html">public MainPage()
{
    InitializeComponent();

SystemTray.SetIsVisible(this, true);
    SystemTray.SetOpacity(this, 0.7);
    SystemTray.SetBackgroundColor(this, Colors.Blue);
    SystemTray.SetForegroundColor(this, Colors.White);
    ProgressIndicator progress = new ProgressIndicator();
    progress.IsVisible = true;
    progress.IsIndeterminate = true;
    progress.Text = "Loading ...";
    SystemTray.SetProgressIndicator(this, progress);
}
</pre>
<br />
5. Tambahkan script dibawah ini pada event btn_tampil_Click<br />
<pre class="brush:html">private void btn_tampil_Click(object sender, RoutedEventArgs e)
{
    SystemTray.IsVisible = true;   
}</pre>
<br />
6. Tambahkan script dibawah ini pada event btn_sembunyikan_Click<br />
<pre class="brush:html">private void btn_sembunyi_Click(object sender, RoutedEventArgs e)
{
    SystemTray.IsVisible = false;
}
</pre>
<br />
7. Jalankan project tersebut dengan menekan F5 maka akan seperti gambar dibawah ini<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYRtU8F6DB5rmwxU5l3ja-8GsCqAd7gLSYkVBUG4yhZjRq0n89e5o_z0XSI1zqbORE-0Gt5_k4Qf6qzVZhinZXOk0Gv38k3SLoBzdOHKs7UL3S9H06xSXyjtkam4Z3lUa4FSuSbVzkbt3u/s1600/Screenshot_3.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Membuat System Tray/Status Bar di Windows Phone " border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYRtU8F6DB5rmwxU5l3ja-8GsCqAd7gLSYkVBUG4yhZjRq0n89e5o_z0XSI1zqbORE-0Gt5_k4Qf6qzVZhinZXOk0Gv38k3SLoBzdOHKs7UL3S9H06xSXyjtkam4Z3lUa4FSuSbVzkbt3u/s1600/Screenshot_3.png" title="Membuat System Tray/Status Bar di Windows Phone " width="173" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Ketika System Tray di Sembunyikan</td></tr>
</tbody></table>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnkV7gYZHtGetvBhkNFRUUdEddiG-6l22agQMq0NnL_ECizr50CQ-EXHl45rJbf1BxHJdePbXsEsrmUCBx-CuKRVrMbBuvS2V5zG-VsswpekKHUJDUqmu3lp3qun7PooaUPIQmRZhB8Wpd/s1600/Screenshot_4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat System Tray/Status Bar di Windows Phone " border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnkV7gYZHtGetvBhkNFRUUdEddiG-6l22agQMq0NnL_ECizr50CQ-EXHl45rJbf1BxHJdePbXsEsrmUCBx-CuKRVrMbBuvS2V5zG-VsswpekKHUJDUqmu3lp3qun7PooaUPIQmRZhB8Wpd/s1600/Screenshot_4.png" title="Membuat System Tray/Status Bar di Windows Phone " width="170" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://www.tusfiles.net/3n44b7c10dbn">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://tny.cz/cca303d4">disini</a></div>
<br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini</div>

Membuat System Tray/Status Bar di Windows Phone

Assalamualaikum... Karena sudah salam saya tidak memposting tutorial, pada malam ini saya ingin memposting sebuah tutorial sederhana tentan...

Monday, December 22, 2014

Membuat Secondary Tile di Windows Phone

Setelah beberapa hari yang lalu saya membahas tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-application-bar-di-windows-phone.html">Membuat Application Bar di Windows Phone</a>, kali ini saya akan membahas tentang  <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-secondary-tile-di-windows-phone.html">Membuat Secondary Tile di Windows Phone</a><br />
<br />
Apa itu Tile ?<br />
Tile adalah sebuah link ke aplikasi yang ada di dalam Start. Ada 2 jenis Tile yaitu Application Tiles dan Secondary Tiles<br />
Application Tile adalah tile yang dibuat ketika pengguna pin aplikasi ke Start dengan cara menekan dan menahan icon aplikasi dalam daftar aplikasi<br />
dan Secondary Tiles adalah Tiles yang dibuat di aplikasi berdasarkan interaksi dari pengguna.<br />
<br />
Langkah - langkah  Menambah dan Menghapus Secondary Tile di Windows Phone<br />
<br />
1. Buat sebuah project windows phone di visual studio, lalu tambahkan gambar ke dalam project, gambar tersebut yang akan di gunakan sebagai Tiles<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhEG1ruRzqc26OIWwpIFgzaDRAIoh_u3sdUcirW2s9Mm5DBBph17IzVX36FBimnfaLItK7qJVJeLAJlEzBWYfmZFfMFX_zBG9my3fdK0UtPVU3Xmhyphenhyphen0gRxc_MlN7bapFLCC8xFC875gnJu/s1600/Screenshot_1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Secondary Tile di Windows Phone" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhEG1ruRzqc26OIWwpIFgzaDRAIoh_u3sdUcirW2s9Mm5DBBph17IzVX36FBimnfaLItK7qJVJeLAJlEzBWYfmZFfMFX_zBG9my3fdK0UtPVU3Xmhyphenhyphen0gRxc_MlN7bapFLCC8xFC875gnJu/s1600/Screenshot_1.png" title="Membuat Secondary Tile di Windows Phone" /></a></div>
<br />
<br />
2. Pada mainpage.xaml tambahkan script dibawah ini untuk membuat 2 buah button<br />
<br />
<pre class="brush:html"><Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button x:Name="btn_tambah" Click="btn_tambah_Click" Content="Tambah Tiles" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="91,148,0,0" Width="257"/>
            <Button x:Name="btn_hapus" Click="btn_hapus_Click" Content="Hapus Tiles" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="91,264,0,0" Width="257"/>

</Grid></pre>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgShB4WnqIiH3EaxGKSQJdu4UW9fvPqtCIPKAZKmGzLzL7nOM5vGL2nXp_Oahnq0O1Wj93DNy7e3w0rXT9ise-3soDzSqnd5OHXH4OP_iBAYNRb7mbekbi42Jwsa2VbFsJiky6v3M-dMyuP/s1600/Membuat+Secondary+Tile+di+Windows+Phone+2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgShB4WnqIiH3EaxGKSQJdu4UW9fvPqtCIPKAZKmGzLzL7nOM5vGL2nXp_Oahnq0O1Wj93DNy7e3w0rXT9ise-3soDzSqnd5OHXH4OP_iBAYNRb7mbekbi42Jwsa2VbFsJiky6v3M-dMyuP/s1600/Membuat+Secondary+Tile+di+Windows+Phone+2.png" width="175" /></a></div>
<br />
<br />
3. Buat sebuah fungsi untuk menetukan Tiles Aplikasi apakah sudah ada pada Start Screen atau belum<br />
<pre class="brush:html">private ShellTile FindTile(string TileUriSource)
        {
            ShellTile shelltile = ShellTile.ActiveTiles.FirstOrDefault(tile => tile.NavigationUri.ToString().Contains(TileUriSource));
            return shelltile;
        }</pre>
<br />
4. Pada event btn_tambah click tambahkan script dibawah ini<br />
<pre class="brush:html">private void btn_tambah_Click(object sender, RoutedEventArgs e)
        {
            // menemukan tile apakah sudah ada di start screen atau belum
            ShellTile tile = this.FindTile("Source=SecondaryTile");
            if (tile == null) // jika belum ada di start screen
            {
                // membuat tiledata
                StandardTileData tiledata = new StandardTileData
                {
                    Title="Tutorial Koding", // judul tile
                    BackgroundImage = new Uri("/Tile.png",UriKind.Relative), // bakcgrond tile
                    Count=3, 
                    BackTitle="Back Title", // judul ketika tile dibalik
                    BackBackgroundImage = new Uri("",UriKind.Relative), // background ketika tile dibalik
                    BackContent="Contoh Tile" // content tile ketika dibalik
                };

string tileuri = "/MainPage.xaml?Source=SecondaryTile";
                // membuat tile
                ShellTile.Create(new Uri(tileuri, UriKind.Relative), tiledata);
            }
            else
            {
                MessageBox.Show("Secondary Tile sudah ada");
            }
        }</pre>
<br />
5. Pada event btn_hapus click tambahkan script dibawah ini<br />
<pre class="brush:html">        private void btn_hapus_Click(object sender, RoutedEventArgs e)
        {
            ShellTile tile = this.FindTile("Source=SecondaryTile");
            if (tile != null) // jika tile ditemukan
            {
                // menghapus tile
                tile.Delete();
                MessageBox.Show("Secondary tile dihapus");
            }
            else
            {
                MessageBox.Show("Tidak ada secondary tile ditemukan");
            }
        }</pre>
<br />
6. Jalankan aplikasi dengan menekan tombol F5 jangan lupa memilih target device ke Emulator atau ke device<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-ugdHgCnaxOLo1w7csv9vY_LGbk7FRwmyEsP4l4VubpGxQqu7rKV7AkN17AKX7pMnaI2SV1eOgilKFfn6QuIRv2r8-iHhiqbBfpaJ8G4CSuBGkzOR5LC5YxiFsy6eFpULAskslyIHrRi2/s1600/Membuat+Secondary+Tile+di+Windows+Phone+3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Secondary Tile di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-ugdHgCnaxOLo1w7csv9vY_LGbk7FRwmyEsP4l4VubpGxQqu7rKV7AkN17AKX7pMnaI2SV1eOgilKFfn6QuIRv2r8-iHhiqbBfpaJ8G4CSuBGkzOR5LC5YxiFsy6eFpULAskslyIHrRi2/s1600/Membuat+Secondary+Tile+di+Windows+Phone+3.png" title="Membuat Secondary Tile di Windows Phone" width="175" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBXDEtT4Tp_lrlbJhvSJdnLfe8cTKdMUaYVsDmubVqKAfaoCn26CnR4GjmX5gC5igRSq7Prcgnhy8SfmqiCkvGxDZukQSeeShP3CujrhzFAm3ouFHACCbD7Mz_mXJCq_VvWdSSK24K8nLZ/s1600/Membuat+Secondary+Tile+di+Windows+Phone+4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Secondary Tile di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBXDEtT4Tp_lrlbJhvSJdnLfe8cTKdMUaYVsDmubVqKAfaoCn26CnR4GjmX5gC5igRSq7Prcgnhy8SfmqiCkvGxDZukQSeeShP3CujrhzFAm3ouFHACCbD7Mz_mXJCq_VvWdSSK24K8nLZ/s1600/Membuat+Secondary+Tile+di+Windows+Phone+4.png" title="Membuat Secondary Tile di Windows Phone" width="172" /></a></div>
<br />
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://adf.ly/uE5hy">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://adf.ly/fHCDH">disini</a></div>
<br />
Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-secondary-tile-di-windows-phone.html">Membuat Secondary Tile di Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini

Membuat Secondary Tile di Windows Phone

Setelah beberapa hari yang lalu saya membahas tentang Membuat Application Bar di Windows Phone , kali ini saya akan membahas tentang Membu...

Sunday, November 16, 2014

Membuat Application Bar di Windows Phone

Setelah beberapa hari yang lalu saya membahas tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-navigasi-halaman-di-windows.html">Membuat Navigasi Halaman di Windows Phone</a>, kali ini saya akan membahas tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-application-bar-di-windows-phone.html">Membuat Application Bar di Windows Phone</a><br />
<div>
<br /></div>
<div>
Apa itu Application Bar ?</div>
<div>
Application bar merupakan sistem kontrol yang dapat kita gunakan untuk membangun sebuah toolbar pada aplikasi windows phone.</div>
<div>
Ada 2 jenis application bar yaitu icon button dan text menu</div>
<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigo8trTu2EFU8BMZVWur6_NA1w8-xMyhrnYKPlcjVOJoeh-zEzdX2c5ymbpv-FRJ_8deA7Vk5femEz5PgTxPOhq9F6SG3IfZGvpxY9V1VoU2RF3nRlIyZShpLiu6vOMjYgbl_KUUwxD08a/s1600/Screenshot_1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Application Bar di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigo8trTu2EFU8BMZVWur6_NA1w8-xMyhrnYKPlcjVOJoeh-zEzdX2c5ymbpv-FRJ_8deA7Vk5femEz5PgTxPOhq9F6SG3IfZGvpxY9V1VoU2RF3nRlIyZShpLiu6vOMjYgbl_KUUwxD08a/s1600/Screenshot_1.png" title="Membuat Application Bar di Windows Phone" width="180" /></a></div>
<div>
<br /></div>
<div>
Ada beberapa hal yang perlu kita perhatikan dalam membuat application bar yaitu :</div>
<div>
<ol>
<li>Image yang digunakan sebagai icon berwarna putih untuk foreground dan transparent menggunakan Alpha Channel.</li>
<li>Tidak perlu menambahkan lingkaran, karena lingkaran telah otomatis.</li>
<li>Ukuran icon utama adalah 26x26 dan diletakan di tengah image.</li>
<li>Jangan menggunakan icon button yang telah disediakan pada hardware button.</li>
<li>Gunakan icon button utnuk task yang utama pada aplikasi</li>
<li>Hindari lebih dari 5 icon button</li>
<li>Jika suatu task dapat direpresentasikan dengan jelas melalui icon, gunakan icon button jika tidak, gunakan text menu.</li>
<li>Ketentuan mengenai opacity : 0 (tidak akan ditampilkan dan content page akan memenuhi layar), 0.5 s.d 1 (akan tampak di layar).</li>
</ol>
</div>
<div>
<br /></div>
<div>
Langkah - langkah Membuat Application Bar di Windows Phone</div>
<div>
<br /></div>
<div>
1. Buka visual studio yang anda punya buat sebuah project windows phone application baru</div>
<div>
<br /></div>
<div>
2. Pada file MainPage.xaml tambahkan script dibawah ini tepat di atas </phone:PhoneApplicationPage></div>
<div>
<pre class="brush:html"><phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar Mode="Default" Opacity="1.0" IsMenuEnabled="True" IsVisible="True">
        
        <shell:ApplicationBarIconButton x:Name="btn_simpan" IconUri="/Assets/AppBar/save.png" Text="simpan" Click="btn_simpan_Click"/>
        <shell:ApplicationBarIconButton x:Name="btn_bagikan" IconUri="/Assets/AppBar/share.png" Text="bagikan" Click="btn_bagikan_Click"/>
            
        
        <shell:ApplicationBar.MenuItems>
            <shell:ApplicationBarMenuItem x:Name="btn_pengaturan" Text="Pengaturan" Click="btn_pengaturan_Click"/>
            <shell:ApplicationBarMenuItem x:Name="btn_tentang" Text="Tentang" Click="btn_tentang_Click"/>
         </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar></pre>
</div>
<br />
3. Anda juga bisa membuat application bar melalui behind code dengan cara tambahkan script dibawha ini pada file MainPage.xaml.cs<br />
<pre class="brush:html">            ApplicationBar appbar = new ApplicationBar();
            appbar.IsMenuEnabled = true;
            appbar.Opacity = 1.0;
            appbar.Mode = ApplicationBarMode.Default;
            appbar.IsVisible = true;
            
            // icon button
            ApplicationBarIconButton btn_simpan = new ApplicationBarIconButton();
            btn_simpan.Text = "simpan";
            btn_simpan.IconUri = new Uri("/Assets/AppBar/save.png", UriKind.Relative);
            appbar.Buttons.Add(btn_simpan);
            btn_simpan.Click += new EventHandler(btn_simpan_Click);

ApplicationBarIconButton btn_bagikan = new ApplicationBarIconButton();
            btn_bagikan.Text = "bagikan";
            btn_bagikan.IconUri = new Uri("/Assets/AppBar/share.png", UriKind.Relative);
            appbar.Buttons.Add(btn_bagikan);
            btn_bagikan.Click += new EventHandler(btn_bagikan_Click);

// text menu
            ApplicationBarMenuItem btn_pengaturan = new ApplicationBarMenuItem();
            btn_pengaturan.Text = "Pengaturan";
            appbar.MenuItems.Add(btn_pengaturan);
            btn_pengaturan.Click += new EventHandler(btn_pengaturan_Click);

ApplicationBarMenuItem btn_tentang = new ApplicationBarMenuItem();
            btn_tentang.Text = "Tentang";
            appbar.MenuItems.Add(btn_tentang);
            btn_tentang.Click += new EventHandler(btn_tentang_Click);

this.ApplicationBar = appbar;</pre>
<br />
4. Pada file MainPage.xaml.cs tambahkan script dibawah ini untuk menghandle event pada icon button dan text menu pada application bar<br />
<br />
<pre class="brush:html">private void btn_bagikan_Click(object sender, EventArgs e)
{
    MessageBox.Show("Icon Button Bagikan ditekan");
}

private void btn_simpan_Click(object sender, EventArgs e)
{
     MessageBox.Show("Icon Button Simpan ditekan");
}

private void btn_pengaturan_Click(object sender, EventArgs e)
{
     MessageBox.Show("Text menu pengaturan ditekan");
}

private void btn_tentang_Click(object sender, EventArgs e)
{
     MessageBox.Show("Text menu tentang ditekan");
}</pre>
<div>
<br />
5. Jalankan F5 maka akan seperti gambar dibawah ini<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigo8trTu2EFU8BMZVWur6_NA1w8-xMyhrnYKPlcjVOJoeh-zEzdX2c5ymbpv-FRJ_8deA7Vk5femEz5PgTxPOhq9F6SG3IfZGvpxY9V1VoU2RF3nRlIyZShpLiu6vOMjYgbl_KUUwxD08a/s1600/Screenshot_1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Application Bar di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigo8trTu2EFU8BMZVWur6_NA1w8-xMyhrnYKPlcjVOJoeh-zEzdX2c5ymbpv-FRJ_8deA7Vk5femEz5PgTxPOhq9F6SG3IfZGvpxY9V1VoU2RF3nRlIyZShpLiu6vOMjYgbl_KUUwxD08a/s1600/Screenshot_1.png" title="Membuat Application Bar di Windows Phone" width="180" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7onp2B8fRNCLb1Mr_lLsH1CbJ9ZYWkWIbCbMs8MjymlAMrHbZ7yMXE3syxSceWE52N24oHs9gkHzwc4fAviSjmW_P7c7J4eLfassSlFnpREk14FOGhSvjn5wea8dfky_P5lN8moI7wq5f/s1600/Screenshot_2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Application Bar di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7onp2B8fRNCLb1Mr_lLsH1CbJ9ZYWkWIbCbMs8MjymlAMrHbZ7yMXE3syxSceWE52N24oHs9gkHzwc4fAviSjmW_P7c7J4eLfassSlFnpREk14FOGhSvjn5wea8dfky_P5lN8moI7wq5f/s1600/Screenshot_2.png" title="Membuat Application Bar di Windows Phone" width="175" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLJ0jmgQn0d1leee_7QHsTO96nhOEEUOD9Glpyt9xII4jCd0uRPKKZY73IMMbrvPM-3Si8uzipKGvnhWcQ8cu0PbU4FFv6MY3Ov8ll4z6oDus1ZK0LZ_cQbSQFnfclUtG-eSGr680gA-xV/s1600/Screenshot_3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Application Bar di Windows Phone" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLJ0jmgQn0d1leee_7QHsTO96nhOEEUOD9Glpyt9xII4jCd0uRPKKZY73IMMbrvPM-3Si8uzipKGvnhWcQ8cu0PbU4FFv6MY3Ov8ll4z6oDus1ZK0LZ_cQbSQFnfclUtG-eSGr680gA-xV/s1600/Screenshot_3.png" title="Membuat Application Bar di Windows Phone" width="181" /></a></div>
<br />
<div style="text-align: center;">
Anda bisa mendownload source codenya <a href="http://adf.ly/tuLdb">disini</a></div>
<div style="text-align: center;">
dan untuk passwordnya <a href="http://adf.ly/fHCDH">disini</a></div>
<br />
<br />
Sekian pembahasan tentang <a href="http://dwirandyherdinanto.blogspot.com/2014/11/membuat-application-bar-di-windows-phone.html">Membuat Application Bar di Windows Phone</a><br />
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>
<div>
</div>

Membuat Application Bar di Windows Phone

Setelah beberapa hari yang lalu saya membahas tentang Membuat Navigasi Halaman di Windows Phone , kali ini saya akan membahas tentang Membu...

Sunday, November 09, 2014

Membuat Navigasi Halaman di Windows Phone

Malam semua, pada kesempatan kali ini saya ingin memposting tentang Windows Phone, karena saya sedang belajar tentang windows phone, sekalian juga saya ingin share tutorial tentang windows phone ini :D<br />
<br />
<div>
Pertama - tama yang perlu dipersiapkan adalah Visual Studio 2012/2013</div>
<div>
<br /></div>
<div>
Langkah - langkah Membuat Navigasi Halaman di Windows Phone 8</div>
<div>
<br /></div>
<div>
1. Buka Visual Studio yang sudah anda punya (disini saya menggunakan Visual Studio 2013), Pilih File - New - Project - Visual C# pilih Windows Phone</div>
<div>
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTbnrlbrKIw1l-RWTm0M2733lAj8Cqa06B54KdoKCngWtTPufO7RkFZCpMm6FMnpiVoMIb7moCcuYHEE4XAc0N6L1mZVjBg_gYdYWe72v49pSG26yftpi8P3d7fbSs3CMjd37C4SsIr4b-/s1600/Navigasi_Halaman_Windows_Phone_1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Navigasi Halaman di Windows Phone 8" border="0" height="175" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTbnrlbrKIw1l-RWTm0M2733lAj8Cqa06B54KdoKCngWtTPufO7RkFZCpMm6FMnpiVoMIb7moCcuYHEE4XAc0N6L1mZVjBg_gYdYWe72v49pSG26yftpi8P3d7fbSs3CMjd37C4SsIr4b-/s1600/Navigasi_Halaman_Windows_Phone_1.png" title="Membuat Navigasi Halaman di Windows Phone 8" width="320" /></a></div>
<div>
<br /></div>
<div>
2. Tambahkan sebuah button pada grid ContentPanel</div>
<div>
<pre class="brush:html"><Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,519">
    <Button x:Name="btn_hal2" Content="Ke halaman 2" Width="400" Height="80" Click="btn_hal2_Click"/>
</Grid></pre>
</div>
<br />
3. Buka file MainPage.xaml.cs tambahkan script dibawah ini untuk berpindah ke hal2.xaml ketika tombol btn_hal2 di klik<br />
<br />
<pre class="brush:html">private void btn_hal2_Click(object sender, RoutedEventArgs e)
{
    NavigationService.Navigate(new Uri("/Hal2.xaml", UriKind.Relative));
}</pre>
<br />
4. Buat 1 halaman dengan cara klik Menu Project - Add New Item - Windows Phone Portrait Page beri nama hal2.xaml<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheEQ4300WwaooIf2AMobxpizg2TGlJHLQN-dLF3qu_-gkwNroLvSGqPTDkAtg_cNlXC38KfwQe_iL-eardbM54sl9bwafqeGCGVeI6t8BUSdtz6UaAy56KoSt10Jbp-_I__ayTFhf8sVK5/s1600/Navigasi_Halaman_Windows_Phone_2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Navigasi Halaman di Windows Phone 8" border="0" height="195" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheEQ4300WwaooIf2AMobxpizg2TGlJHLQN-dLF3qu_-gkwNroLvSGqPTDkAtg_cNlXC38KfwQe_iL-eardbM54sl9bwafqeGCGVeI6t8BUSdtz6UaAy56KoSt10Jbp-_I__ayTFhf8sVK5/s1600/Navigasi_Halaman_Windows_Phone_2.png" title="Membuat Navigasi Halaman di Windows Phone 8" width="320" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
5. Tambahkan sebuah button pada grid ContentPanel</div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<pre class="brush:html"><Grid x:Name="ContentPanel" Margin="12,151,12,10" Grid.RowSpan="2">
      <Button x:Name="btn_kembali" Content="Kembali ke halaman sebelumnya" Width="400" Height="80" Click="btn_kembali_Click"/>
</Grid></pre>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
6. Buka file hal2.xaml.cs tambahkan script dibawah ini untuk kembali ke halaman yang sebelumnya</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<pre class="brush:html">private void btn_kembali_Click(object sender, RoutedEventArgs e)
{
     NavigationService.GoBack();
}</pre>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
7. Jalankan program tersebut dengan cara menekan F5 maka akan seperti gambar dibawah ini</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKzTyHgouVt1sDXgq3JRNrep8y7wa8vyrMKb1iP1QBJZhd3sKClVvFbW4T85x2scIEAL1KJ1SPPALfRcTLiUC22SuOwk1B0MMXMmjtuWuk93MrlXsaa_a_hpfX4DxfDFB75nNpBxkPfAhl/s1600/Navigasi_Halaman_Windows_Phone_4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Navigasi Halaman di Windows Phone 8" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKzTyHgouVt1sDXgq3JRNrep8y7wa8vyrMKb1iP1QBJZhd3sKClVvFbW4T85x2scIEAL1KJ1SPPALfRcTLiUC22SuOwk1B0MMXMmjtuWuk93MrlXsaa_a_hpfX4DxfDFB75nNpBxkPfAhl/s1600/Navigasi_Halaman_Windows_Phone_4.png" title="Membuat Navigasi Halaman di Windows Phone 8" width="179" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9vgZ5QQwW54J0kZrABp4VusMTv8-Pl7-Agxhj8OrsoR8p8KKmM2KpXLJUKkShBTHdGKSZhiWTPEBUTNxxHcv763I2kOPbDcDz1zPk5-J13P8cQPtriSWI6FFgxiujETuQ_UleMqNfiuQ-/s1600/Navigasi_Halaman_Windows_Phone_3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Membuat Navigasi Halaman di Windows Phone 8" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9vgZ5QQwW54J0kZrABp4VusMTv8-Pl7-Agxhj8OrsoR8p8KKmM2KpXLJUKkShBTHdGKSZhiWTPEBUTNxxHcv763I2kOPbDcDz1zPk5-J13P8cQPtriSWI6FFgxiujETuQ_UleMqNfiuQ-/s1600/Navigasi_Halaman_Windows_Phone_3.png" title="Membuat Navigasi Halaman di Windows Phone 8" width="176" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Anda bisa mendownload source codenya <a href="http://adf.ly/thoZj">disini</a></div>
<div class="separator" style="clear: both; text-align: center;">
dan untuk passwordnya <a href="http://adf.ly/fHCDH">disini</a></div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
Sekian pembahasan tentang Membuat Navigasi Halaman di Windows Phone 8</div>
<div class="separator" style="clear: both;">
Tunggu tutorial menarik lainnya, karena itu kunjungi terus blog ini</div>