Pencarian Laluan Berdasarkan Grid

Dalam tutorial ini kita akan membuat simulasi pencarian jalur berdasarkan grid array 2-dimensi. Ini akan memberikan kita ide dasar dalam membuat kegiatan pencarian jalur untuk permainan kita. Kita akan memvisualisasikan grid menggunakan objek kotak kosong sebagai ubin dan objek bulat sebagai avatar kita yang dapat bergerak di area grid tersebut berdasarkan perintah kita.

I. Menyiapkan objek

Kita akan menggunakan hanya empat objek dalam proyek kita. Avatar hijau kita, ubin biru, penghalang putih, dan label grid untuk menyiapkan dan memvisualisasikan grid kita.

Avatar

Avatar kita adalah objek kosong yang memiliki skala x dan y sebesar 50%. Atur kolisinya menjadi bentuk bulat agar terlihat seperti yang ada di gambar di bawah. Objek ini akan memiliki tiga atribut yang sudah ditentukan sebelumnya: pada ubin, ubin sebelumnya, dan ubin target. Atur nilai default atribut ini ke nol agar mereka tidak memiliki nilai null saat kita mencoba untuk mengaksesnya nanti.

Objek Ubin

Buat objek kosong lainnya yang akan digunakan untuk memvisualisasikan ubin di grid kita. Skala ini juga 50% dan hanya memiliki satu atribut yang sudah ditentukan sebelumnya: pada ubin. Atur juga nilai ini ke nol.

Objek Penghalang

Buat objek kosong lainnya yang akan berfungsi sebagai penghalang di grid kita. Ini adalah objek kosong putih dengan skala 40%. Avatar kita tidak akan dapat melintasi ubin yang memiliki penghalang di atasnya.

Label Grid

Ini hanyalah sebuah label yang akan memiliki perilaku yang akan memungkinkan penyiapan dan visualisasi grid kita. Ini memiliki atribut yang sudah ditentukan: mulai x dengan nilai 4, dan mulai y dengan nilai 3. Nilai-nilai ini adalah offset yang akan digunakan sebagai referensi saat menghasilkan ubin kita untuk memposisikan grid kita dengan rapi di tengah.

Atribut yang telah ditentukan sebelumnya dari Avatar/Ubin:

Kita mendefinisikan ubin di sini sebagai array 2-dimensi yang akan memiliki nilai x dan y berdasarkan grid kita.

• pada ubin - ini adalah nilai ubin yang saat ini sedang kita duduki di grid kita
• ubin sebelumnya - ubin yang sebelumnya dilalui oleh avatar kita
• ubin target - ubin yang akan diikuti oleh avatar kita

II. Menyiapkan grid

Di dalam label grid adalah tempat kita akan mendefinisikan array 2D kita dan proses pembuatan grid kita. Ada 2 poin kunci utama dalam objek ini: mengatur array, dan memvisualisasikan array. Mari kita mulai dengan mengatur bundel array.

Atur array - bundel

Pertama adalah membuat array kosong bernama 'Grid'. Array ini akan berisi array 2 dimensi kita. Kita akan memiliki kotak kontainer bernama 'jumlah baris x' yang memiliki nilai 24 dan satu array kosong lainnya bernama 'baris y' yang memiliki 18 nilai kosong.

Perilaku pertama dalam bundel kita adalah sebuah loop dengan jumlah pengulangan sebanyak 'jumlah baris x'. Untuk setiap langkah dari loop ini, kita akan menambahkan sebuah baris y kosong ke array 'Grid'. Ini akan membuat array di dalam array dengan dimensi 24x18.

Perhatikan bahwa kita telah menghubungkan sebuah komentar yang tidak aktif di awal bundel kita untuk meniadakan eksekusi otomatis dari perilaku akar ini. Perilaku akar adalah perilaku yang tidak memicu berdasarkan peristiwa apa pun dan ditempatkan secara terbuka di antarmuka.

Visualisasikan grid - bundel

Hal utama yang akan kita lakukan di sini adalah menjelajahi setiap nilai dalam array 'Grid' kita dan menghasilkan objek ubin. Kita juga akan menambahkan kondisi di loop kita yang akan memungkinkan munculnya penghalang putih di atas objek ubin.

Yang pertama adalah untuk mendapatkan jumlah array dari array 'baris y', nilai atribut 'mulai x' dari objek ini dan 'mulai y'.

