Unity Login Scene

Halo, temans! Sesuai janji saya di postingan lalu dan atas request dari salah satu penggemar Kiky Si Kancil *eaaa, penggemar...* saya akan coba membuat posting tentang pembuatan login script di Unity pakai PHP dan MySQL. Tutorial ini cukup sulit loh, karena saya mesti 'kurulang-kuriling' ke berbagai forum untuk menemukan cara yang pas untuk bikin login scene. Dan karena sudah ketemu, langsung saja saya share di sini, mudah-mudahan bermanfaat ya.

Oke, deh. Langsung aja kita capcus brother! Langkah pertama adalah buat project baru. Namanya bebas terserah.

Habis itu bikin dua buah Inputfield. Caranya klik menu GameObject > UI > InputField

Setelah itu atur-atur posisinya sesuka hati dan gameobjectnya kasih nama "Username" dan "Password"

Habis itu agan masukin sebuah gambar background untuk login scene. Apaan aja deh bebas. Bisa di drag langsung dari Windows Explorer atau lewat menu Assets > Import New Assets. JANGAN LUPA: set Texture Type-nya jadi (Sprite 2D and UI)

Habis itu agan tambahin UI Image dengan cara klik menu GameObject > UI > Image

Klik tuh Imagenya dan di bagian Source Image masukin gambar background yang tadi dimasukin. Buat yang nggak ngerti soal UI Image Unity yang baru bisa baca-baca dulu postingan saya soal ini: Unity UI Image

Habis itu semua InputField jadiin anaknya (child) dari si Image. Caranya? Drag aja. Ngerti kan? Nggak? Bingung? Gini gan, agan cari Tab yang tulisannya Hierarchy. Terus agan pegang tuh mouse, agan tahu mouse kan? Itu yang suka dipencet2 sama agan kalo lagi main komputer namanya mouse tuh. Bukan! Kalau yang ada hurufnya namanya keyboard. Oke? Paham? Pencet mouse, klik salah satu gameobject, geser2 antar gameobject satu dengan lain. *Pencet mousenya tombol yang kiri apa yang kanan?* 

Agan mendingan cuci muka dulu deh sana!!!

Pokoknya mah jadiin tuh 2 inputfield jadi anaknya si Image. Kalau tampilannya udah bagus kayak begini, agan tinggal tambahin komponen text buat label. Caranya klik GameObject > UI > Text

Terus atur deh kayak berikut

Next adalah bikin sebuah tombol dengan cara klik GameObject > UI > Button

Tulisaanya ganti dengan Login biar keren

Habis itu agan bikin script C# dengan cara klik kanan di panel Assets dan pilih menu Create > C# Script dan kasih nama UnityLogin

Udah? Langsung ketik deh script berikut:

1:  using UnityEngine;  
2:  using System.Collections;  
3:  using UnityEngine.UI;  
4:  public class UnityLogin : MonoBehaviour {  
5:       public string URL;  
6:       public InputField txtPassword;  
7:       WWW php_login;  
8:       WWWForm php_form;  
9:       string vUser, vPass, vText;  
10:       // Use this for initialization  
11:       void Start () {  
12:            txtPassword.inputType = InputField.InputType.Password;  
13:       }  
14:       // Update is called once per frame  
15:       void Update () {  
16:       }  
17:       IEnumerator PostLogin(){  
18:            vUser = GameObject.Find("Username").GetComponent<InputField>().text;  
19:            //vPass = GameObject.Find("Password").GetComponent<InputField>().text; /* ??? */  
20:            vPass = txtPassword.text;  
21:            php_form = new WWWForm();  
22:            php_form.AddField("unity_user",vUser);  
23:            php_form.AddField("unity_pass",vPass);  
24:            php_login = new WWW(URL, php_form);  
25:            yield return php_login;  
26:            vText = php_login.text;  
27:            if (vText == "1"){  
28:                 Debug.Log("Application.LoadLevel(bla-bla-bla)");  
29:            }  
30:       }  
31:       public void LoginClickMe () {  
32:            StartCoroutine(PostLogin());  
33:       }  
34:  }  

Yang barusan adalah dari sisi Unity, sekarang kita masuk ke sisi PHP + MySQL nya. Dalam hal ini agan mesti bikin dulu sebuah tabel di MySQL (via PHPMyAdmin ajalah yang gampang) isinya kayak berikut:

Terus agan bikin sebuah skrip PHP dengan nama unity_login.php dan ketikkan skrip berikut.

1:  <?php  
2:       $host = "localhost";  
3:       $user = "root";  
4:       $pass = "";  
5:       $database = "db_kikysikancil";  
6:       $table = "tb_kancilogin";  
7:       $connect = mysql_connect($host, $user, $pass);  
8:       $valid = mysql_select_db($database);  
9:       if ($connect && $valid){  
10:            $sql = "select count(*) from $table where user= '$_POST[unity_user]' and pass = '$_POST[unity_pass]' ";  
11:            $result = mysql_query($sql);  
12:            $row = mysql_fetch_row($result);  
13:       }  
14:       echo $row[0];  
15:  ?>  

Ingat baik-baik nama skrip PHP nya karena itu akan jadi sangat penting waktu ngeset parameter di Unitynya nanti. Sekarang, pasang Script UnityLogin ke GameObject Canvas. Atur txtPassword dengan InputField yang akan dijadiin password dan atur URL ke "host/nama_file.php" ikutin aja gambar deh. *Dan plis, jangan ada yang nanya di mana file ".php" nya harus di simpen, koneksi php dan mysql gimana, nama databasenya apa dan tabelnya apa, karena saya anggap agan2 sudah paham soal dasar-dasar php+mysql, jadi bagi yang belum ngerti silahkan tanya langsung arti dari skrip php di atas sama yang udah paham*

Langkah terpenting selanjutnya adalah memasang event si button dengan fungsi yang udah kita bikin. Ini nih yang penting. Jangan sampai salah. Karena tadi script UnityLogin di pasang di GameObject Canvas, maka Button pun harus dipasangkan dengan GameObject Canvas bukan ke gameobject yang lain-lain. Buat yang masih bingung soal gimana hubungan antara UI Button dengan sebuah script supaya bisa di klik bisa dilihat di Unity UI Button

Habis itu save aja Scene dan play aja langsung.

Kalau user dan passwordnya bener bakalan muncul di kotak console sebuah string "Application.LoadLevel(bla..blaa...)" itu maksudnya, agan bisa ganti bagian itu dengan perintah Application.LoadLevel() atau perintah apa pun. Use your imagination lah, hehehe. Gimana? Bagus? Bagus? Baguuuuus!! Oke, sekian dulu deh tutorial saya kali ini. Sampai jumpa lagi di tutorial-tutorial geje selanjutnya. :)