Rabu, 30 Juli 2014

Windows 8 App: Macam-macam Error saat pengembangan Aplikasi

Selama proses pembuatan aplikasi Windows 8 dengan menggunakan Visual Studio 2012, sampai proses sertifikasi di Windows Store saya menemui beberapa error. Ini mungkin saja terjadi pada teman-teman juga, untuk itu akan saya bagikan pengalaman saya saat menemui error beserta solusinya. Berikut ini adalah daftar error dan solusinya:

1. Tidak bisa Install Windows License Developer
Pada saat pertama kali menggunakan Visual Studio, maka Visual Studio akan meminta License Developer (Jika kita ingin mengembangkan aplikasi Windows 8-style UI). Lisensi ini dapat diperoleh secara gratis, pastikan Anda terhubung dengan internet kemudian masukkan akun Windows Live Anda dan lisensi pun akan di dapatkan. Namun mungkin saja Anda mengalami error seperti di bawah ini:



Ada beberapa kemungkinan penyebabnya antara lain:
- Koneksi komputer Anda bermasalah pada Firewall / Proxy. Solusinya adalah dengan mereset koneksi komputer Anda, yaitu non-aktifkan firewall dan hilangkan setting proxy-nya. Lalu coba  lagi meng-install Developer License kembali.

- Kemungkinan selanjutnya adalah Anda menggunakan Crack untuk melisensi/aktivasi Windows 8 Anda (ini yang terjadi pada saya beberapa waktu lalu :P :malus). Kalau bisa hilangkan crack yang terinstal dan kembalikan Windows ke Trial Mode. Kalau tidak memungkinkan, install ulang Windows Anda dan biarkan dalam keadaan Trial (Windows 8 bisa didapatkan di situs Microsoft dengan masa trial 90 hari).

2. Windows App Certification Kit Error.
Ketika kita akan men-submit aplikasi Windows 8 kita Windows Store, kita harus melalui beberapa proses. Nah, ada proses dimana akan dilakukan uji kelayakan program kita pada komputer lokal. Pengujian ini dilakukan oleh software Windows App Certification Kit atau disingkat WACK. WACK mungkin saja mengalami error seperti di bawah ini:


Banyak yang menyatakan bahwa Error Warning tersebut adalah bug WACK versi 2.x yang di-instal Windows 8 RT. Solusinya sederhana, Anda hanya perlu meng-update Windows SDK (karena paket instalasi WACK termasuk dalam paketnya), atau meng-install WACK-nya saja, WACK yang perlu di-install adalah yang versi 3.3.

Sekian sharing kali ini, semoga bermanfaat. :D jika teman-teman menemui tipe error yang lain bisa saling sharing di sini.

Windows 8 App: Menambahkan Privacy Policy

Fitur Privacy Policy merupakan salah satu syarat wajib agar aplikasi lolos proses sertifikasi di Windows Store. Privacy Policy ini bisa disisipkan pada paket program kita maupun menyediakan link menuju Privacy Policy yang kita letakkan di web. Pada tutorial kali ini kita akan membahas bagaimana menyisipkan link Privacy Policy di program kita. Langkah-langkahnya adalah sebagai berikut:

1. Buka file App.xaml.cs dengan cara klik 2 kali filenya yang terletak di panel Solutions.

2. Tambahkan statement using berikut ini:

    using Windows.UI.ApplicationSettings;

3. Kemudian masukkan Link Privacy Policy ke dalam Setting Charm, dengan menambahkan fungsi berikut ini

    private void DisplayPrivacyPolicy(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args)
        {
            SettingsCommand privacyPolicyCommand = new SettingsCommand("privacyPolicy", "Privacy Policy", (uiCommand) => { LaunchPrivacyPolicyUrl(); });
            args.Request.ApplicationCommands.Add(privacyPolicyCommand);
        }


di dalam Class App berikut ini:

    sealed partial class App : Application
    {
        //letakkan kode di sini
    }


4. Tambahkan fungsi untuk membuka Link menuju web Privacy Policy milik kita (letakkan di dalam Class App juga).

    async void LaunchPrivacyPolicyUrl()
        {
            Uri privacyPolicyUrl = new Uri("http://Website-Kamu/");
            var result = await Windows.System.Launcher.LaunchUriAsync(privacyPolicyUrl);
        }