Buat sebuah loop yang memiliki jumlah pengulangan 'jumlah baris x' dan untuk setiap langkah dari loop ini, kita akan menambahkan nilai indeks dari loop itu dan nilai atribut 'mulai x'. Ini menghasilkan posisi x absolut yang akan kita gunakan untuk menempatkan ubin yang dihasilkan nanti. Selanjutnya adalah loop 'baris y' yang memiliki jumlah pengulangan 'jumlah baris y'. Untuk setiap langkah dari loop ini, kita akan menambahkan nilai indeks dari loop itu dan nilai atribut 'mulai y', yang sekarang akan menghasilkan posisi y absolut.

Setelah menambahkan nilai-nilai di bawah 'loop baris y' adalah untuk menghasilkan objek biru. Atur #objek yang hidup sebesar 999 karena kita akan membutuhkan banyak dari mereka untuk grid kita, dan juga dengan durasi 0. Kemudian pindahkan objek yang dihasilkan tersebut ke nilai x dari hasil 'tambah nilai' dari loop x, dan nilai y dari nilai 'tambah' pada loop y.

Selanjutnya adalah menambahkan array dengan 2 nilai kosong bernama 'Pada ubin' yang akan kita gunakan hanya sebagai placeholder array. Setelah memindahkan objek ubin adalah untuk memodifikasi array 'Pada ubin' dengan mengganti nilainya pada indeks 0 dengan nilai dari 'loop baris x'. Kemudian tambahkan modifikasi array lain yang, mengganti nilai pada indeks 1 dengan 'indeks baris y'. Ini adalah koordinat x dan y dari grid kita yang akan memiliki atribut 'pada ubin'.

Sekarang, atur atribut objek yang dihasilkan dengan kunci dinamis, 'pada ubin', dan dengan nilai dari 'Array Pada ubin'.

Masih, di bawah loop baris y, adalah kondisi untuk memunculkan objek penghalang putih. Kita akan memiliki 2 dari 5 peluang untuk menjalankan bundel ini yang akan menambah pengacakan grid kita. Kemudian kita akan menandai nilai 1 pada koordinat x dan y itu dalam array 'Grid' kita yang memberi tahu kita bahwa koordinat tersebut telah memiliki penghalang yang dihasilkan.

Yang pertama adalah untuk mendapatkan angka acak dari 1 hingga 5. Jika angka itu kurang dari atau sama dengan 2, kita akan menghasilkan penghalang. Atur objek #Hidupnya menjadi 999 dan pindahkan objek itu ke titik yang sama dengan ubin biru yang telah kita hasilkan sebelumnya, dan juga dengan durasi 0.

Selanjutnya adalah menyimpan informasi bahwa koordinat ini telah ditempati oleh penghalang, jika telah dihasilkan. Kita melakukan ini dengan menandai koordinat tersebut dengan nilai 1. Yang pertama adalah untuk mendapatkan nilai pada indeks 'loop baris x' dari array 'Grid'. Nilai ini akan memberikan kita sebuah array 'baris y'. Kita akan memodifikasi 'baris y' dengan mengganti nilainya pada indeks 'loop baris y' dengan nilai 1, yang merupakan nilai yang ditandai. Karena modifikasi nilai ini hanya berlaku pada nilai itu, dan bukan pada 'Grid' itu sendiri, kita masih harus memodifikasi array 'Grid'. Ganti nilai pada indeks 'loop baris x' dari array 'Grid' dengan nilai dari 'modifikasi baris y - array'.

Setelah selesai, itu harus menghasilkan bentuk seperti ini.

III. Saat Ubin Ditekan

Untuk bisa berinteraksi dengan grid itu sendiri, kita membutuhkan perilaku bundel setiap kali kita menekan ubin biru. Tekan pertama akan menghasilkan kemunculan avatar kita di grid kita, dan setiap tekanan berturut-turut setelah peristiwa tersebut akan memulai pencarian jalurnya.

Di dalam objek biru adalah bundel perilaku yang memiliki 3 poin utama: yaitu untuk mereset ubin sebelumnya dari avatar kita, mengatur ubin diatur/menetapkan ubin targetnya, lalu mengatur animasi warna untuk memvisualisasikan peristiwa sentuhan di layar.

Pertama adalah untuk mendapatkan atribut 'pada ubin' dari objek ubin. Atur atribut 'ubin sebelumnya' dari avatar kita ke 0. Avatar kita akan diatur untuk menghindari kembali ke 'ubin sebelumnya' yang jadi alasan kita mereset 'ubin sebelumnya' pada setiap tekanan ubin.

