UI System

Buatlah project baru di Unity atau cukup scene baru saja jika masih ingin menggunakan project yang sudah digunakan dalam materi sebelumnya. Tambahkan sebuah panel dengan cara klik menu GameObject -> UI -> Panel.



Semua object UI memiliki satu mekanisme unik yang disebut dengan Anchor. Misalnya untuk panel yang baru saja kita pasang. Kita bisa melihatnya pada panel Transform bahwa secara default Anchor yang dimilikinya adalah Strecth x Strecth.

Gunakan Hand Tool standar (Q) atau
tambahkan klik Kanan / Bisa juga setelah Menggunakan Hand Tool Tekan (ALT - Klik Kiri )
untuk mendapatkan pandangan Scene
seperti di bawah ini.

Anchor tersebut akan membuat panel yang dibuat akan ikut membesar secara horizontal dan vertikal sesuai dengan ukuran layar game. Kita bisa mengubah jenis Anchor dengan klik kotak penanda Anchor. Misalnya mengubah pilihan pada Top x Left kemudian geser panelnya pada ujung kiri atas. Pilihan ini akan membuat panel ‘menempel’ pada posisi kiri atas Canvas. Tak peduli ukuran layar

game berubah-ubah.

Untuk mencobanya silahkan ubah ukuran layar game.

Contoh lainnya misalnya adalah kebalikannya yaitu Top-Right. Ubahlah Anchor panel menjadi Top-Right dan geser panel sampai ujungnya mendekati posisi kanan atas. 

Jalankan game dan ubahlah layar tab game, bisa perhatikan kini bahwa panel akan berusaha untuk selalu menyesuaikan dengan ujung layar game sebelah kanan atas?

Baiklah sekarang kembalikan lagi Anchor menjadi Strecth x Strecth lalu lanjutkan materi berikutnya.

Selanjutnya kita akan membuat tombol. Caranya klik menu GameObject -> UI -> Button.

Pasang Button sebagai child dari Panel dengan cara drag langsung pada tab Hierarchy.

Jalankan game dan coba geserkan tab Game, lalu perhatikan hasilnya. Meski ukuran panel mengikuti layar game namun posisi dan ukuran button tidak. Hal terpenting yang harus diingat adalah Anchor bekerja untuk setiap objek UI sehingga kita harus mengaturnya satu persatu.

Menguasai Anchor merupakan dasar terpenting dalam penggunaan UI pada Unity. Prosesnya cukup rumit dan mudah, kita hanya perlu sedikit lebih teliti.

Selanjutnya buat sebuah InputField dengan cara klik menu GameObject -> UI-> InputField. GameObject ini berfungsi untuk menerima inputan dari user.

Tempatkan Inputfield pada panel dan sesuaikan posisinya sesuai keinginan.

Klik GameObject PlaceHolder yang merupakan child dari GameObject InputField pada tab Hierarchy, lalu klik tab Inspector dan pada panel Text ganti parameter Textnya menjadi “Masukkan Nama ”

Selanjutnya tambahkan sebuah Text dengan cara klik menu GameObject -> UI -> Text.

Tempatkan text sebagai child dari panel.

Atur posisi sesuai kebutuhan.

Anda juga bisa mengganti text yang ada pada Button dengan klik pada Text pada child Button, klik Inspector lalu ubah parameter Text sesuai kebutuhan.

Selanjutnya kita akan buat Script C# baru dan beri nama KlikUI.cs lalu ubah script seperti di bawah ini:

Selanjutnya pasang script pada GameObject. Kita bisa pasang di sembarang GameObject, misalnya saja kita pasang pada Canvas, lalu sesuaikan dua buah parameter public yang dibuat tadi dengan GameObject yang telah kita buat sebelumnya di Scene.
Untuk memudahkan, silahkan ganti nama GameObject Text yang menjadi target.

Selanjutnya klik Button pada Scene, cari panel event OnClick() pada tab Inspector, klik tombol + di pojok kanan bawah.

Masukkan GameObject yang diberi script (dalam hal ini Canvas) pada parameter Object, dan klik combobox yang bertuliskan No Function dan pilih KlikUI. Dalam hal ini KlikUI adalah script yang dipasang pada GameObject Canvas.

Pada dasarnya, semua fungsi yang dipasang sebuah GameObject yang dipasangkan pada event OnClick akan muncul pada combobox ini.

