Project Risk Management

Manajemen Resiko
Pendekatan dalam melakukan manajemen risiko dimulai dengan rencana untuk mendefinisikan ruang lingkup dan proses yang dilakukan identifikasi, penilaian, dan manajemen risiko yang dapat mempengaruhi pelaksanaan proyek.

Tujuan dari Rencana Manajemen Risiko adalah untuk menentukan strategi dalam mengelola risiko yang terkait dengan proyek tersebut sehingga menimbulkan dampak yang minimal terhadap biaya dan jadwal, serta kinerja operasional.

Tujuan dari Rencana Manajemen Risiko adalah untuk membangun pendekatan dalam memantau, mengevaluasi, dan mengelola risiko sepanjang siklus proyek. Risiko merupakan suatu kejadian yang tidak pasti atau kondisi yang, jika terjadi, memiliki efek negatif atau positif pada tujuan proyek.

Yang melakukan perencanaan manajemen risiko adalah tim proyek atau tim khusus yang dibentuk untuk melakukan perencanaan risiko

Komponen yang proyek yang dilakukan analisa yaitu segitiga proyek :
1. Ruang lingkup
2. Biaya
3. Waktu
4. Kualitas

Perencanaan manajemen risiko adalah proses penentuan bagaimana melakukan pendekatan dan melakukan kegiatan terhadap risiko untuk proyek tersebut. Perencanaan sangat penting untuk menetapkan pentingnya manajemen risiko, mengalokasikan sumber daya yang tepat dan waktu yang efisien untuk manajemen risiko dan menetapkan dasar untuk mengevaluasi risiko.

Ada enam kegiatan utama dalam proses Manajemen Risiko yaitu antara lain :
Perencanaan Manajemen Risiko : merupakan proses mendefinisikan manajemen risiko yang akan diterapkan pada proyek
Identifikasi Risiko : Upaya terus menerus untuk mengidentifikasi dan menentukan risiko-risiko yang dapat mempengaruhi proyek serta pendokumentasian karakteristiknya
Analisis Risiko : Sebuah evaluasi dari setiap risiko yang diidentifikasi untuk memperkirakan kemungkinan terjadinya, tingkat dampak dan peringkat prioritas.
Perencanaan Respon Risiko: proses menghasilkan pilihan tindakan untuk memperbesar peluang dan mengurangi hambatan terkait pencapaian tujuan proyek
Monitoring dan Kontrol Risiko: proses pelaksanaan dari rencana respon, pelacakan risiko yang teridentifikasi, pengawasan risiko residual, pengidentifikasian risiko baru, dan evaluasi efektivitas respons risiko selama berlangsungnya proyek

Identifikasi Resiko
Daftar risiko akan dibuat dan dimasukkan ke dalam daftar risiko proyek. Resiko-resiko dasar akan diidentifikasi melalui pendekatan terhadap standar dari jurnal terkait. Pernyataan risiko akan ditulis untuk setiap risiko yang diidentifikasi. Pernyataan risiko akan ditulis secara singkat jelas dan hanya berisi satu kondisi risiko dan satu atau lebih konsekuensi dari kondisi itu.

Semua stakeholder proyek bertanggung jawab untuk mengidentifikasi risiko baru. Risiko baru diidentifikasi selama pertemuan proyek dan ditambahkan ke Risk Register dalam waktu dua hari kerja dari pertemuan. Ini akan menjadi tanggung jawab

Analisis risiko yang akan digunakan adalah menggunakan pendekatan kualitatif. Metodologi ini menggunakan matriks tingkat risiko didasarkan pada probabilitas dan dampak. Hal ini memungkinkan untuk penilaian independen terhadap probabilitas dan konsekuensi risiko.
Tiap resiko harus dievaluasi untuk menentukan dampak, probabilitas kejadian, dan jangka waktu.
Tiap resiko harus diperiksa untuk menentukan hubungannya dengan risiko lainnya yang diidentifikasi. Awalnya, identifikasi resiko harus memberikan perkiraan atribut. Manager Proyek bertanggung jawab untuk analisis lebih lanjut dan prioritas risiko

Accept – Menerima hasil potensi risiko. Penerimaan tidak mengabaikan resiko; ini menunjukkan bahwa tim proyek telah memutuskan untuk tidak mengembangkan mitigasi atau strategi kontingensi. Strategi ini digunakan ketika tim proyek tidak dapat atau memilih untuk tidak menghilangkan, mengurangi, atau mentransfer/berbagi resiko proyek. Sebagai contoh, resiko proyek yang dianggap tidak signifikan atau tidak dapat diterima oleh tim proyek, juga resiko proyek yang dapat membuat resiko baru yang lebih besar.

Mitigate – Meminimalkan dampak risiko dengan mengurangi kemungkinan terjadinya ke tingkat risiko yang dapat diterima. Tindakan ini harus direncanakan dan diselesaikan sebelum proyek berakhir. Strategi ini tidak menghilangkan resiko proyek tetapi mengurangi kemungkinan terjadinya atau dampak dari resiko proyek pada tingkat yang memadai. Sebagai contoh, preferensi dapat diberikan untuk pemilihan peralatan atau teknologi dengan kemungkinan lebih rendah dari kegagalan, bahkan jika mengeluarkan biaya lebih. Kajian independen dari parameter desain, pendekatan, dan peralatan yang dipilih oleh staf dapat mengurangi kesalahan dan meminimalkan resiko proyek. Sebuah sistem peringatan dini atau langkah kontingensi dapat dilakukan di muka untuk mengurangi kemungkinan terjadinya resiko proyek.

Avoid – Menghilangkan risiko dengan menghindari keadaan yang mengakibatkan risiko tersebut. Tindakan ini tidak selalu mungkin, tetapi jika potensi kerugian terlalu besar, rencana kontingensi dapat diberlakukan. Dalam strategi ini, tim proyek memodifikasi rencana proyek untuk menghilangkan atau menghindari resiko proyek. Penghapusan atau metode untuk menghindari resiko proyek terutama digunakan selama pemilihan atau re-evaluasi teknologi

Transfer – Dampak dari resiko proyek ditransfer (seluruhnya atau sebagian) kepada pihak ketiga yang menerima atau berbagi kepemilikan resiko proyek. Penggunaan asuransi adalah contoh dari pengalihan resiko proyek/berbagi.