Selanjutnya adalah untuk mendapatkan atribut 'pada ubin' dari avatar kita. Kondisi if pertama adalah apakah nilai 'pada ubin' sama dengan nol. Ini berarti bahwa jika avatar belum muncul, maka ini akan menghasilkan true. Jika benar, kita akan mengatur atribut 'pada ubin' dengan nilai dari atribut 'pada ubin' objek ubin tersebut. Kemudian pindahkan posisi avatar kita dengan mendapatkan posisi dari objek ubin, mengarahkan nilai x dan ynya ke titik itu dengan durasi 0.

Jika nilai 'pada ubin' tidak sama dengan nol. kita akan mengatur atribut 'ubin target' dari avatar kita dengan nilai atribut 'pada ubin' objek ubin tersebut. Ini berarti avatar kita sudah berada di grid kita, dan kemudian kita bisa mengeksekusi bundel perilaku, 'temukan jalur'. Kita belum memiliki perilaku ini tetapi kita akan memperbaikinya lagi setelah menyelesaikan bagian tutorial yang lebih lanjut untuk bundel 'temukan jalur'.

Sekarang kita telah mengatur avatar kita dengan benar di grid kita, kita hanya perlu memvisualisasikan peristiwa tekan ini. Pertama adalah untuk memiliki perilaku root 'dapatkan warna' untuk mendapatkan warna aslinya. Kemudian setelah peristiwa tekan, kita akan mengatur warna objek ubin menjadi hitam dengan durasi 0, lalu mengatur warnanya kembali lagi ke nilai aslinya dengan durasi 0.2.

Menekan pada ubin biru seharusnya menghasilkan ini.

IV. Eksekusi Bundel Temukan Jalur

Untuk bagian terakhir dari tutorial kita ini, kita akan melakukan algoritma yang memungkinkan kita untuk menemukan ubin terdekat yang dapat diambil oleh avatar kita untuk mencapai tujuannya. Bundel ini akan dieksekusi secara berulang untuk setiap langkah ubin yang diambil avatar kita di grid.

Kita akan menyiapkan algoritma ini di dalam objek avatar kita dan memiliki tiga poin utama: menemukan ubin tetangga, menemukan ubin tetangga terdekat, dan bergerak ke ubin tetangga tersebut.

Menemukan ubin tetangga

Dalam bagian ini, kita akan mengumpulkan semua ubin tetangga yang dapat dilalui avatar kita. Kita akan memeriksa ubin tetangga empat arah dan melihat apakah ubin-ubin tersebut memiliki penghalang di atasnya atau jika sebelumnya telah dilalui.

Yang pertama adalah untuk menambahkan array 'Ubin Tetangga'. Sebuah array 'Arah' dengan 2 nilai kosong, dan empat array arah yang memiliki 2 nilai untuk masing-masing: N (0,1), S (0,-1), E (1,0), W(-1,0).

Perilaku pertama dalam bundel kita adalah untuk menghapus ubin tetangga kita. Karena kita akan melakukan bundel ini secara berulang, kita perlu mengatur ulang 'ubin tetangga' yang terkumpul setiap kali. Tiga perilaku berikutnya adalah modifikasi pada array 'Arah'. Kita mengatur array 'Arah' empat kali dengan empat array arah, lalu jalankan bundel di bawah. Kita melakukan ini untuk membuat loop dengan nilai array 'Arah' yang berbeda setiap kali.

Sekarang kita memiliki arah, kita hanya perlu menggabungkan nilai x dan y mereka dengan atribut 'pada ubin' dari avatar kita. Kemudian kita akan dapat mengambil nilai target di dalam array 'Grid' untuk mengetahui apakah ubin tersebut telah ditandai dengan penghalang.

'Arah x' adalah nilai dari array 'Arah' pada indeks 0, 'ambil pada ubin x' adalah nilai dari 'ambil pada ubin' pada indeks 0. Target x adalah penjumlahan nilai dari 'arah x' dan 'ambil pada ubin x'. Begitu juga untuk nilai y, tetapi dengan indeks target 1.

'Baris y target' adalah nilai array dari array 'Grid' pada indeks 'Target x'. Dan kemudian 'Indeks target dalam baris y' akan menjadi nilai array 'Baris y target' pada indeks 'Target y'. Itulah koordinat di dalam grid kita yang akan memberi tahu kita apakah telah ditandai dengan penghalang.