5. Tambahkan kode berikut ini pada method OnLaunched() , agar fungsi DisplayPrivacyPolicy dijalankan saat aplikasi dibuka.

    SettingsPane.GetForCurrentView().CommandsRequested += DisplayPrivacyPolicy;


6. Jalankan aplikasi dengan menekan tombol F5. Untuk membuka Privacy Policy, buka Setting Charm lalu klik Privacy Policy. atau menggunakan shortcut "Windows + i".


Selamat mencoba, semoga bermanfaat.

Windows 8 App: Memasukkan Splash Screen dan Logo

Salah satu kelengkapan dan merupakan syarat diterimanya aplikasi Windows 8 di Windows Store adalah Splash Screen dan logo. Desainnya diusahakan menarik, karena merupakan identitas program kita. Tidak sembarang gambar bisa digunakan, format gambar yang didukung adalah .PNG. Berikut ini adalah macam-macam ukuran/resolusi logonya:

- SplashScreen.png (620 x 300 px)

- Logo.png (150 x 150 px)


- StoreLogo.png (50 x 50 px)


- SmallLogo.png (30 x 30 px)


- WideLogo.png (310 x 150 px)

Untuk pengaturan Splash Screen dan Logo-logo tersebut, file yang kita edit adalah Package.appxmanifest. langkah-langkanya adalah:

1. Buka folder Assets yang ada pada panel Solutions. Hapus logo defaultnya.
2. Masukkan file logo ke folder Assets. Klik kanan > Add > Existing Item > Browse Filenya dan klik Open.

3. Buka file Package.appxmanifest pilih tab Application UI.

4. Masukkan Splash Screen dan Logo pada kolom yang telah disediakan. Gambar yang dimasukkan harus benar-benar sesuai ukurannya, jika tidak maka akan muncul tanda silang berwarna merah.

Atau Anda tidak perlu memasukkan gambar satu-persatu, syaratnya adalah nama gambarnya sesuai dengan yang saya telah tulis di atas.

Note: Pada saat pembuatan Splash Screen, catat warna background dalam kode hexadecimal-nya, karena pada saat menentukan warna bacground Splash Screen kita menggunakan format hexadecimal.

5. Jalankan aplikasi dengan menekan tombol F5. dan kita akan melihat logo kita pada Splash Screen dan juga pada icon yang ada di Start Menu.




Sekian tutorial kali ini, semoga bermanfaat.

Windows 8 App: Menggunakan Scroll Viewer (menambahkan fitur scroll)


Pada kesempatan kali ini saya akan berbagi bagaimana cara menggunakan Scroll Viewer. Ini merupakan hasil dari coba-coba saya kemarin, dan mungkin ada tutorial lain yang lebih efektif dalam hal pengaplikasian Scroll Viewer ini. Meski sederhana, namun postingan kali ini masih bisa dijadikan salah satu referensi T_T :D

Sesuai dengan namanya, Scroll Viewer ini berguna untuk menambahkan fitur scroll pada halaman program jika isi/konten-nya memiliki panjang melebihi batas layar. Baiklah, berikut adalah cara menambahkan Scroll Viewer:

1. Buat Project baru. File > New > Project. Pada jendela baru yang terbuka pilih: Visual C# > Windows Store > Blank App.

2. Lihat pada panel Toolbox, drag and drop Scroll Viewer.

3. Untuk menambahkan item-item yang akan dimasukkan dalam layar scrol, cukup meletakkan kode dari masing-masing item ke dalam tag Scroll Viewer, seperti di bawah ini:

Kita juga men-drag and drop item ke Scroll Viewer, namun kita akan kesulitan menggeser itemnya ke bawah.

4. Sebelum mengisi item, kita tambahkan dulu Canvas ke dalam Scroll Viewer. Mengapa demikian? Karena jika langsung menambahkan item, maka item pertama akan tertumpuk dan hilang. Telah saya coba dengan memasukkan Text Block, kemudian saya tambahkan button dan ternyata Text Block nya menghilang.

5. Atur lebar Canvas agar selebar Scroll Viewer, dan tentukan panjangnya sesuai kebutuhan, karena kita akan membuat scrol yang ke arah bawah.

