Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Corona SDK
Code

Corona SDK: Membuat Game Keseimbangan Ping-Pong

by
Difficulty:IntermediateLength:LongLanguages:

Indonesian (Bahasa Indonesia) translation by Dean Ramadhan (you can also view the original English article)

Dalam tutorial ini, saya akan menunjukkan kepada Anda cara membuat game keseimbangan di Corona SDK. Anda akan belajar lebih banyak tentang kontrol sentuh dan deteksi tabrakan tanpa fisika. Tujuan permainan ini adalah menjaga bola dari menyentuh lantai. Baca terus.


1. Ikhtisar Aplikasi

App Overview

Menggunakan grafik yang sudah jadi, kami akan membuat game menghibur menggunakan Lua dan Corona SDK API. Pemain akan dapat memindahkan tongkat ping-pong di layar untuk memukul bola. Anda dapat memodifikasi parameter dalam kode untuk menyesuaikan game.


2. Target Perangkat 

Target Device

Hal pertama yang perlu kita lakukan adalah memilih platform tempat kita ingin menjalankan aplikasi kita sehingga kita dapat memilih ukuran gambar yang akan kita gunakan.

Platform iOS memiliki persyaratan berikut:

  • iPad 1/2/Mini: 1024px x 768px, 132 ppi
  • iPad Retina: 2048px x 1536px, 264 ppi
  • iPhone/iPod Touch: 320px x 480px, 163 ppi
  • iPhone/iPod Retina: 960px x 640px, 326 ppi
  • iPhone 5/iPod Touch: 1136px x 640px, 326 ppi

Karena Android adalah platform terbuka, ada banyak perangkat dan resolusi yang berbeda. Beberapa karakteristik layar yang lebih umum adalah:

  • Asus Nexus 7 Tablet: 800px x 1280px, 216 ppi
  • Motorola Droid X: 854px x 480px, 228 ppi
  • Samsung Galaxy SIII: 720px x 1280px, 306 ppi

Dalam tutorial ini, kita akan fokus pada platform iOS dalam hal grafis. Secara khusus, kami akan mengembangkan untuk iPhone dan iPod touch. Namun, kode tutorial ini juga dapat digunakan jika Anda menargetkan platform Android.


3. Antarmuka

Interface

Kami akan menggunakan antarmuka pengguna sederhana yang melibatkan banyak bentuk, tombol, bitmap, dan lainnya. Grafik yang akan kami gunakan untuk tutorial ini dapat ditemukan di proyek yang disertakan dengan tutorial ini.


4. Ekspor Grafik

Export Graphics

Tergantung pada perangkat yang Anda pilih, Anda mungkin perlu mengkonversi gambar ke resolusi yang disarankan (ppi), yang dapat Anda lakukan di editor gambar favorit Anda. Saya menggunakan opsi Adjust Size... di menu tools di aplikasi Pratinjau di OS X. Ingatlah untuk memberi gambar nama deskriptif dan menyimpannya dalam folder proyek Anda.


5. Konfigurasi Aplikasi

Kami akan menggunakan file konfigurasi, config.lua, untuk membuat aplikasi menjadi layar penuh di seluruh perangkat. File konfigurasi menunjukkan ukuran layar asli dan metode yang digunakan untuk skala konten jika aplikasi dijalankan pada resolusi lain.


6. main.lua

Mari kita tulis aplikasi yang sebenarnya. Buka editor Lua pilihan Anda. Setiap editor teks biasa akan berfungsi, tetapi disarankan untuk menggunakan editor teks yang memiliki penyorotan sintaksis. Buat file baru dan simpan sebagai main.lua di folder proyek Anda.


7. Struktur Proyek

Kami akan menyusun kode kami seolah-olah itu sebuah kelas. Jika Anda terbiasa dengan ActionScript atau Java, Anda harus menemukan struktur proyek yang familier.


8. Sembunyikan Bilah Status

Snippet kode ini menyembunyikan bilah status. Bilah status adalah bilah di bagian atas layar perangkat yang menunjukkan waktu, sinyal, dan indikator lainnya.


9. Latar Belakang

Background

Latar belakang sederhana untuk antarmuka pengguna aplikasi. Snippet kode di bawah ini menggambar latar belakang ke layar.


10. Tampilan Judul

Title View

Ini adalah tampilan judul. Ini layar interaktif pertama yang muncul di game kami. Variabel-variabel ini menyimpan komponen-komponennya.


11. Tampilan Kredit

Credits View

Tampilan kredit menunjukkan kredit dan hak cipta aplikasi. Variabel ini digunakan untuk menyimpannya.


12. Pesan Instruksi

Instructions

Sebuah pesan dengan instruksi akan muncul di awal game dan akan menghilang setelah ketukan pertama.


13. Tongkat

Paddle

Ini adalah grafik untuk tongkat ping-pong. Ini akan ditempatkan di tengah tampilan.


14. Bola

Ball

Dan ini adalah grafik untuk bola ping-pong yang digunakan dalam game.


15. Peringatan

Alert

Peringatan ditampilkan ketika pemain kehilangan bola dan permainan berakhir. Ini menampilkan pesan dan mengakhiri permainan.


16. Suara

Sounds

Kami akan menggunakan efek suara untuk meningkatkan game. Suara yang digunakan dalam game ini dapat ditemukan di freesound, database kolaboratif suara Berlisensi Creative Commons .


17. Variabel

Snippet kode berikut menunjukkan variabel yang akan kami gunakan. Baca komentar untuk memahami untuk apa setiap variabel digunakan.


18. Mendeklarasikan Fungsi

Nyatakan semua fungsi sebagai local di awal.


