Ronald Rajagukguk

Hello World from My Red Zune....

Akhirnya setelah penantian yang lama, saya pun memiliki sebuah Zune Merah merona berkapasitas 4 GB. Yup Zune yang mirip IPod itu loh, he2x setelah dapet tentunya tangan ini udah jail pengen oprek2x. Yang pertama kali diperhatikan adalah kualitas suaranya, wah dipadukan dengan Sennheiser PX100 ternyata memang suaranya maknyus, setelah itu... (loh? kok jadi bahas produk..)

Okeh inti dari posting ini adalah Zune Merah baru saya ini ingin mengucapkan Hello World kepada dunia. Caranya gimana? caranya adalah dia meminta kepada saya sang pemilik untuk membuat sebuah program sederhana dengan XNA Game Studio 3.0 (masih CTP). Program yang dia minta simple aja yaitu ingin menuliskan tulisan Hello World dilayar beserta dengan foto sang pemilik yang disinyalir memiliki tampang ganteng.

Okeh karena gak tega kalo gak permintaannya gak dipenuhin maka langsung aja saya mengunduh XNA Game Studio 3.0 disini. awalnya sempet bingung karena VS 2005 udah gak ada lagi di laptop ini, tapi tenang XNA yang 3.0 ini udah support semua edisi VS, bahkan Team System yang saya pakai pun sudah didukung. Mantab!!!! Okeh beres mengunduh langsung install dan tanpa basa basi buka VS 2008.

eng..ing...eng...

di wizard New Project sudah terpampang dengan manis template project untuk Zune seperti gambar dibawah ini.

okeh langsung dengan sigap saya bikin sebuah project baru dengan tipe Zune Game (3.0) dengan nama ZuneGame yang memiliki 2 tujuan yaitu menulis Hello World dan menampilkan gambar. Sehingga tentunya kita perlu menginisialisasi SpriteBatch (buat nampilin gambar) dan SpriteFont  (buat nampilin tulisan). Bingung dengan dua kelas tersebut? tenang nanti ada encik Shieny dan pak cik Arief yang mungkin akan banyak bahas soal XNA. Okeh inisalisasinya cukup simpel seperti dibawah ini :

1. Buka Game1.cs.

2. Tuliskan deklarasi 4 field dibawah ini :

Texture2D SpriteTexture;
Rectangle PictureLocation;
Vector2 TextLocation;
SpriteFont spriteFont;
internal const string DISPLAYED_TEXT = "Hello World";

3. Masukkan gambar kedalam project, caranya cukup mudah saya hanya perlu menarik gambar yang saya inginkan ke directory Content yang ada pada solution. sehingga tampilannya menjadi seperti gambar dibawah. XNA Game Studio akan secara otomatis mengkonversikan gambar tersebut ke format XNB .

4. Masukkan definisi Font. XNA memiliki cara yang berbeda untuk urusan penulisan tulisan ke layar. para developer harus seolah-olah mengimpor font tersebut untuk dapat digunakan. Caranya cukup mudah seperti instruksi dibawah ini :

1. Klik kanan pada Directory Content.

2. Pilih Add > New Item

3. Pilih Sprite Font dan beri nama Font.spriteFont, jika sudah tekan OK.

4. sebuah file XML yang mendefinisikan font mana yang akan "diimport" ke game kita. Karena saya ingin agar fontnya bertipe arial dan ukurannya 20 maka perlu dilakukan modifikasi.

5. Cari elemen dengan nama "FontName" dan isikan Arial sebagai nilainya

6. Cari elemen dengan nama "Size" dan isikan 20 sebagai nilainya.