6. Tambahkan item-itemnya, hal yang perlu diperhatikan adalah item harus diletakkan di dalam tag Canvas agar posisi item nantinya berada di atas Canvas (ibarat lukisan, item-item tersebut adalah cat yang digoreskan di atas Canvas, ceilee.. :D). Kurang lebih seperti tampak pada gambar di bawah ini:

7. Jalankan aplikasi dengan menekan tombol F5 dan lihat hasilnya. Berikut adalah salah satu aplikasi saya yang memakai Scroll Viewer:



Sekian tutorial sederhana kali ini, semoga bermanfaat. Jika ada pertanyaan silakan tulis di kolom komentar.

Selasa, 29 Juli 2014

Windows 8 App : Tombol untuk memainkan suara/video

Setelah sebelumnya kita sudah belajar bagaimana menambahkan media suara/video ke Aplikasi, sekarang kita akan belajar bagaimana cara memainkan media dengan menggunakan tombol. Baiklah berikut adalah langkah-langkahnya:

1. Tambahkan MediaElement ke halaman aplikasi kita, jika anda belum tahu bagaimana caranya silakan lihat di link posting berikut ini: Menambahkan MediaElement ke Aplikasi.

2. Berikan nama pada MediaElement misalnya "PlaySound", bisa lewat panel Properties :

 

atau langsung menulisnya pada baris kode MediaElement:



3. Tambahkan sebuah tombol lalu berikan event Click, caranya adalah dengan klik 2 kali pada tombol/klik 2 kali pada kolom event Click yang ada pada panel Properties.

Letakkan sintaks berikut ini dalam event Click:

4. Jalankan aplikasi dengan menekan tombol F5. Kita bisa play dan pause media dengan menekan tombol tersebut.

Sekian tutorial kali ini, semoga bermanfaat. Jika ada pertanyaan silakan tulis di kolom komentar.

Menambahkan Suara/Video ke Aplikasi Windows 8

Terkadang untuk melengkapi fitur pada program yang akan kita, maka kita tambahkan media suara maupun video. Kali ini kita akan membahas bagaimana memasukkan suara/video ke program yang kita buat. Berikut adalah langkah-langkahnya:

1. Buat Project baru. File > New > Project. Pada jendela baru yang terbuka pilih: Visual C# > Windows Store > Blank App (XAML).
2. Tambahkan media (file suara/video) yang akan dipakai ke projek, yaitu dengan mengklik kanan folder Assets pada Solution Manager > Add > Existing Item > Browse File dan Klik Open.

Dengan begini file telah ada di projek kita.

3. Kembali ke halaman MainPage.xaml. Tambahkan MediaElement dengan cara Drag and Drop MediaElement yang ada di Toolbox.

4. Seleksi MediaElement, kemudian lihat pada panel Properties > Media > Source > Pilih media yang akan dipakai.

5. Jalankan aplikasi dengan menekan tombol F5, maka saat aplikasi terbuka media akan secara otomatis dimainkan.

Untuk menambahkan video caranya sama seperti di atas. Selamat mencoba.

Membuat tombol navigasi Aplikasi Windows 8

Pertama kali saya membuat aplikasi windows 8, saya sempat bingung bagaimana cara berpindah dari 1 halaman ke halaman lain. Akhirnya setelah beberapa lama mencari ketemulah solusinya, dan ternyata sangat sederhana hehe. Agar teman-teman tidak kesusahan seperti saya dulu, maka kali ini akan saya sajikan bagaimana cara membuat tombol untuk berpindah halaman pada bahasa XAML. Berikut adalah langkah-langkahnya:

1. Buatlah project baru.  File > New > Project. Pada jendela baru yang terbuka pilih: Visual C# > Windows Store > Blank App (XAML).
2. Tambahkan halaman baru di project kita. Project > Add New Item > Visual C# > Windows Store > Basic Page.

3. Tambahkan sebuah tombol pada halaman utama (MainPage.xaml), berikan event Click lalu masukkan kode berikut ini:


4. Uji navigasi tombol tersebut. Jalankan aplikasi dengan menekan tombol f5. Klik tombol navigasi maka halaman kedua akan terbuka.

Nah, sekian tutorial kali ini semoga bermanfaat. :)

Membuat aplikasi Kalkulator sederhana di Windows 8

