GUI (IMGUI)
Controls

JPG PNG BMP GIF 3 MB

Bagian ini akan menjelaskan kebutuhan telanjang untuk scripting Controls dengan sistem Unity Immediate Mode GUI (IMGUI).

Membuat kontrol dengan IMGUI

Kontrol IMGUI Unity menggunakan fungsi khusus yang disebut OnGUI(). Fungsi OnGUI() disebut setiap bingkai selama script yang mengandung diaktifkan - seperti fungsi Update().

JPG PNG BMP GIF 3 MB Struktur ini jelas dalam contoh berikut.

/* Example level loader */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour {
            
    void OnGUI ()
    {
        // Make a background box
        GUI.Box(new Rect(10,10,100,90), "Loader Menu");
    
        // Make the first button. If it is pressed, Application.Loadlevel (1) will be executed
        if(GUI.Button(new Rect(20,40,80,20), "Level 1"))
        {
            Application.LoadLevel(1);
        }
    
        // Make the second button.
        if(GUI.Button(new Rect(20,70,80,20), "Level 2")) 
        {
            Application.LoadLevel(2);
        }
    }
}

Contoh ini adalah loader tingkat fungsional yang lengkap. Jika Anda menyalin/paste skrip ini dan melampirkan GameObjectObjek mendasar dalam adegan Unity, yang dapat mewakili karakter, props, pemandangan, kamera, waypoints, dan banyak lagi. Fungsi GameObject didefinisikan oleh Komponen yang melekat padanya. More info
Lihat di Glossary
, Anda akan melihat menu berikut muncul ketika Anda memasukkan Play Mode:

The Loader Menu created by the example code
Menu Loader yang dibuat oleh kode contoh

Mari kita lihat rincian kode contoh:

Garis GUI pertama, GUI.Box (Rect (10,10,100,90), “Loader Menu”); menampilkan Kontrol Box dengan teks header "Loader Menu". Ini mengikuti skema deklarasi Kontrol GUI khas yang akan kita jelajahi sesaat.

Garis GUI berikutnya adalah deklarasi Kontrol Button. Perhatikan bahwa itu sedikit berbeda dari deklarasi Kontrol Kotak. Secara spesifik, seluruh deklarasi tombol ditempatkan dalam pernyataan if. Ketika permainan berjalan dan Tombol diklik, pernyataan if ini kembali benar dan kode di dalam blok if dieksekusi.

Karena kode OnGUI() disebut setiap bingkai, Anda tidak perlu untuk secara eksplisit membuat atau menghancurkan kontrol GUI. Garis yang menyatakan Kontrol adalah yang sama yang menciptakannya. Jika Anda perlu menampilkan Kontrol pada waktu tertentu, Anda dapat menggunakan jenis logika skrip untuk melakukannya.

/* Flashing button example */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour
{
            
    void OnGUI () 
    {
        if (Time.time % 2 < 1) 
        {
            if (GUI.Button (new Rect (10,10,200,20), "Meet the flashing button"))
            {
                print ("You clicked me!");
            }
        }
    }
}

Di sini, GUI.Button() hanya akan dipanggil setiap detik lainnya, jadi tombol akan muncul dan hilang. Secara alami, pengguna hanya dapat mengklik ketika tombol terlihat.

Seperti yang Anda lihat, Anda dapat menggunakan logika yang diinginkan untuk mengontrol ketika Kontrol GUI ditampilkan dan fungsional. Sekarang kita akan menjelajahi rincian setiap deklarasi kontrol.

Anatomi dari Kontrol

Ada tiga potongan utama informasi yang diperlukan ketika menentukan Kontrol GUI:

Type (Position, Content)

Mengamati struktur ini adalah fungsi dengan dua argumen. Kami akan menjelajahi rincian struktur ini sekarang.

Type

Type adalah Control Type, dan dinyatakan dengan memanggil fungsi dalam Unity Kelas GUI atau Kelas GUILayout, yang dibahas pada panjang di bagian Mode Tata Letak Panduan. Misalnya, GUI.Label() akan membuat label non-interaktif. Semua jenis kontrol yang berbeda dijelaskan kemudian, di bagian Controls dari Panduan.

Position

Position adalah argumen pertama dalam fungsi Kontrol GUI. argumen itu sendiri disediakan dengan fungsi Rect(). Rect() mendefinisikan empat properti: left-most position, top-most position, total width, total height. Semua nilai-nilai ini disediakan dalam nilai integers, yang sesuai dengan nilai pixelUnit terkecil dalam gambar komputer. Ukuran piksel tergantung pada resolusi layar Anda. Pencahayaan pixel dihitung pada setiap piksel layar. More info
Lihat di Glossary
. Semua kontrol UnityGUI bekerja di Screen Space, yang merupakan resolusi pemain yang diterbitkan dalam piksel.