Pilih fungsi ClickMe().

Dengan begini, fungsi ClickMe() akan dipanggil jika Button ditekan.

Jalankan Game, isi InputField dengan nama seseorang dan klik buttonnya. Terlihat hasilnya?

Selengkapnya Kunjungi https://www.budiluhur.ac.id/

Simple Animation

Buatlah project baru di Unity atau cukup scene baru saja jika masih ingin menggunakan project yang sudah digunakan dalam materi sebelumnya. Tambahkan sebuah Plane dengan cara klik menu GameObject -> 3D Obect -> Plane.

Tambahkan sebuah Cube dangan cara klik menu GameObject -> 3D Obect -> Cube dan tempatkan Cube sedikit di atas Plane agar terlihat.

Selanjutnya tampilkan jendela Animation dengan cara klik menu Window -> Animation. Rencananya kita akan membuat 3 animasi yang berbeda untuk si Cube.

Untuk membuat animasi, yang pertama harus dilakukan adalah membuat sebuah file *.anim yang berisi sebuah animasi. Caranya, klik GameObject Cube pada tab Hierarchy, klik jendela Animation dan klik Create. Lalu ketikan nama animasinya, misalnya: Animasi1.anim

Pastikan tombol record (tombol merah di pojok kiri atas) telah diklik yang menandakan Unity telah siap melakukan rekaman pergerakan apapun terhadap GameObject yang aktif. Untuk Animasi1 kita akan membuat Cube berubah ukuran. Caranya klik angka pada timeline dan pindahkan sampai angka 0:30

Setelah itu gunakan gizmo Scale dan perbesar ukuran Cube (misalnya sampai dua kali lipat besarnya). Bila merasa kesulitan bisa juga menggunakan panel Transform dan memasukkan angkanya pada parameter Scale misalnya (1.5, 1.5, 1.5)

Sampai tahap ini, jika kita klik tombol play animasi (yang berada di sebelah kanan tombol record pada jendela Animation) kita sudah dapat melihat bahwa Cube tersebut telah ‘bergerak’. Dari kecil ke besar dan begitu seterusnya. Agar animasinya lebih smooth lagi, silahkan coba copy (Ctrl+C) Keyframe di 0:00 dan paste (Ctrl+V) Keyframenya di 1:00

                Sample  Animation

Sekarang buatlah 2 animasi klip lagi menggunakan cara yang sama namun dengan pergerakan yang berbeda. Untuk menambahkan klip, cukup klik pada combo utama di jendela Animation dan klik Create New Clip.

jika pada animasi sebelumnya kita membuat perubahan ukuran, coba di animasi yang kedua ini kita berupa perubahan rotasi objek.

Berikutnya animasi ketiga buatlah perpindahan objek dari beberapa titk sekaligus. Anda cukup klik pada KeyFrame tertentu dan pindahkan Cubenya ke mana saja.

Pastikan sampai pada tahap ini tidak ada kesalahan, seharusnya kita memiliki 3 buah file animasi dan 1 buah file Animator.

Tambahkan sebuah Component Animation pada Cube dengan cara klik menu Component -> Miscellaneous -> Animation. Atau Bisa Juga Dengan Add Component Pada Inspector Cube

Pada parameter Animations, ketikan angka 3 (sejumlah animasi yang tadi dibuat) dan masukkan satu per satu animasi yang diinginkan pada kotak yang bersesuaian.

Berikutnya buatlah script C# baru dan beri nama AnimationCube.cs. Ubah menjadi seperti berikut:

Pasang script tersebut pada GameObject Cube dan jalankan Game. Klik setiap button dan perhatikan animasi yang dijalankan akan berbeda-beda. Ini adalah dasar-dasar pengaturan animasi pada Unity, khususnya animasi menggunakan Component Animation.

Selengkapnya Kunjungi https://www.budiluhur.ac.id/

Raycast() dan Translate()

Kita akan mencoba membuat GameObject bisa dikendalikan dengan mouse dan keyboard dengan menggunakan fungsi Raycast() dan Translate().

Translate() adalah fungsi supaya objek begerak secara relatif terhadap posisinya sendiri bukan posisi dunia.

Raycast() merupakan fungsi untuk menghasilkan koordinat vektor 3D berdasarkan penembakan ke arah yang dituju oleh kursor mouse.

Ok Lanjut