Jika nilai dalam 'Indeks target dalam baris y' adalah 1, maka ubin target tersebut telah ditandai sebagai terhalang. Tetapi jika nilainya tidak sama dengan 1, maka kita dapat melanjutkan dalam bundel kita.

Karenan Target x dan y telah melewati kondisi kita, kita telah menambahkan sebuah ubin kosong baru bernama 'Ubin Tetangga Baru'. Ini akan menyimpan nilai Target x dan y sebagai array ubin. Kita akan mengatur nilai Target x ke indeks 0 dari 'Ubin Tetangga Baru' dan Target y ke indeks 1.

Sekarang ambil atribut 'ubin sebelumnya' dari avatar kita. Jika 'ubin sebelumnya' tidak sama dengan 'ubin tetangga baru', itu akan berarti bahwa ubin baru ini belum dilalui sebelumnya. Maka, kita dapat dengan aman menambahkan 'Ubin Tetangga Baru' ke array 'Ubin Tetangga' dengan menyisipkannya. Kita akan mengatur nilai 'ubin sebelumnya' nanti setelah berhasil memindahkan avatar kita ke ubin lain.

"Anda dapat memperluas bundel ini dengan membuat array 8 arah yang memungkinkan avatar Anda bergerak ke arah diagonal."

Menemukan ubin tetangga terdekat

Sekarang kita telah mengumpulkan ubin tetangga yang dapat diandalkan, kita hanya perlu mencari ubin tetangga yang terdekat dengan ubin target avatar kita. Kita akan melakukan perhitungan dengan menggunakan rumus jarak yang disupply oleh nilai x dan y dari ubin target dan ubin tetangga.

Ada dua poin kunci dalam bundel ini: inisialisasi variabel untuk perhitungan, dan perhitungan jarak ubin di dalam sebuah loop.

a. Inisialisasi variabel

Yang pertama adalah untuk mendapatkan jumlah array dari ubin tetangga kita. Kemudian kita mendapatkan atribut 'ubin target' dari avatar kita dan mendapatkan nilainya x dan y. Kita akan menambahkan 2 kontainer kotak baru: 'Jarak Min' dan 'Indeks ubin target'. Kita mengatur nilai awal 'Jarak Min' ke 9999, dan nilai 'Indeks ubin target' ke 0. Jarak minimal diatur pada angka tinggi karena kita memerlukan jarak paling sedikit dari start. Indeks ubin target adalah referensi indeks kita dalam array 'Ubin Tetangga' yang memiliki jarak terkecil ke 'ubin target' kita.

Tujuan utama kita di sini adalah untuk mendapatkan indeks ubin di dalam array 'Ubin Tetangga' yang paling dekat dengan 'ubin target' kita.

b. Perhitungan jarak setiap ubin

Di dalam bundel ini, kita akan melakukan perhitungan di dalam loop yang akan kita lakukan untuk setiap ubin tetangga. Loop ini diulang berdasarkan 'jumlah ubin tetangga' dan kita akan mendapatkan nilai ubin dari array 'Ubin Tetangga' dengan menggunakan indeks dari loop tersebut.

Dapatkan nilai x dan y dari ubin tetangga tersebut dan kemudian kita akan mendapatkan jarak antara 'ubin target' dan 'ubin tetangga' menggunakan rumus ini:

jarak = sqrt((x2 - x1)^2+(y2 - y1)^2)
x1 = Target x
x2 = Ubin tetangga x
y1 = Target y
y2 = Ubin tetangga y

Kita pertama-tama mengurangkan nilai x dan y mereka, mengalikannya dengan dirinya sendiri untuk mendapatkan nilai eksponensialnya, menambahkan nilai-nilai tersebut, lalu mencari akar kuadrat dari nilai yang ditambahkan, untuk mendapatkan nilai jarak.

Jika nilai 'Jarak' kurang dari nilai kontainer 'Jarak Min', kita kemudian akan mengatur nilai 'indeks ubin target' ke indeks loop saat ini, yang merupakan indeks ubin yang kita ambil di dalam array 'Ubin Tetangga'. Kita juga mengatur nilai kontainer 'Jarak Min' dengan nilai 'Jarak' untuk kita bandingkan dengan ubin selanjutnya dalam loop.

Setelah akhir loop, kita telah membandingkan setiap satu dari ubin tetangga kita dan kita mendapatkan nilai indeks dari ubin tetangga yang paling dekat dengan 'ubin target'.