Sistem koordinat berbasis di atas. Rect(10, 20, 300, 100) mendefinisikan Rectangle yang dimulai pada koordinat: 10,20 dan berakhir pada koordinat 310,120. Perlu mengulangi bahwa pasangan kedua nilai dalam Rect() adalah total lebar dan tinggi, bukan koordinat di mana kontrol berakhir. Inilah sebabnya contoh yang disebutkan di atas pada 310,120 dan tidak 300,100.

Anda dapat menggunakan properti Screen.width dan Screen.height untuk mendapatkan total dimensi ruang layar yang tersedia di pemain. Contoh berikut dapat membantu menjelaskan bagaimana ini dilakukan:

/* Screen.width & Screen.height example */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour 
{
            
    void OnGUI()
    {
        GUI.Box (new Rect (0,0,100,50), "Top-left");
        GUI.Box (new Rect (Screen.width - 100,0,100,50), "Top-right");
        GUI.Box (new Rect (0,Screen.height - 50,100,50), "Bottom-left");
        GUI.Box (new Rect (Screen.width - 100,Screen.height - 50,100,50), "Bottom-right");
    }

}
The Boxes positioned by the above example
Kotak yang diposisikan oleh contoh di atas

Content

Argumen kedua untuk Kontrol GUI adalah konten aktual yang akan ditampilkan dengan Kontrol. Paling sering Anda ingin menampilkan beberapa teks atau gambar pada Kontrol Anda. Untuk menampilkan teks, melewati string sebagai argumen Konten seperti ini:

using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour 
{
    void OnGUI ()
    {
        GUI.Label (new Rect (0,0,100,50), "This is the text string for a Label Control");
    }
}

Untuk menampilkan gambar, deklarasikan variabel publik Texture2D, dan masukkan nama variabel sebagai argumen konten seperti ini:

/* Texture2D Content example */
public Texture2D controlTexture;
  ...

void OnGUI () 
{
    GUI.Label (new Rect (0,0,100,50), controlTexture);
}

Berikut ini adalah contoh lebih dekat dengan skenario dunia nyata:

/* Button Content examples */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour
{
    public Texture2D icon;
    
    void OnGUI () 
    {
        if (GUI.Button (new Rect (10,10, 100, 50), icon)) 
        {
            print ("you clicked the icon");
        }
    
        if (GUI.Button (new Rect (10,70, 100, 20), "This is text")) 
        {
            print ("you clicked the text button");
        }
    }
}
The Buttons created by the above example
Tombol yang dibuat oleh contoh di atas

Ada opsi ketiga yang memungkinkan Anda untuk menampilkan gambar dan teks bersama-sama dalam Kontrol GUI. Anda dapat memberikan objek GUIContent sebagai argumen Konten, dan mendefinisikan string dan gambar ditampilkan dalam GUIContent.

/* Using GUIContent to display an image and a string */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour
{
    public Texture2D icon;

    void OnGUI () 
    {
        GUI.Box (new Rect (10,10,100,50), new GUIContent("This is text", icon));
    }
}

Anda juga dapat mendefinisikan Tooltip di GUIContent, dan menampilkannya di tempat lain di GUI ketika hovers mouse di atasnya.

/* Using GUIContent to display a tooltip */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour 
{
    void OnGUI () 
    {
        // This line feeds "This is the tooltip" into GUI.tooltip
        GUI.Button (new Rect (10,10,100,20), new GUIContent ("Click me", "This is the tooltip"));
        
        // This line reads and displays the contents of GUI.tooltip
        GUI.Label (new Rect (10,40,100,20), GUI.tooltip);
    }
}

Anda juga dapat menggunakan GUIContent untuk menampilkan string, ikon, dan tooltip.

/* Using GUIContent to display an image, a string, and a tooltip */
using UnityEngine;
using System.Collections;

public class GUITest : MonoBehaviour 
{
    public Texture2D icon;
    
    void OnGUI () 
    {
        GUI.Button (new Rect (10,10,100,20), new GUIContent ("Click me", icon, "This is the tooltip"));
        GUI.Label (new Rect (10,40,100,20), GUI.tooltip);
    }
}

Halaman referensi skrip untuk GUIContent constructor memiliki beberapa contoh penggunaannya.

GUI (IMGUI)
Controls