Pada kesempatan kali ini akan memperkenalkan sistem UI yang dimiliki oleh Unity (sejak versi 4.6 rilis). User Interfaces (UI) sendiri adalah komponen yang mengatur tampilan untuk user/player. UI ini sangat berperan penting untuk membangun interaksi antara sistis dalam game dengan player game.
Sistem UI umumnya sama dengan sistem GUI (OnGUI). Pebedaanya adalah sistem UI dibuat agar pembuat game(developer) lebih leluasa mengatur desain tampilan dengan mudah melalui jendela menu pada Unity, sedangkan sistem GUI memerlukan tenaga ekstra untuk membuat tampilan, karena prosesnya dilakukan dengan menulis file script (C# Sharp).
Sebelum memperkenalkan sistem UI, pada dokumentasi kali ini Unity yang digunakan adalah Unity versi 2018.4.20f1, berbeda dengan Unity versi sebelumnya yang saya gunakan (2017.4.11f1). Namun untuk mencoba sistem UI seperti dokumentasi ini masih bisa menggunakan Unity versi 2017.4.11f1, hanya saja terdapat beberapa icon/tampilan menu yang terlihat berbeda namun fungsinya tetap sama.
(Tampilan awal Unity 2018.4.20f1
Untuk melihat komponen UI yang disediakan oleh Unity dapat dilihat pada menu GameObject à UI
Komponen UI tersebut merupakan komponen-komponen standar yang digunakan untuk membangun interaksi dengan pengguna.
Selanjutnya, cobalah untuk membuat Panel, dapat dicoba pada menu GameObject à UI à Panel. Tampilan setelah komponen Panel dibuat, Komponen Canvas akan terbuat secara otomatis (digunakan sebagai wadah dari komponen-komponen lainya).
Pada jendela Inspector dapat terlihat adanya pengaturan Anchor (default Strecth x Strecth). Anchor digunakan untuk mengatur tampilan Panel pada layar game, konsepnya adalah Responsive atau menyesuaikan.
Untuk mencobanya, silakan ubah Scale Panel menjadi (0.80, 0.80, 0.80) dan ubahlah ukuran layar game dengan drag pembatas antara layar Scene dan Game sebagai berikut
Pada tampilan di atas Anchor yang digunakan adalah Strecth x Strecth, di mana ketika layar game diperbesar/diperkecil maka tampilan panel juga ikut membesar & mengecil. Hal ini sangat membantu dalam pembuatan game karena cukup satu(1) kali membuat dapat diterapkan untuk banyak platform game.
Cobalah untuk menggunakan Anchor yang lainya, misal : Top x Right, kemudian lihat perbedaanya.
Jika sudah, kembalikan Anchor menjadi default (Strecth x Strecth). Lalu tambahkan komponen lainya, misal: button, dengan cara GameObject à UI à Button.
Untuk mengatur attribut apa saja yang ingin digunakan pada Button dapat diatu melalui jendela Inspector, misal: attribut warna sebagai berikut:
Hal yang sama juga dapat dilakukan untuk komponen Text (child dari Button)
Terakhir, cobalah untuk membuat tampilan seperti ini:
Sampai pada tahap ini diketahui bahwa sistem UI ini sangat memudahkan dalam membuat suatu desain tampilan layar pada game. Selain komponenya ± sama dengan sistem GUI (OnGUI), cara penggunaanya pun sangat mudah dan dapat dicoba langsung pada layar scene.
Demikian dokumentasi kali ini, Terima Kasih~
Komentar
Posting Komentar