Pergerakan ke ubin tetangga

Dalam bundel terakhir tutorial kita, kita akan memindahkan avatar kita ke ubin tetangga yang terdekat dan mengulang seluruh bundel 'Temukan Jalur' jika kita belum bergerak ke 'ubin target' kita.

Hal pertama adalah untuk memeriksa jika 'jumlah ubin tetangga' kita lebih besar dari 0. Ini untuk memastikan kita hanya akan berpindah jika kita telah memperoleh minimal satu ubin tetangga yang dapat diandalkan.

Kemudian kita 'Dapatkan ubin terdekat' dengan menggunakan nilai 'indeks ubin target' dari bundel sebelumnya untuk mendapatkan nilai dari array 'Ubin tetangga'.

Untuk mendapatkan titik tepat di mana avatar kita akan bergerak, kita akan membutuhkan nilai x dan y dari ubin tersebut, dan juga mendapatkan nilai 'mulai x' dan 'mulai y' dari atribut label 'Grid' kita. Kemudian kita tambahkan nilai x dari 'ubin terdekat' dan nilai 'mulai x', dan juga yang sama dengan nilai y. Nilai yang dijumlahkan ini adalah target x dan y kita di mana avatar kita akan bergerak.

Sebelum kita bergerak ke poin tersebut, kita atur 'ubin sebelumnya' dari avatar kita dengan nilai 'pada ubin' saat ini. Kita bisa mendapatkan nilai 'pada ubin' ini dari bundel sebelumnya. Kita kemudian memindahkan avatar kita ke titik target dengan durasi 0.2.

Setelah menyelesaikan perilaku 'Pindah ke titik' , kita sekarang mengatur nilai atribut 'pada ubin' dari avatar kita dengan nilai array 'Dapatkan ubin terdekat'. Jika nilai array 'Dapatkan ubin terdekat' tidak sama dengan 'ubin target' kita, kita akan menjalankan bundel 'Temukan Jalur', sehingga mengulangi seluruh bundel lagi. Nilai atribut 'ubin target' dapat diambil dari bundel sebelumnya.

Dengan menekan salah satu ubin biru, dan setelah kemunculan avatar kita di grid, bundel 'Temukan Jalur' akan dieksekusi. Ini akan memicu pergerakan avatar dari ubin ke ubin.

Kesimpulan

Dalam tutorial ini, kita telah mempelajari cara membuat kegiatan pencarian jalur objek menggunakan array yang kita sebut sebagai 'Grid', yang digunakan untuk menyimpan informasi apakah ubin itu terisi atau tidak. Anda dapat memperluas ide ini, dengan menggunakan id objek sebagai penyimpanan informasi daripada hanya sebuah angka digit untuk array 'Grid' kita. Ini akan memberikan kita informasi yang lebih dapat diandalkan yang dapat kita gunakan saat melakukan pencarian jalur. Misalnya, kita dapat mengambil atribut dari id objek itu untuk mengetahui apakah ia hidup atau tidak, apakah ia akan memperbolehkan kita untuk menginjak ubinnya atau tidak.

Tutorial ini hanya memberikan ide dasar di balik pencarian jalur. Salah satu kelemahan dari ini adalah bahwa ia tidak menciptakan jalur terpendek yang mungkin ke ubin target, dan hanya memeriksa ubin tetangga saat ini. Ini dapat mengakibatkan loop pergerakan yang tidak sampai ke mana-mana.

Namun, ini dapat diatasi dengan memperluas algoritma pencarian jalur kita. Kita dapat melakukan ini dengan mengulangi ubin tetangga yang telah kita peroleh untuk mendapatkan ubin tetangganya juga sampai kita menemukan ubin target kita. Setiap ubin tetangga yang ditemukan akan ditambahkan ke daftar. Untuk mencegah loop tanpa batas, tambahkan kondisi bahwa jika ubin tetangga itu sudah diperiksa, ubin itu tidak akan ditambahkan ke daftar kita. Juga, tambahkan batas maksimum pada jumlah iterasi untuk mencegah loop tak terhingga yang disebabkan oleh ubin target jika terlalu jauh atau sulit untuk ditemukan. Setelah iterasi ditemukan pada ubin target, kita kemudian keluar dari iterasi tersebut dan mulai memindahkan avatar dari ubin ke ubin menggunakan daftar ubin.