Kali ini kita akan mencoba membuat sebuah kalkulator yang sederhana, meski sederhana namun konsep yang ada bisa kita kembangkan untuk membuat kalkulator yang lebih kompleks. Operasi yang akan kita berikan hanyalah penjumlahan dari 2 angka. Baiklah mari kita mulai, berikut adalah langkah-langkahnya:

1. Buat Project baru. File > New > Project.
2. Pada jendela baru yang terbuka pilih: Visual C# > Windows Store > Blank App (XAML).
beri nama terserah, misalnya Calculator. Kemudian klik OK.

3. Buka MainPage.XAML, caranya klik 2 kali file MainPage.XAML yang ada pada Solution Explorer.

4. Tambahkan 2 Text Box untuk menampung inputan, 1 Text Block untuk tanda +, 1 Button untuk tombol =, 1 Text Block untuk menampilkan hasil.
Berikan penamaan seperti di bawah ini (untuk penamaan bisa melalui panel Properties yang terletak di bawah Solution Explorer):
- Text Box 1 --> input1
- Text Box 2 --> input2
- Button --> hitung
- Text Block 2 --> hasil
Susun item-item tersebut sesuka hati, berikut contoh penyusunannya:



5. Berikan event Click pada tombol hitung (klik 2 kali tombol sampai masuk pada sintaks MainPage.xaml.cs), kemudian tambahkan kode berikut ini:


Note: dapat dilihat terdapat kode fungsi Convert.ToString() dan Convert.ToInt32(). keduanya adalah fungsi yang merubah tipe data. Alurnya adalah:
- Data dari Text Box 1 dan Text Box 2 yang semula bertipe String, dikonversi menjadi Integer.
- Data Integer tersebut kemudian dijumlahkan.
- Hasil penjumlahan dikonversi menjadi tipe String kembali, sebelum di tampilkan di Text Block bernama hasil.
 6. Jalankan aplikasi dengan menekan tombol f5. dan berikut adalah hasilnya:


Cukup sederhana kan? Semoga bermanfaat. :) Apabila ada pertanyaan silakan tulis di kolom komentar.

Senin, 28 Juli 2014

Apa itu Microsoft Student Partner (MSP)?

Sebagai langkah untuk memberikan edukasi pada mahasiswa seputar teknologi Microsoft, maka Microsoft membuat sebuah komunitas mahasiswa yang dinamakan MSP (Microsoft Student Partner). MSP adalah perwakilan Microsoft di kampus-kampus yang ada seluruh dunia. MSP akan menjadi penyebar informasi tentang teknologi terbaru dari Microsoft, karena MSP adalah orang pertama yang paling tahu tentang perkembangan teknologi Microsoft (setidaknya di lingkungan mahasiswa).


Para MSP sendiri adalah mereka-mereka yang memiliki minat tinggi terhadap teknologi, dan memiliki keinginan untuk berbagi tentang ilmu yang mereka dapat. MSP bertugas untuk menyebarkan pengetahuan yang telah mereka pelajari kepada lingkungan kampusnya, baik lewat blog atau media lain.

Banyak keuntungan yang akan didapatkan oleh seorang MSP, antara lain:
  1. Dibekali dengan bermacam software dan tools dari Microsoft yang semuanya adalah gratis (nah ini yang ane cari-cari :D). Pengalaman saya sendiri, setelah melewati tahap interview (belum resmi menjadi MSP, masih ada 1 tahap lagi yaitu pembuatan aplikasi) maka saya bisa mengakses Dreamspark (yaitu tempat download software-software tersebut). Lumayan, B) mimpi mendapatkan Windows Ori akhirnya terwujud. :D
  2. Mendapatkan pelatihan dari para pakar Microsoft.
  3. Bertemu dengan para mahasiswa yang memiliki hobi yang sama dengan kita (yaitu di bidang pengembangan teknologi). Kita bisa saling berbagi pengetahuan dan membentuk relasi tentunya :D.
  4. Penguasaan terhadap teknologi Microsoft, yang harapannya akan menginspirasi teman-teman di sekitar kita.
  5. Menjadi pakar teknologi Microsoft di kampus kita masing-masing. B)
  6. Membentuk relasi atau jaringan dengan para ahli di bidang Industri (lumayan buat prospek karir masa depan) dan mendapatkan pengalaman yang sangat bernilai serta berkesan.