19. Konstruktor

Selanjutnya, kita membuat fungsi yang akan menginisialisasi logika game.


20. Tambahkan Tampilan Judul

Kami mulai dengan menempatkan tampilan judul di stage dan memanggil fungsi yang akan menambahkan listener ketuk ke tombol.


21. Listener Tombol Mulai

Fungsi berikut menambahkan listener yang diperlukan ke tombol TitleView.


22. Menampilkan Kredit

Layar kredit ditampilkan ketika pengguna mengetuk tombol about. Listener tap ditambahkan ke tampilan kredit untuk menghilangkan ketika pengguna mengetuknya.


23. Menyembunyikan kredit

Ketika pengguna mengetuk tampilan kredit, itu akan keluar dari stage dan dihapus.


24. Tampilkan Tampilan Game

Ketika tombol putar diketuk, tampilan judul dianimasikan dari layar dan tampilan permainan diperlihatkan. Ada sejumlah bagian yang bergerak sehingga kita akan melihat lebih dekat pada masing-masing bagian tersebut.


25. Pesan Instruksi

Kode snippet berikut menambahkan pesan instruksi.


26. Bagian Tongkat

Selanjutnya, kami menambahkan bagian tongkat. Ini dibagi menjadi dua bagian untuk deteksi tabrakan yang lebih baik.


27. Bola

Kami menambahkan bola dan mengatur skalanya.


28. Skor

Kami membuat bidang teks skor di kanan atas stage.


29. Listener Game

Fungsi berikut menambahkan listener yang diperlukan untuk memulai logika game.


30. Fungsi Mulai 

Fungsi startGame menghapus pesan instruksi dan menambahkan listener ke fungsi utama game. Dalam fungsinya, posisi acak y dipilih dari tabel yang dibuat sebelumnya dan selanjutnya menambahkan physic ke objek yang baru dibuat. Kami menambahkan listener tabrakan ke setiap musuh dan juga menambahkannya ke tabel musuh.


31. Tes Objek Benturan

Untuk deteksi tabrakan tanpa menggunakan physic, kami menggunakan fungsi yang hebat, yang dapat Anda temukan di situs web Corona Labs Code Exchange.


32. Menskalakan Bola

Fungsi update, yang ditunjukkan di bawah, dijalankan setiap frame. Dalam fungsi ini, pertama-tama kita membuat skala bola berdasarkan nilai yang ditetapkan oleh variabel.


33. Membesarkan Bola

Bagian ini meningkatkan ukuran bola untuk mensimulasikan peningkatan tingginya.


34. Menghilangkan Bola

Metode yang sama digunakan untuk memeriksa apakah bola telah menyentuh lantai, aspek penting dari game.


35. Menggerakan Ball

Dalam snippet kode berikut, kami menggerakan bola. Berdasarkan nilai variabel, itu dipindahkan ke atas atau ke bawah.


36. Memukul Bola

Skala diatur ke tinggi tongkat yang sama, yang berarti bahwa bola telah menyentuh tongkat. Kami kemudian meningkatkan skor dan memainkan suara untuk memberikan umpan balik kepada pengguna.


37. Ubah Arah Bola

Tongkat dibagi dalam empat bagian, kiri atas, kanan atas, kiri bawah, dan kanan bawah. Setiap bagian menggerakkan bola ke arah yang berbeda.


38. Memindahkan Tongkat

Fungsi movePaddle menangani pergerakan tongkat menggunakan kontrol sentuh.


39. Peringatan

Fungsi alert menciptakan tampilan peringatan. Fungsi ini menghidupkan tampilan peringatan ke layar dan mengakhiri game.


40. Memanggil Fungsi Main

Untuk memulai game, fungsi Main perlu dipanggil. Dengan sisa kode yang ada, kita melakukannya di sini.


41. Layar Loading

Loading Screen

Pada platform iOS, file bernama Default.png ditampilkan saat aplikasi diluncurkan. Tambahkan gambar ini ke folder sumber proyek Anda, itu akan secara otomatis ditambahkan oleh kompiler Corona.


42. ikon

Icon

Menggunakan grafik yang Anda buat sebelumnya, sekarang Anda dapat membuat ikon yang bagus. Dimensi ukuran ikon untuk iPhone non-retina adalah 57px x 57px, sedangkan versi retina harus 114px x 114px. Artwork untuk iTunes harus berukuran 1024px x 1024px. Saya sarankan untuk membuat artwork iTunes terlebih dahulu dan kemudian membuat gambar berukuran lebih kecil dengan meningkatkan skala artwork iTunes ke dimensi yang benar. Tidak perlu membuat ikon aplikasi mengkilap atau menambahkan sudut bulat karena ini dilakukan oleh sistem operasi untuk Anda.


43. Pengujian dalam Simulator

Testing

Sudah waktunya untuk menguji aplikasi kita di simulator. Buka Simulator Corona, browse ke folder proyek Anda, dan klik Open. Jika semuanya berjalan seperti yang diharapkan, Anda siap untuk langkah terakhir.


44. Membangun Proyek

Build

Di Simulator Corona, buka File > Build dan pilih perangkat target. Isi bidang yang diperlukan dan klik Build. Tunggu beberapa detik dan aplikasi Anda siap untuk diuji pada perangkat dan/atau dikirim untuk didistribusikan.


Kesimpulan

Dalam tutorial ini, kami telah belajar tentang listener sentuh, dan deteksi tabrakan. Eksperimen dengan hasil akhir dan cobalah untuk memodifikasi game untuk membuat versi game Anda sendiri. Saya harap Anda menyukai tutorial ini dan bermanfaat. Terima kasih telah membaca.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.