Monitoring dan Kontrol Resiko
Karena dampak dari implementasi ini akan sangat signifikan bagi perusahaan, sangat penting untuk secara efisien dan efektif mengkomunikasikan status risiko dan isu-isu kepada para pemangku kepentingan yang tepat sepanjang proyek. Dengan memanfaatkan media yang ditetapkan dalam rencana komunikasi, memanfaatkan metodologi pelacakan secara online, dan mengelola proyek rencana kerja, Tim Proyek akan mampu meminimalkan dampak potensi risiko pada jadwal proyek.
Sebagian besar keberhasilan pelaksanaan proyek tergantung pada kemampuan tim proyek untuk membuat keputusan secara tepat waktu dan memiliki pemahaman yang jelas tentang penggambaran kewenangan. Setelah kejadian risiko telah diidentifikasi rencana eskalasi akan diikuti untuk memastikan bahwa risiko benar dinilai, dilacak, tepat diselesaikan, dapat dimonitoring dan dikendalikan

Project Procurement Management

Manajemen Pengadaan Proyek
Pengadaan adalah proses memperoleh barang ataupun jasa dari pihak di luar organisasi.

Manajemen Pengadaan adalah proses –proses yang dilakukan untuk mendapatkan barang dan/atau jasa yang dibutuhkan sebuah proyek dari luar organisasi yang didukungnya.

Informasi yang terkandung di dalamnya :
1. Tuntunan tipe kontrak yang akan digunakan dalam berbagai situasi. 
2. Template yang akan digunakan untuk dokumen-dokumen manajeman pengadaan
3. Tuntunan untuk membuat struktur WBS bagi supplier.
4. Peran dan Tanggung jawab setiap anggota tim proyek.
5. Tuntunan untuk menggunakan estimasi independen yang akan digunakan pada saat mengevaluasi penjual/distributor. 
6. Saran dalam mengelola multiple providers. 
7. Proses untuk koordinasi keputusan pengadaan. 
8. Hambatan dan asumsi berkaitan dengan pembelanjaan dan perolehan. 
9. Waktu terawal untuk belanja.
10. Strategi menghambat resiko dalam pembelanjaan. 
11. Tuntunan untuk mengidentifikasi prequalified supplier. 
12. Parameter pengadaan untuk menilai penjual dan pengelolaan kontrak.

Alat dan Teknik Dalam Perencanaan Belanja dan Pengadaan :
1. Make or Buy Analysis 
2. Expert Judgement 
3. Types of Contract 
4. Procurement Management Plan 
5. Contract Statement of Work ( SOW )

Project Communication Management

Manajemen Komunikasi Proyek termasuk proses yang diperlukan untuk memastikan bahwa informasi dalam proyek dibuat dengan tepat dan cepat, baik dalam segi pengumpulan, diseminasi, penyimpanan, dan disposisi. Hal ini menciptakan hubungan yang penting antara orang-orang, ide, dan informasi yang diperlukan supaya proyek berakhir dengan kesuksesan.

1. Identifikasi Stakeholder -Proses mengidentifikasi semua orang atau organisasi dipengaruhi oleh proyek, dan mendokumentasikan informasi yang relevan mengenai kepentingan mereka, keterlibatan, dan dampaknya pada keberhasilan proyek.
2. Rencana Komunikasi -Proses penentuan informasi pemangku kepentingan proyek dan definisi pendekatan komunikasi.
3. Penyebaran Informasi -Proses pembuatan informasi yang relevan yang tersedia untuk proyek dan pemangku kepentingan seperti yang direncanakan.
4. Mengelola Harapan Stakeholder -Proses berkomunikasi dan bekerja sama dengan pemangku kepentingan untuk memenuhi kebutuhan mereka dan mengatasi masalah yang terjadi.
5. Laporan Kinerja -Proses mengumpulkan dan mendistribusikan informasi pencapaian kinerja,termasuk laporan status, pengukuran kemajuan, dan perkiraan.

Rencana Komunikasi
Rencana Komunikasi adalah proses penentuan kebutuhan pemangku kepentingan informasi proyek dan mendefinisikan pendekatan komunikasi.Rencana Proses Komunikasi merespon informasi dan kebutuhan komunikasi para pemangku kepentingan, misalnya, yang membutuhkan informasi, kapan mereka akan membutuhkannya, bagaimana hal itu akan diberikan kepada mereka, dan oleh siapa yang akan memberikan.

Distribusi Komunikasi
Mendistribusikan informasi adalah proses pembuatan informasi yang relevan yang tersedia bagi stakeholder proyek seperti yang direncanakan.

Distribusi informasi yang efektif mencakup sejumlah teknik termasuk :
1. Model Sender-receiver. Feedback loop dan hambatan komunikasi.
2. Pilihan media. Situasi spesifik ketika berkomunikasi secara tertulis dibandingkan secara lisan, ketika menulis sebuah memo resmi versus laporan resmi, dan ketika berkomunikasi tatap muka dibandingkan melalui e-mail.
3. Gaya Menulis. Aktif versus pasif, struktur kalimat, dan pilihan kata.
4. Pertemuan teknik manajemen. Mempersiapkan agenda dan berurusan dengan konflik.
5. Teknik Presentasi. Bahasa tubuh dan desain alat bantu visual.
6. Teknik fasilitasi. Membangun konsensus dan mengatasi hambatan.

Mengelola Harapan Stakeholder adalah proses berkomunikasi dan bekerja sama dengan para pemangku kepentingan untuk memenuhi kebutuhan mereka dan mengatasi masalah yang terjadi.

Mengelola harapan membantu meningkatkan kemungkinan keberhasilan proyek dengan memastikan bahwa para pemangku kepentingan memahami manfaat dan resiko proyek. Hal ini memungkinkan mereka untuk menjadi pendukung aktif proyek dan untuk membantu dengan penilaian risiko pilihan proyek. Dengan mengantisipasi reaksi masyarakat terhadap proyek tersebut, tindakan pencegahan dapat diambil untuk memenangkan dukungan mereka atau meminimalkan potensi dampak negatif.