Bagaimana menarik sekali kan? Maka dari itu segera daftarkan diri kamu saat ada perekrutan di kampus kamu. Syarat-syaratnya tidak sulit kok, asalkan kamu mahasiswa aktif (semester 3-4) dan memiliki passion tinggi terhadap teknologi dan keinginan untuk berbagi pengetahuan. Prosesnya juga sederhana, pertama kita isi Form pendaftaran, lalu kita masuk tahap interview, jika lolos kita masuk ke tahap ke tiga yaitu pembuatan aplikasi, dan jika kamu lolos tahap ketiga maka kamu resmi jadi MSP. Sekian informasi dari saya, meskipun singkat saya harap bisa bermanfaat bagi teman-teman semua.

Membuat Aplikasi Windows 8 sederhana

Di awal mula belajar Bahasa pemrograman, biasanya kita membuat aplikasi Hello World terlebih dahulu. Nah pada kesempatan kali ini kita akan membahas bagaimana membuat aplikasi sederhana yang isinya adalah pengembangan dari aplikasi Hello World yang biasa. Sebelum memulai, siapkan dahulu software Visual Studio, karena kita membuat apikasi Windows 8, maka versi minimumnya adalah Visual Studio 2012. Visual Studio sebenarnya adalah software berbayar, namun kita bisa memakai versi Express yang merupakan versi gratis (bisa di unduh di link ini). Setelah VS 2012 (atau yang lebih baru) sudah terinstal, mari kita mulai. Langkah-langkahnya adalah:

1. Buat sebuah projek baru dengan klik: File > New > Project.

2. Pada jendela baru yang terbuka pilih: Visual C# > Windows Store > Blank App (XAML). Berikan nama “Hello” untuk nama projeck kita. Klik OK.

3. Kita akan masuk pada halaman projek kita, pertama yang kita lihat adalah sintaks dari file App.xaml.cs.

Untuk melihat tampilan GUI (Graphical User Interface) dari program kita klik “MainPage.xaml” yang ada di panel Properties.

4. Kemudian buka panel Toolbox, dan tambahkan 2 Text Block, 1 Text Box, dan 1 Button (kita tinggal men-Drag-and-Drop item yang ingin kita tambahkan).

 Susun seperti gambar di bawah ini.

Setiap kita menambahkan item baru maka akan kode sintaks akan secara otomatis ter-generate.

5. Berikan nama untuk masing-masing item, caranya adalah dengan mengklik item tersebut lalu pada panel Properties, isikan nama item tersebut pada kolom Name. lebih jelasnya lihat gambar di bawah ini:

Untuk penamaan item, atur seperti di bawah ini:
Text Box : inputNamaButton : Button_1
Text Block 2 : outputNama
Berikut adalah kode lengkapnya:
Note: pada panel Properties ini kita juga bisa mengatur tipe dan besar font, warna item, opacity, dll. Silakan dieksplorasi sendiri.

6. Klik Button_1, kemudian masuk ke panel Properties. Klik ikon petir, lali kita tambahkan event pada saat Button_1 di klik. Pada kolom Click berikan nama Button_1_click (bisa kita berikan nama apa saja). Kemudian Klik 2 kali kolom tersebut (bisa juga dengan meng-klik 2 kali pada button yang ada di tampilan GUI).


7. Kita akan masuk ke sintaks App.xaml.cs. lalu tambahkan kode di bawah ini:

8. Nah, sekarang kita uji aplikasi yang barusan kita buat. Ada tiga pilihan dalam menjalankan aplikasi kita.

Simulator : Aplikasi kita akan dijalankan pada emulator windows 8. Dengan simulator ini kita bisa melakukan aksi layaknya windows yang diinstal di sebuah tab (pendapat ane sendiri sih :D).
Local Machine : Aplikasi akan dijalankan di komputer kita, saya sarankan untuk memakai pilihan ini karena komputer tidak akan terbebani dengan membuka simulator.

9. Nah tampilan akhir dari program kita adalah seperti di bawah ini:
Masukkan nama pada Text box dan tekan tombol “Say Hello”.


Selamat mencoba, jika ada pertanyaan silakan tulis di kolom komentar.