buatlah sebuah projek unity dengan nama apa saja atau bisa juga teman- teman menggunakan scene dari projek sebelumnya

tambahkan sebuah Plane dengan memilih GameObject -> 3D Object -> Plane


Selanjutnya kita akan buat 3D Object Cube dengan cara klik GameObject -> 3D -> Cube lalu tambahkan Component Rigidbody melalui menu Component -> Physics -> Rigidbody.Atau bisa juga Add Component Pada inspector






Selanjutnya tambahkan asset gambar yang akan menjadi texture cube dengan cara klik kanan pada panel Assets lalu pilih Import New Assets kemudian pasang asset tersebut pada cube.
Kemudian atur posisi Cube sehingga berada di atas plane.

Selanjutnya buat skrip C# dan beri nama TranslateScript.cs dan isi seperti berikut.


Kemudian Taruh Scrip Tersebut ke Cube
lalu jalankan , cobalah menekan tombol spasi atau panah atas, bawah, kiri, kanan, kemudian coba tekan dan tahan tombol shift kiri dan panah kiri atau kanan kemudian lihat pergerakannya.

Kemudian Drag MainCamera Ke Cube Agar posisi kamera Mengikuti Cube

Setelah selesai dengan Translate() Kemudian kita akan mencoba fungsi Raycast() untuk menggerakkan object dengan mouse.

Buatlah sebuah plane dan beri nama Target, sesuaikan ukurannya sampai mengecil, beri warna lewat material, lalu atur posisinya berada di atas plane pertama.

Kemudian buat skrip C# dan beri nama RaycastCube.cs lalu isi seperti berikut.



Selanjutnya pasang skrip tersebut ke GameObject Cube lalu isi kolom target dengan plane kedua yang kita buat dan biarkan kolom Is Moving tidak dicentang.



Sekarang Coba Tekan Tombol Play , Klik kanan pada sembarang tempat maka plane target akan berpindah sesuai lokasi kursor mouse dan Cube akan menghadap ke arah plane target. Hal lain yang dapat diperhatikan adalah pada saat permainan dijalankan, pada tab Scene akan terlihat garis lurus berwarna merah dari Main Camera menuju titik kursor mouse/plane target. Itu adalah fungsi dari Raycast() untuk interaksi antara user dengan lingkungan game.

Berikutnya hentikan permainan lalu centang kolom Is Moving dan jalankan kembali permainan. Sekarang selain hanya menghadap ke arah plane target, Cube juga akan bergerak menuju plane target.

Selengkapnya Kunjungi https://www.budiluhur.ac.id/

Prefab & Rigidbody

buatlah sebuah projek unity dengan nama apa saja atau bisa juga teman- teman menggunakan scene dari projek sebelumnya

tambahkan sebuah Plane dengan memilih GameObject -> 3D Object -> Plane lalu beri nama Lantai1 dan Lantai2.



buat posisi dan ukuran objek seperti gambar dibawah .



Klik Lantai2 pada tab Hierarchy kemudian buat GameObject Child dengan cara klik menu GameObject -> Create Empty Child. Atur posisi GameObjectChild tadi menggunakan gizmo atau panel Transform sehingga sedikit di atas Lantai2


Ganti nama Game Object Child tadi menjadi TitikJatuh, Selanjutnya buat sebuah Sphere baru dengan cara klik menu GameObjects -> 3D Object -> Sphere dan ganti namanya menjadi MyBall.



Tambahkan sebuah gambar pada panel Assets dengan cara klik kanan pada panel Assets -> Import New Assets, lalu pilih salah satu gambar yang ada di komputer Anda.
Dari panel Assets, drag gambar tersebut lalu letakkan pada MyBall

Klik MyBall dan tambahkan RigidBody, Rigidbody adalah sebuah komponen penting yang dapat membuat GameObject seolah-olah memiliki berat dan dapat dipengaruhi oleh gaya gravitasi.



Buat sebuah Physic Material dengan cara klik Assets -> Create -> Physics Material dan beri nama Bounce.

Ganti parameter Bounciness menjadi 0.9 untuk menambahkan efek memantul.

Kita kembali ke GameObject MyBall, tambahkan Material Bounce dengan cara drag dari panel Assets ke panel Sphere Collider, parameter material. Atau klik tombol kecil di kolom Material pada komponen Sphere Collider milik MyBall