Laporan Kinerja
Laporan Kinerja adalah proses mengumpulkan dan mendistribusikan informasi kinerja, termasuk laporan status, pengukuran kemajuan, dan prakiraan. Proses pelaporan kinerja melibatkan pengumpulan periodik dan analisis awal terhadap data aktual untuk memahami dan berkomunikasi kemajuan proyek dan kinerja serta untuk meramalkan hasil proyek.
Laporan kinerja perlu memberikan informasi pada tingkat yang sesuai untuk setiap penonton. Format dapat berkisar dari laporan status sederhana untuk laporan lebih rumit. Sebuah laporan Status sederhana mungkin menampilkan informasi kinerja, seperti persen selesai, atau status dashboard untuk setiap wilayah (yaitu, ruang lingkup, jadwal, biaya, dan kualitas)

Menambahkan Snapping ke Dalam Aplikasi Metro Style

Halo apa kabar? Hari ini saya akan mempraktekkan bagaimana menambahkan snapping pada aplikasi metro style di windows 8. Snapping sendiri adalah bagian yang sangat penting untuk ditambahkan pada aplikasi metro style karena merupakan salah satu syarat utama sebuah aplikasi metro style memiliki snapping jika aplikasi tersebut ingin terpublish di Windows Store.

Jika kalian membuat aplikasi Grid App (XAML), kalian tidak perlu menambahkan snapping secara manual karena sudah disediakan secara default. Akan tetapi jika kalian membuat aplikasi menggunakan Blank App (XAML), kalian harus menambahkannya secara manual.

Berikut adalah pembuatan snapping pada aplikasi metro style.

 

Pembuatan Aplikasi

Sekarang kalian bukalah Visual Studio 2012 dan buatlah Blank App (XAML) dan beri nama : AplikasiSnapping

Lalu setelah aplikasi terbuat, bukalah MainPage.xaml dan tulislah code berikut pada bagian grid :

<Grid Background=”#FF208D9E”>
<TextBlock HorizontalAlignment=”Left” Margin=”501,204,0,0″ TextWrapping=”Wrap” Text=”Aplikasi” VerticalAlignment=”Top” Height=”61″ Width=”166″ FontSize=”48″/>
<TextBlock HorizontalAlignment=”Left” Margin=”676,204,0,0″ TextWrapping=”Wrap” Text=”Snapping” VerticalAlignment=”Top” Height=”61″ Width=”203″ FontSize=”48″/>

</Grid>

Sehingga tampilan aplikasi kalian menjadi seperti berikut :

 

Sekarang kalian perlu menambahkan LayoutAwarePage.cs ke folder Common kalian pada Solution Explorer. Cara mudahnya adalah kalian tambahkan Basic Page ke dalam project kalian dengan cara klik kanan AplikasiSnapping pada Solution Explorer kemudian pilih add-New Item-Basic Page. Lalu tanpa memberi nama pada Basic Page tekan Add.

Setelah kalian menekan Add, di layar kalian tampil sebuah dialog box yang menyatakan akan menambahkan beberapa file ke dalam folder Common. Tekan Yes.

Setelah itu beberapa file .cs pun tertambahkan di dalam folder Common kalian.

Sebenarnya Basic Page yang telah kalian tambahkan tersebut tidak digunakan dalam aplikasi, hanya saja kita membutuhkan file” yang berada dalam folder Common tersebut, sehingga kalian boleh menghapus BasicPage yang tadi kalian buat.

Oke sekarang kembali pada MainPage.xaml, lakukan modifikasi pada bagian “<Page” (bagian paling atas code) menjadi “<common:LayoutAwarePage”. Dan modifikasi penutup “</Page>” (bagian paling bawah code) menjadi “</common:LayoutAwarePage>”.

Jika terjadi error pada xaml kalian abaikan saja dulu ya.

Sekarang tambahkan pada bagian bawah dari “<common:LayoutAwarePage” code berikut :

xmlns:common=”using:AplikasiSnapping.Common”

 

Lalu tekan F7 untuk masuk ke halaman MainPage.xaml.cs, kemudian modifikasi bagian “public sealed partial class MainPage : Page” menjadi “public sealed partial class MainPage : AplikasiSnapping.Common.LayoutAwarePage”.

Setelah itu aplikasi kalian siap untuk ditambahkan snapping.

Maka tulislah code berikut di dalam bagian grid :

<VisualStateGroup x:Name=”ApplicationViewStates”>
<VisualState x:Name=”FullScreenLandscape”/>
<VisualState x:Name=”Filled”/>

<!– The entire page respects the narrower 100-pixel margin convention for portrait –>
<VisualState x:Name=”FullScreenPortrait”>
<Storyboard>
</Storyboard>
</VisualState>

<!– The back button and title have different styles when snapped –>
<VisualState x:Name=”Snapped”>
<Storyboard>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>

 

Penambahan Snapping

Sekarang klik kanan pada MainPage.xaml kalian dan pilihlah “open in blend…”.

Setelah aplikasi Blend terbuka, kalian pilihlah “device”.

Lalu pada bagian “view” aturlah tampilan aplikasi kalian sesuai dengan konten aplikasi kalian.

 

 

Jalankan Aplikasi

Saatnya menjalankan aplikasi! Sekarang run project kalian dan cobalah snapping pada aplikasi kalian.

Saat kalian melakukan snapping.

Mudah bukan. Saatnya kalian yang mencoba 🙂

 

 

Membuat Animasi Sederhana Menggunakan Blend di Aplikasi Metro Style

Hai, hari ini saya akan mempraktekkan sedikit untuk membuat animasi sederhana menggunakan aplikasi Blend. Aplikasi Blend sudah terinstalkan otomatis jika kalian menginstal aplikasi Visual Studio 2012.

Sebenarnya dengan aplikasi Blend kita akan sangat mudah untuk mendesign aplikasi metro style. Selain itu untuk membuat objek bergerak (animasi) pun dapat dilakukan dengan menggunakan Blend.

Langsung saja kita membuat aplikasinya.

 

 

Pembuatan Aplikasi

Sekarang kalian buatlah Blank App (XAML) dan beri nama : AplikasiAnimasi

Setelah aplikasi kalian terbuat, masuklah ke MainPage.xaml dan tulislah code berikut di bagian grid :

<Grid Background=”#FF804D23″>
<Rectangle x:Name=”kotak” Fill=”#FF722AB9″ HorizontalAlignment=”Left” Height=”136″ Margin=”0,632,0,0″ Stroke=”Black” VerticalAlignment=”Top” Width=”133″/>

</Grid>