5. Setelah gambar dan font siap maka pada fungsi LoadContent tambahkan beberapa baris kode sehingga hasil akhirnya sebagai berikut

   1: SpriteTexture = Content.Load<Texture2D>("untitledgtg");

   2: spriteFont = Content.Load<SpriteFont>("Font");

   3:  

   4: Vector2 stringLength = spriteFont.MeasureString(DISPLAYED_TEXT);

   5: TextLocation.X = (GraphicsDevice.Viewport.Width - stringLength.X) / 2;

   6: PictureLocation = new Rectangle(

   7:     0,

   8:     Convert.ToInt32(stringLength.Y),

   9:     GraphicsDevice.Viewport.Width,

  10:     Convert.ToInt32(GraphicsDevice.Viewport.Height - stringLength.Y)

  11:   );

Okeh sedikit penjelasan soal langkah kelima. Kode di baris 1 akam mengambil gambar dengan nama untitledgtg kemudian kode pada baris ke-2 akan mengambil definisi font yang akan digunakan untuk menulis di layar. baris-baris berikutnya adalah pengisian nilai lokasi penggambaran gambar dan penulisan font.

6. Sekarang adalah saatnya dilakukan penulisa kode untuk menampilkan gambar dan font tersebut dilayar. Silahkan modifikasi fungsi Draw yang telah ada sehingga menjadi seperti berikut :

   1: protected override void Draw(GameTime gameTime)

   2: {

   3:     graphics.GraphicsDevice.Clear(Color.Blue);

   4:     spriteBatch.Begin();           

   5:     spriteBatch.Draw(SpriteTexture, PictureLocation, Color.White);

   6:     spriteBatch.DrawString(spriteFont, DISPLAYED_TEXT,TextLocation, Color.Red);

   7:     spriteBatch.End();

   8:     base.Draw(gameTime);

   9: }

Sedikit penjelasan tentang kode diatas. Kode diatas akan menampilkan gambar dengan memanfaatkan objek dari kelas SpriteBatch. Singkatnya guna dari kelas SpriteBatch adalah untuk menggambarkan gambar2D dan tulisan ke layar. Untuk memulai penggambaran maka tentunya harus diawali dengan fungsi Begin yang akan mempersiapkan device untuk digambar dan diakhiri dengan End yang akan menampilkan gambar tersebut di layar. baris ke 5 akan menampilkan gambar dilayar dan barus ke 6 akan menuliskan "Hello World"

7. Pada tahapan ini kita telah siap untuk menjalankan aplikasi ini. Namun sebagai catatan pada CTP ini XNA Game Studio 3.0 TIDAK menyediakan emulator untuk Zune, sehingga mau tidak mau untuk menguji aplikasi ini kita perlu melakukan koneksi ke Zune. caranya cukup mudah seperti langkah dibawah ini :

1. Koneksikan Zune ke PC.

2. Jalankan XNA Game Studio  Device Center, pada visual studio ada di toolbox bagian atas.

3. Pilih Add Device

4. Pilih Zune

5. Kemudian pilih Zune yang ada, lalu tekan Next.

5. Jendela konfirmasi bahwa Zune telah terkoneksi akan muncul, silahkan tekan Finish.

6. Tutup XNA Game Studio  Device Center dan kembali ke Visual Studio 2008.

8. Sekarang karena semua kode dan koneksi pun telah ada, F5 pun ditekan untuk mendeploy aplikasi ini ke si Zune Merah. (jika Zune baru pertama kali dideploy game maka diawal2x akan ada beberapa DLL yang terlebih dahulu diinstall)

9. Zune Merah pun sekarang telah berhasil menampilkan "Hello World"  dan foto pemiliknya...

he2x sekarang Game untuk Zune belum terlalu banyak, jadi mungkin dalam 1-2 bulan ini saya akan mengembangkan game simpel2x aja kayak snake. Ntar kalo udah jadi saya janji deh untuk menguploadnya di blog ini. Manteb ya Zune, selain bisa buat dengeri musik, radio dan nonton pelem ternyata bisa juga dicoding pake .NET (tapi kalo gak salah ipod juga ada SDKnya meskipun gak resmi, biasalah kayak hackinstosh gitu :d )

Cheers..

Share this post: | | | |