Berikutnya untuk menjadikan Prefab, drag MyBall dari tab Hierarchy ke panel Assets

Kalau sudah maka MyBall pada tab Hierarchy dapat dihapus karena yang akan digunakan adalah prefab yang ada di assets.

Prefab adalah sebuah instansiasi dari sebuah GameObject sehingga GameObject yang sudah pernah dibuat bisa digunakan kembali dengan cepat. Selain itu Prefab memungkinkan GameObject digandakan menggunakan script. Untuk menggunakan prefab cukup drag dan drop MyBall dari assets ke scene seperti berikut.



Buat script C# dan beri nama GandakanBola.cs lalu ubah script menjadi seperti berikut ini.


Selanjutnya pasang script tersebut di GameObject mana saja yang Anda suka, lalu pastikan parameter TempatJatuh dan parameter Bola diisi.

Parameter TempatJatuh diisi dengan GameObject TitikJatuh, sedangkan parameter Bola diisi dengan prefab MyBall

Jalankan Games dan klik tombol Buat Bola berkali-kali / Spasi. Perhatikan pula kondisi tab Hierarchy dengan seksama, semua GameObject yang terbentuk dan terterah di sana akan menghilang secara otomatis setelah 5 detik.

Sekian Terimakasih

Kunjungi https://www.budiluhur.ac.id/

GUI SKIN

Seperti biasa buatlah sebuah projek unity dengan nama apa saja atau bisa juga teman- teman menggunakan scene dari projek sebelumnya .

Tambahkan sebuah GUISkin dengan cara klik kanan pada menu Assets -> Create -> GUISkin dan silakan beri nama “BelajarGUISkin” .



Kemudian Silakan download beberapa assets yang sudah saya sediakan Klik

Buat Folder berinama image

Kemudian Impor semua assets yang telah kalian download dengan cara klik kanan -> Import New Asset atau bisa juga dengan drag And Drop

Berikutnya kita kembali ke Skin “BelajarGUISkin” barusan telah dibuat.

GUI Skin memiliki 2 jenis font, Ada font global yang letaknya di panel paling atas, dan ada font lokal yang berada di setiap parameter GUI.

Ubah font khusus button dengan drag file font pada Assets ke Button -> Overflow. Atau klik tombol kecil di sebelaha kanan kolom Font lalu browse, cari Font pada Asset, Lalu ubah Font Size menjadi 24.

Berikutnya ganti background pada Button.
Ganti Background pada Toggle:
1.Button -> Normal
2.Button -> Hover
3.Button -> Active


Contoh Pencarian Gambar

Ganti Background pada Toggle:
1.Toggle -> Normal

2.Toggle -> Hover

3.Toggle -> Active

5.Toggle -> On Hover

4.Toggle -> On Normal

5. Toogle -> On Hover

6.Toggle -> On Active



jika sudah selesai lalu buat folder scrip dan buat script C# beri nama "MenuSkin" Assets->Creat->C#

Kemudian Ketik Scrip Berikut

Drag & Drop script MenuSkin.cs pada GameObject (misalnya MainCamera), lalu pasang parameter mySkin dengan BelajarGUISkin

Jika sudah, jalankan game dan kalau tidak ada error akan tampil seperti di bawah ini.


Kunjungi https://www.budiluhur.ac.id/

Interaksi Object

Pertama kita akan buat 3D Object Cube dengan cara klik GameObject -> 3D -> Cube.

Selanjutnya buat tiga kubus yang sama atau bisa juga menggandakan object dengan klik kanan Cube lalu pilih duplicate.

Selanjutnya kita akan membuat tag baru dengan cara pilih object manapun, lalu lihat kotak Inspector di sebelah kanan, klik Tag -> Add Tag lalu beri nama “Kotak1”

Kalau sudah maka pilih Kubus4 dan ubah Tag-nya menjadi Kotak1 yang nantinya akan berpengaruh pada script.

buat script C# beri nama "ScriptKubus" Assets->Creat->C#

Kemudian Ketik Scrip Berikut

Jika sudah disimpan selanjutnya Drag and Drop “ScriptKubus” ke object “Kubus1”. Lalu lihat Inspector dan isi seperti berikut.

Terakhir kita dapat menjalankan program dengan mengklik tombol Play dan berikut adalah hasilnya

Kunjungi https://www.budiluhur.ac.id/