Sehingga tampilan aplikasi kalian menjadi seperti berikut.

Sekarang klik kanan pada MainPage.xaml pada bagian solution explorer dan pilih “Open in Blend…”.

Setelah kalian masuk aplikasi Blend, pilihlah new (tanda +).

Kemudian beri nama “kotakAnimation” dan tekan OK.

Setelah itu akan tampil animation editor dan lakukanlah animasi pada kotak yang kalian sudah buat sebelumnya.

Setelah itu save pekerjaan kalian dan close Blend dengan cara klik close di kanan atas.

Setelah itu masuklah ke halaman MainPage.xaml.cs.

kemudian pada bagian constructor tambahkan code “kotakAnimation.begin();”

 

 

Jalankan Aplikasi

Waktunya menjalankan aplikasi. Sekarang run project kalian dan lihatlah kotak yang kalian bergerak sesuai dengan animasi yang kalian buat pada aplikasi Blend.

 

Membuat Application Bar pada Aplikasi Metro Style

Pada artikel kali ini adalah bagian yang mudah akan tetapi jika kalian melewatkan bagian yang satu ini, akan sangat sulit atau bahkan aplikasi anda tidak dapat ter-publish di Windows Store. Untuk para developer yang sudah biasa mendevelop aplikasi di Windows Store pastinya sudah sangat tidak aneh dengan artikel kali ini. 🙂

Oke tidak berlama-lama, langsung saja kita membuat aplikasi metro style dengan application bar.

 

 

Pembuatan Aplikasi

Buatlah blank app (XAML) dengan nama : ContohAppBar

Setelah halaman blank page terbuka, kalian bukalah MainPage.xaml kemudian tulislah code berikut di bagian grid :

<Grid Background=”#FF082746″>
<Image x:Name=”WallpaperImg” HorizontalAlignment=”Left” Height=”768″ VerticalAlignment=”Top” Width=”1366″/>

</Grid>

Sehingga tampilan aplikasi ContohAppBar menjadi seperti berikut :

 

Oke, sekarang di atas bagian grid tuliskan code berikut :

<Page.BottomAppBar>
<AppBar x:Name=”bottomAppBar” IsSticky=”True”>
<Grid>
<StackPanel x:Name=”rightPanel”
Orientation=”Horizontal” HorizontalAlignment=”Right”>
<Button
AutomationProperties.Name=”Cari Gambar”
AutomationProperties.AutomationId=”SortButton”
Click=”cariGambar” Style=”{StaticResource SearchAppBarButtonStyle}” />
</StackPanel>
</Grid>
</AppBar>
</Page.BottomAppBar>

Dan sekarang aplikasi kalian sudah memiliki sebuah application bar yang berisi satu button “Cari Gambar”.

Tekan “F7” untuk masuk ke dalam MainPage.xaml.cs.

Tuliskan code berikut di bawah constructor :

private async void cariGambar(object sender, RoutedEventArgs e)
{
Windows.Storage.Pickers.FileOpenPicker openPicker = new Windows.Storage.Pickers.FileOpenPicker();
openPicker.ViewMode = Windows.Storage.Pickers.PickerViewMode.Thumbnail;
openPicker.SuggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.PicturesLibrary;
openPicker.FileTypeFilter.Add(“.jpg”);

Windows.Storage.StorageFile file = await openPicker.PickSingleFileAsync();

if (file != null)
{
// Ensure the stream is disposed once the image is loaded
using (Windows.Storage.Streams.IRandomAccessStream fileStream = await file.OpenAsync(Windows.Storage.FileAccessMode.Read))
{
// Set the image source to the selected bitmap
Windows.UI.Xaml.Media.Imaging.BitmapImage bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage();

await bitmapImage.SetSourceAsync(fileStream);
WallpaperImg.Source = bitmapImage;
WallpaperImg.Stretch = Stretch.Fill;
}
}
}

 

 

Jalankan Aplikasi

Waktunya menjalankan aplikasi! Sekarang run project kalian dan setelah aplikasi kalian tereksekusi klik kanan di sembarang tempat.

Wah, application bar kalian terpop-up ke atas! Tekan button “Cari Gambar” dan kalian akan masuk ke directory PC anda lalu pilihlah gambar dari PC kalian.

Kemudian tekan open. Dan aplikasi kalian pun akan menampilkan gambar yang kalian pilih tadi.

Mudah sekali bukan untuk menambahkan application bar ke aplikasi metro style kalian. Wajib mencoba ya.

Update Status Facebook dengan Aplikasi Metro Style

Oke, pada hari ini saya akan menjelaskan kepada kalian bagaimana membuat aplikasi di windows 8 dengan fungsionalitas update status Facebook. Pada saat ini sudah banyak, bahkan saya rasa semua diantara pembaca sudah memiliki akun Facebook ya kan? Oleh karena itulah saya rasa artikel ini penting untuk dibuat karena ketika mendevelop aplikasi sangat mungkin suatu saat kalian akan membutuhkan integrasi dengan Facebook, salah satunya yaitu menulis informasi ke dalam status Facebook.

Bagaimana cara mengintegrasikan aplikasi dengan Facebook? Kita akan menggunakan API facebook sebagai jembatan untuk dapat melakukan aksi ke dalam Facebook.

 

Sebelum membuat aplikasi, kalian perlu mengetahui bahwa untuk dapat menggunakan API facebook kalian harus memiliki Application ID yang dapat kalian dapatkan dengan membuat aplikasi di dalam facebook. Berikut adalah caranya :

Pertama-tama kalian bukalah halaman https://developers.facebook.com/

Jika kalian belum melakukan log-in pada Facebook, anda lakukanlah log-in dengan cara klik tombol log-in di atas kanan.

Setelah kalian melakukan log-in bukalah halaman ini di browser https://developers.facebook.com/apps/?action=create

Dan isikanlah “App Name”  sesuai dengan nama aplikasi facebook yang akan kalian buat (nama aplikasi bebas dan ketersediaannya akan diperiksa oleh sistem).

Lalu tekan Continue. Setelah itu kalian akan diminta untuk memasukkan Code Captcha.

Setelah menginputkan code dengan benar tekan Continue dan kalian telah berhasil membuat aplikasi di Facebook.

Setelah itu bukalah halaman ini di browser https://developers.facebook.com/apps

Yang saya lingkari merah adalah Application ID yang perlu kalian catat karena akan dipergunakan untuk mengintegrasikan aplikasi metro style kalian dengan aplikasi Facebook yang baru saja kalian buat ini. 🙂

 

 

Pembuatan Aplikasi

Sebelum membuat aplikasi kalian juga perlu mendownload Facebook.dll yang saya bagikan untuk kalian dengan klik disini.

Setelah mendownload file Facebook.dll tersebut. Sekarang buatlah Blank App baru di Visual Studio 2012 kalian.

Beri nama aplikasi kalian : TulisWallFacebook dan kemudian tekan OK.

Tambahkan Facebook.dll pada project kalian dengan cara klik kanan pada bagian References dan pilihlah “add references..”. Kemudian tekan browse dan carilah file Facebook.dll yang telah kalian download tadi.

Setelah Facebook.dll tertambahkan di dalam Folder References, kalian tambahkanlah Blank Page baru dengan cara klik kanan pada bagian “TulisWallFacebook” (Nama aplikasi Blank App yang kalian buat) pada bagian Solution Explorer. Kemudian pilihlah Add-New Item.

Setelah itu pilihlah Blank Page dan beri nama TulisWall.xaml kemudian tekan Add.

 

MainPage.Xaml

Oke setelah itu pada MainPage.xaml, tambahkan code berikut pada bagian grid :

<Grid Background=”#FF146F99″>
<Button Content=”Masuk” HorizontalAlignment=”Left” Margin=”538,328,0,0″ VerticalAlignment=”Top” Height=”102″ Width=”290″ FontSize=”36″ Click=”Masuk”/>
</Grid>

Sehingga tampilan MainPage.xaml kalian menjadi seperti berikut.

Setelah itu tekan “F7”, sehingga kalian akan masuk ke dalam MainPage.xaml.cs. Dan tulislah pada bagian header :

using Facebook;
using Windows.Security.Authentication.Web;
using System.Dynamic;

 

dan kemudian deklarasikanlah di atas constructor kalian:

string applicationID = “436497xxxxxxxx”; (Aplikasi ID yang sebelumnya telah kalian buat)

string permission = “user_about_me,read_stream,publish_stream”;

FacebookClient _fb = new FacebookClient();

 

Kemudian buatlah buatlah prosedur berikut sebagai eventHandler click dari Button :

private async void Masuk(object sender, RoutedEventArgs e)
{
var redirectUrl = “https://www.facebook.com/connect/login_success.html&#8221;;
try
{
var loginUrl = _fb.GetLoginUrl(new
{
client_id = applicationID,
redirect_uri = redirectUrl,
scope = permission,
display = “popup”,
response_type = “token”
});

var endUri = new Uri(redirectUrl);

WebAuthenticationResult WebAuthenticationResult = await WebAuthenticationBroker.AuthenticateAsync(
WebAuthenticationOptions.None,
loginUrl,
endUri);
if (WebAuthenticationResult.ResponseStatus == WebAuthenticationStatus.Success)
{
var callbackUri = new Uri(WebAuthenticationResult.ResponseData.ToString());
var facebookOAuthResult = _fb.ParseOAuthCallbackUrl(callbackUri);

var accessToken = facebookOAuthResult.AccessToken;
if (String.IsNullOrEmpty(accessToken))
{
}
else
{
LoginSucceded(accessToken);
}

}
else if (WebAuthenticationResult.ResponseStatus == WebAuthenticationStatus.ErrorHttp)
{
throw new InvalidOperationException(“HTTP Error returned by AuthenticateAsync() : ” + WebAuthenticationResult.ResponseErrorDetail.ToString());
}
else
{
}
}
catch (Exception ex)
{
throw ex;
}
}

 

Dan tambahkan prosedur :

private async void LoginSucceded(string accessToken)
{
dynamic parameters = new ExpandoObject();
parameters.access_token = accessToken;
parameters.fields = “id”;

dynamic result = await _fb.GetTaskAsync(“me”, parameters);
parameters = new ExpandoObject();
parameters.id = result.id;
parameters.access_token = accessToken;

Frame.Navigate(typeof(TulisWall), (object)parameters);
}

 

TulisWall.Xaml

Pada Blank Page TulisWall.Xaml tulislah code berikut di bagian grid :

<Grid Background=”#FF146F99″>
<Image x:Name=”picProfile” HorizontalAlignment=”Left” Height=”200″ Margin=”22,24,0,0″ VerticalAlignment=”Top” Width=”200″/>
<TextBox x:Name=”txtMessage” HorizontalAlignment=”Left” Margin=”262,121,0,0″ TextWrapping=”Wrap” Text=”” VerticalAlignment=”Top” Height=”89″ Width=”847″ FontSize=”48″/>
<TextBlock x:Name=”TotalFriends” HorizontalAlignment=”Left” Margin=”639,383,0,0″ TextWrapping=”Wrap” Text=”” VerticalAlignment=”Top” Height=”47″ Width=”679″ FontSize=”48″/>
<TextBlock x:Name=”ProfileName” HorizontalAlignment=”Left” Margin=”639,291,0,0″ TextWrapping=”Wrap” Text=”” VerticalAlignment=”Top” Height=”47″ Width=”679″ FontSize=”48″/>
<Button Content=”Post” HorizontalAlignment=”Left” Margin=”1138,121,0,0″ VerticalAlignment=”Top” Click=”PostkeWall” Height=”89″ Width=”180″ FontSize=”36″/>
<Button Content=”Foto” HorizontalAlignment=”Left” Margin=”10,657,0,0″ VerticalAlignment=”Top” Click=”PostFoto” Height=”88″ Width=”1346″ FontSize=”36″/>
<TextBlock HorizontalAlignment=”Left” Margin=”330,39,0,0″ TextWrapping=”Wrap” Text=”Apa yang Sedang Kamu Pikirkan?” VerticalAlignment=”Top” Width=”708″ Height=”58″ FontSize=”48″/>
<TextBlock HorizontalAlignment=”Left” Margin=”262,291,0,0″ TextWrapping=”Wrap” Text=”Profile Name” VerticalAlignment=”Top” Height=”47″ Width=”353″ FontSize=”48″/>
<TextBlock HorizontalAlignment=”Left” Margin=”262,383,0,0″ TextWrapping=”Wrap” Text=”Teman” VerticalAlignment=”Top” Height=”47″ Width=”353″ FontSize=”48″/>
</Grid>

Dan tampilan TulisWall.Xaml kalian akan seperti ini.

 

Setelah itu tekan “F7” dan kalian akan masuk ke halaman TulisWall.xaml.cs.

Lalu tambahkan pada bagian header :

using Facebook;
using Windows.Security.Authentication.Web;
using System.Dynamic;
using Windows.UI.Xaml.Media.Imaging;
using Windows.Storage;
using Windows.Storage.Pickers.Provider;
using Windows.Media.Capture;

 

Dan tulislah code berikut pada bagian deklarasi :

private readonly FacebookClient _fb = new FacebookClient();
private string _userId;

 

Lalu modifikasi bagian prosedur OnNavigatedTo untuk menerima value dari MainPage.xaml :

protected override void OnNavigatedTo(NavigationEventArgs e)
{
dynamic parameter = e.Parameter;
_fb.AccessToken = parameter.access_token;
_userId = parameter.id;

LoadFacebookData();
}

 

Dan tambahkan beberapa prosedur dibawahnya :

private async void PostkeWall(object sender, RoutedEventArgs e)
{
try
{
dynamic parameters = new ExpandoObject();
parameters.message = txtMessage.Text;

dynamic result = await _fb.PostTaskAsync(“me/feed”, parameters);
_lastMessageId = result.id;

txtMessage.Text = string.Empty;
}
catch (FacebookApiException ex)
{
}
}

private void PostFoto(object sender, RoutedEventArgs e)
{
upload();
}

private void LoadFacebookData()
{
dapatkanProfilePicture();
dapatkanNamaProfile();
dapatkanTotalTeman();
}

private async void dapatkanProfilePicture()
{
try
{
dynamic result = await _fb.GetTaskAsync(“me?fields=picture”);
string id = result.id;

string profilePictureUrl = string.Format(“https://graph.facebook.com/{0}/picture?type={1}&access_token={2}”, _userId, “large”, _fb.AccessToken);

picProfile.Source = new BitmapImage(new Uri(profilePictureUrl));
}
catch (FacebookApiException ex)
{
}
}

private async void dapatkanNamaProfile()
{
try
{
dynamic result = await _fb.GetTaskAsync(“me”);

dynamic id = result.id;
dynamic name = result.name;

ProfileName.Text = name;

dynamic firstName = result[“first_name”];
dynamic lastName = result[“last_name”];

var localeExists = result.ContainsKey(“locale”);

var dictionary = (IDictionary<string, object>)result;
localeExists = dictionary.ContainsKey(“locale”);
}
catch (FacebookApiException ex)
{
}
}

private async void dapatkanTotalTeman()
{
try
{
var query = string.Format(“SELECT uid,pic_square FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1={0})”, “me()”);

dynamic parameters = new ExpandoObject();
parameters.q = query;
dynamic result = await _fb.GetTaskAsync(“fql”, parameters);

TotalFriends.Text = string.Format(“Kamu memiliki {0} teman.”, result.data.Count);

}
catch (FacebookApiException ex)
{
}

}

private string _lastMessageId;

public async void upload()
{
var fb = new FacebookClient(_fb.AccessToken);
var dialog = new CameraCaptureUI();
dialog.PhotoSettings.Format = CameraCaptureUIPhotoFormat.Jpeg;
var file = await dialog.CaptureFileAsync(CameraCaptureUIMode.Photo);

var fileStream = await file.OpenAsync(Windows.Storage.FileAccessMode.Read);

fb.PostCompleted += (o, e) =>
{
fileStream.Dispose();

if (e.Cancelled || e.Error != null)
{
return;
}

var result = e.GetResultData();
};

var parameters = new Dictionary<string, object>();
parameters[“message”] = “Fotoku dari aplikasi Metro Style”;
parameters[“file”] = new FacebookMediaStream
{
ContentType = “image/jpeg”,
FileName = “image.jpg”
}.SetValue(fileStream.AsStream());

fb.PostAsync(“me/photos”, parameters);
}

 

Bagian koding selesai. 🙂

Sekarang masuk ke Package.appxmanifest – Cappabilities dan pastikan webcam ter-checklist agar aplikasi kalian memperbolehkan pengguna menggunakan webcam untuk mengambil foto.

 

 

Jalankan Aplikasi

Waktunya menjalankan aplikasi! Sebelumnya pastikan kalian terkoneksi dengan internet ya.

Sekarang run project kalian. Maka halaman yg pertama tampil adalah halaman MainPage.xaml. Tekan “Masuk”.

Kemudian tampilan aplikasi Facebook yang kalian buat akan ditampilkan.

Dan setelah ditampilkan seluruhnya, masukkan e-mail dan password Facebook kalian di dalamnya.

Kemudia tekan masuk, sehingga respon dari Facebook Server akan dialihkan oleh MainPage.xaml ke halaman TulisWall.xaml. Dan data akun facebook kalian akan ditampilkan pada TulisWall.xaml.

 

Isilah textbox dan tekan tombol POST untuk mengupdate status Facebook kalian!

Periksa akun facebook kalian.

 

Tekan tombol Foto untuk meng-attach foto dan langsung menjadikan status di Facebook!

Periksa akun lagi setelah aplikasi beberapa saat mengupload foto kalian.

 

Artikel kali ini cukup panjang ya, tapi jangan patah semangat untuk mencoba ya!
Semoga bermanfaat!

 

Membuat Aplikasi Berita K-Pop dengan API Viki.com (JSON)

Apa kabar para developer Indonesia? Sehat dan masih bersemangat kan tentunya. 🙂

Pada artikel kali ini saya akan menepati janji saya untuk membuat satu contoh aplikasi menggunakan API dalam format JSON. Aplikasi ini akan menerima feed dari web Viki.com yang ter-update dan ditampilkan dalam bentuk grid.

Grid app merupakan sebuah template yang disediakan oleh team microsoft untuk dipakai oleh developer menyajikan data dengan lebih elegan.

 

 

Pembuatan Aplikasi

Sekarang waktunya pembuatan aplikasi. Pertama-tama kalian perlu membuat aplikasi grid terlebih dahulu dan beri nama : AplikasiMusikKorea

Setelah itu tekan OK.

Kemudian karena kali ini kita akan membuat aplikasi yang membaca format JSON, maka kalian perlu menambahkan library JSON dengan cara klik kanan pada folder References dan pilih Manage NuGet Packages. Oh ya sebelumnya kalian harus terkoneksi internet untuk dapat mendownload library JSON.

Setelah itu akan muncul tampilan seperti berikut :

Pada bagian Search Online yang berada pada bagian atas kanan ketikkan “json” dan tekan enter maka akan tampil daftar library terkait yang dapat di download oleh kalian. Pilihlah “Json.NET” dan tekan tombol Install.

Setelah terinstall maka Newtonsoft.Json.dll akan tertambah di bagian “References”. Ini berarti kalian dapat membuat objek dan memakai fungsi dari library tersebut.

Sekarang bukalah class SampleDataSource.cs yang berada di dalam folder DataModel. Kemudian tambahkan pada bagian header kedua syntax ini :

• using Newtonsoft.Json.Linq;
• using Newtonsoft.Json;

Dengan menambahkan syntax tersebut pada bagian header berarti kalian sekarang dapat membuat objek dan memakai fungsi dari Newtonsoft.Json.dll di dalam class SampleDataSource.cs.

Kemudian kalian carilah “public SampleDataSource()” yang merupakan constructor dari class SampleDataSource.cs.

Diatas dari constructor SampleDataSource buatlah sebuah prosedur asynchronous dengan nama “bindKoreaMusik()” sehingga tampilannya menjadi seperti ini :

Di dalam prosedur tersebut tambahkan syntax di bawah ini :

System.Net.Http.HttpClient client = new System.Net.Http.HttpClient();

try
{
var stringkorea = await client.GetStringAsync(“http://www.viki.com/api/v3/music_videos.json?access_token=ca236abe488687b79b365c6488c5621c49ad77c8024a1f3ad8327a95c7c5369e&genre=33&#8221;);
if (stringkorea != null)
{
JObject o = JObject.Parse(stringkorea);

for (int inc = 0; inc <= 9; inc++)
{
judul[inc] = o[“response”][inc][“title”].ToString();
tggl[inc] = o[“response”][inc][“created_at”].ToString();
gambar[inc] = o[“response”][inc][“image”].ToString();
artis[inc] = o[“response”][inc][“artist”][“name”].ToString();
}
}

String ITEM_CONTENT = String.Format(“Item Content: {0}\n\n{0}\n\n{0}\n\n{0}\n\n{0}\n\n{0}\n\n{0}”,
“Curabitur class aliquam vestibulum nam curae maecenas sed integer cras phasellus suspendisse quisque donec dis praesent accumsan bibendum pellentesque condimentum adipiscing etiam consequat vivamus dictumst aliquam duis convallis scelerisque est parturient ullamcorper aliquet fusce suspendisse nunc hac eleifend amet blandit facilisi condimentum commodo scelerisque faucibus aenean ullamcorper ante mauris dignissim consectetuer nullam lorem vestibulum habitant conubia elementum pellentesque morbi facilisis arcu sollicitudin diam cubilia aptent vestibulum auctor eget dapibus pellentesque inceptos leo egestas interdum nulla consectetuer suspendisse adipiscing pellentesque proin lobortis sollicitudin augue elit mus congue fermentum parturient fringilla euismod feugiat”);

var group1 = new SampleDataGroup(“Group-1”,
“K-pop”,
“Group Subtitle: 1”,
“Assets/DarkGray.png”,
“Group Description: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tempor scelerisque lorem in vehicula. Aliquam tincidunt, lacus ut sagittis tristique, turpis massa volutpat augue, eu rutrum ligula ante a ante”);
group1.Items.Add(new SampleDataItem(“Group-1-Item-1”,
“Judul: ” + judul[0],
“Artis: ” + artis[0],
gambar[0],
“Tanggal: ” + tggl[0],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-2”,
“Judul: ” + judul[1],
“Artis: ” + artis[1],
gambar[1],
“Tanggal: ” + tggl[1],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-3”,
“Judul: ” + judul[2],
“Artis: ” + artis[2],
gambar[2],
“Tanggal: ” + tggl[2],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-4”,
“Judul: ” + judul[3],
“Artis: ” + artis[3],
gambar[3],
“Tanggal: ” + tggl[3],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-5”,
“Judul: ” + judul[4],
“Artis: ” + artis[4],
gambar[4],
“Tanggal: ” + tggl[4],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-6”,
“Judul: ” + judul[5],
“Artis: ” + artis[5],
gambar[5],
“Tanggal: ” + tggl[5],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-7”,
“Judul: ” + judul[6],
“Artis: ” + artis[6],
gambar[6],
“Tanggal: ” + tggl[6],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-8”,
“Judul: ” + judul[7],
“Artis: ” + artis[7],
gambar[7],
“Tanggal: ” + tggl[7],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-9”,
“Judul: ” + judul[8],
“Artis: ” + artis[8],
gambar[8],
“Tanggal: ” + tggl[8],
ITEM_CONTENT,
group1));
group1.Items.Add(new SampleDataItem(“Group-1-Item-10”,
“Judul: ” + judul[9],
“Artis: ” + artis[9],
gambar[9],
“Tanggal: ” + tggl[9],
ITEM_CONTENT,
group1));
this.AllGroups.Add(group1);

}
catch
{
}

 

Disini kalian dapat lihat “o” adalah objek dari JSON. Dan judul, tggl, gambar, dan artis yang memiliki array antara 0-9 saya beri inputan dari api dengan format JSON yang dipanggil oleh HttpClient.

Jika kalian bingung darimana bentuk pemarsingan tersebut sebaiknya kalian lihat artikel yang saya buat sebelumnya dengan klik disini.

 

Setelah itu kalian hapus semua isi syntax di dalam constructor SampleDataSource(), dan isikan syntax di dalamnya : bindKoreaMusik();

sehingga tampilan constructor kalian akan seperti ini :

 

 

Jalankan Aplikasi

Saatnya mencoba aplikasi! Sekarang run project kalian. Dan setelah menunggu beberapa saat tampillah berita k-pop anda.

Dicoba di rumah ya teman-teman. 🙂

Cara Mudah Memparsing JSON Ke Dalam Array

Apa kabar developer Indonesia? Pada artikel kali ini saya tidak akan mengimplementasikan terlalu banyak parsing JSON ke dalam array, akan tetapi saya akan menjelaskan dahulu apa itu JSON dan kegunaannya, serta menjelaskan bagaimana membaca format JSON yang terlihat “sulit” menjadi sangat mudah.

Pertama-tama kalian perlu tahu apa itu JSON (Java Script Object Notation)? JSON adalah salah satu format yang sering dipakai oleh para developer web untuk menyajikan data yang mereka miliki untuk diolah oleh para developer lainnya. Sebenarnya banyak format yang akan sering kalian temukan ketika ingin mendapatkan feed dari web, contohnya : YAML dan XML.

Berikut adalah contoh API dari web yang menyajikan datanya dengan format JSON. Klik disini.

 

 

Parsing JSON

Untuk dapat melihat dengan jelas format JSON, saya akan memberikan satu contoh bentuk format JSON yang mudah :

Sekarang kalian dapat melihat ada tanda kurung yang bentuknya “{” dan “}”, dan juga “[” dan “]”. Sebenarnya apa artinya dan bedanya dari kedua tanda kurung tersebut?

Tanda kurung “{” dan “}” dapat diparsing ke dalam array dalam bentuk array string. Sedangkan tanda kurung “[” dan “]” akan di parsing ke dalam array dalam bentuk array integer.

Berikut adalah point-point yang menjelaskan pemarsingan setiap elemen dari contoh yang saya berikan di atas :

• Mendapatkan id. Untuk mendapatkan id kalian dapat memparsingnya dengan : string id = objekJSON[“id”]
• Mendapatkan judul. Untuk mendapatkan judul kalian dapat memparsingnya dengan : string judul = objekJSON[“judul”]
• Mendapatkan bioskop. Untuk mendapatkan bioskop yang merupakan objek juga dari main : string bioskop = objekJSON[“main”][“bioskop”]
• Mendapatkan kota. Untuk mendapatkan kota yang merupakan objek dari main : string kota = objekJSON[“main”][“kota”]
• Mendapatkan provinsi. Untuk mendapatkan provinsi yang merupakan objek dari main : string provinsi = objekJSON[“main”][“provinsi”]
• Mendapatkan objek ke 1 dari jam_tayang. Untuk mendapatkan objek-objek dari jam_tayang kalian dapat memparsingnya ke dalam array integer : string jamtayang[0] = objekJSON[“jam_tayang”][0]
• Mendapatkan objek ke 2 dari jam_tayang. string jamtayang[1] =objekJSON[“jam_tayang”][1]
• Mendapatkan objek ke 3 dari jam_tayang. string jamtayang[2] =objekJSON[“jam_tayang”][2]

 

Mudah bukan? Jika kalian masih belum terlalu paham mengenai parsing JSON. Dalam artikel berikutnya saya akan membangun aplikasi metro style dengan mengimplementasikan parsing JSON ke dalam array.

Peta Dunia Di Metro Style Windows 8 Menggunakan Google Maps API

Pada siang hari kali ini saya akan membangun sebuah aplikasi yang dapat menampilkan peta kota ataupun negara. Bagaimana caranya? Mungkin itu yang ada di benak kalian ketika membaca artikel ini pertama kali.
Sebenarnya tidak sulit untuk menampilkan peta yang dinamis sesuai dengan pencarian yang pengguna inputkan.
Disini saya akan menggunakan Google Maps API untuk mencari peta dari tempat/kota yang pengguna inputkan di aplikasi. Google Maps menyediakan API yang dapat kalian sebagai developer gunakan.

 

 
Pembuatan Aplikasi

Langsung saja ke dalam pembuatan aplikasi.

Pertama-tama kalian perlu membuat blank app (XAML) dengan nama : AplikasiCariPeta

Setelah blank app dibuat, design lah tampilan aplikasi sehingga tampak seperti berikut.

Kalian dapat menambahkan kode berikut ke dalam bagian grid untuk mendapatkan tampilan tersebut :

<Grid Background=”#FF207627″>
<TextBlock HorizontalAlignment=”Left” Margin=”434,50,0,0″ TextWrapping=”Wrap” Text=”Cari” VerticalAlignment=”Top” Height=”55″ Width=”97″ FontSize=”48″/>
<TextBox x:Name=”petaTxtBox” HorizontalAlignment=”Left” Margin=”552,46,0,0″ TextWrapping=”Wrap” Text=”” VerticalAlignment=”Top” Height=”65″ Width=”402″ FontSize=”36″/>
<Image x:Name=”petaImage” HorizontalAlignment=”Left” Height=”600″ Margin=”400,143,0,0″ VerticalAlignment=”Top” Width=”600″/>

</Grid>

Setelah itu tambahkan event keydown pada textbox dengan menambahkan kode : KeyDown=”ReadKey”  diantara “<TextBox” hingga “/>”. Kemudian klik kanan pada KeyDown=”ReadKey” dan pilih “Navigate to Event Handler”.

Setelah kalian melakukannya tampilan pada layar kalian akan seperti ini :

Lalu tambahkan kode seperti berikut di dalam void ReadKey :

if (e.Key == Windows.System.VirtualKey.Enter)
{
try
{
petaImage.Source = new Windows.UI.Xaml.Media.Imaging.BitmapImage(new Uri(“http://maps.googleapis.com/maps/api/staticmap?center=&#8221; + petaTxtBox.Text + “&zoom=13&size=600×600&maptype=hybrid&sensor=false”));
}
catch
{
petaTxtBox.Text = “Periksalah koneksi internet anda!”;
}
}

Disini kalian dapat melihat bagian “if (e.Key == Windows.System.VirtualKey.Enter)” adalah kondisi untuk membaca inputan key Enter.

Bagian “petaImage.Source = new Windows.UI.Xaml.Media.Imaging.BitmapImage” adalah statement untuk mengisi Image yg bernama petaImage dengan BitmapImage yang berasal dari alamat Url maps.googleapis.com.

Tampilan kalian seharusnya sekarang menjadi seperti ini :

 

 

Jalankan Aplikasi

Sekarang waktunya menjalankan aplikasi! Run project AplikasiCariPeta kalian. Lalu ketikkan nama kota/negara dalam textbox dan tekan Enter.

Maka Taraa~~ peta dari tempat yang anda ketikkan muncul setelah beberapa saat aplikasi anda mengunggu respon dari server.