[Unity3D] 03 - Component of UI

还需进一步整理！

ing...

博客参考

---

 

 

Unity 相关博客：Unity游戏开发爱好者

• Unity 3D 连接Mysql数据库
• Unity uGUI 登录界面
• Unity uGUI 登录及注册功能
• Unity之Bmob云存储一

 

 

 

功能归类　　

---

 

按钮：

Unity 5 UI Tutorial - Button and event handlers

• Ref：Unity3D的按钮添加事件有三种方式
• Ref : Unity 4.6 uGUI的点击事件【以上第三方法的补充，通过UI设置】

 

输入框：

Unity 5 UI Tutorial - Input field and event handlers

• 控件信息获取：点击按钮，获取另一个控件的属性。

using UnityEngine;
using UnityEngine.UI;

public class Button_event_test : MonoBehaviour {

    public void Button_Click()
    {
        string str_inputField1 = "Hello world - test123";
        Debug.Log(str_inputField1);
　　　　　// 获取这个对象
        GameObject inputObj = GameObject.Find("Canvas/Panel/InputField1");
// 拨开这个对象的真正面目
        InputField input = (InputField)inputObj.GetComponent<InputField>();
        // 得到这个对象的属性
        str_inputField1 = input.text.ToString();
        Debug.Log(str_inputField1);
    }
}

 

• 登陆界面设计的重要事项

1. 密码
2. 字符规则判定（正则表达式）

 Ref：Unity-3D 简单登陆界面，在此基础上做修改。

using UnityEngine;
using System.Collections;

public class Label : MonoBehaviour {
    private string userName;
    private string passWord;
    private string username;
    private string password;
    private string message;
    private string info;
    public Texture img;
void OnGUI()
    {
        GUIStyle sty  = new GUIStyle();
        GUIStyle sty1 = new GUIStyle();
        sty.fontSize  = 20;
        sty1.fontSize = 40;
        GUI.Label(new Rect(120, 10, 100, 30), "登录界面", sty1);
        GUI.Label(new Rect(30,  70, 100, 30), "用户名:",  sty);
        userName = GUI.TextField(new Rect(120, 70, 200, 30),userName,20);
        GUI.Label(new Rect(30, 110, 100, 30), "密码:",sty);
        passWord = GUI.PasswordField(new Rect(120, 110, 200, 30), passWord, '*', 15);
        message = GUI.TextArea(new Rect(400, 30, 200, 200), message, sty);
if (GUI.Button(new Rect(220, 150, 110, 30), "login"))
        {
            if (username == userName && password == passWord)
            {
                info = "success!";

                message = "床前明月光，\n疑是地上霜。\n举头望明月，\n低头思故乡。\n";
            }
            else
                info = "failed!";
        }
        sty.fontSize = 40;
        GUI.Label(new Rect(150, 210, 512, 225), info,sty);

    }
// Use this for initialization
    void Start () {
        userName = "";
        passWord = "";
        message  = "";
        info     = "";
        username = "wonameshuai";　　# default
        password = "nishuodedui";　　# default
    }

    // Update is called once per frame
    void Update () {

    }
}

 

 

 

Canvas

• 大小，inspector

• 加图片：Canvas 本身是个框架，没有背景图案也就没有Texture。--> 内部添加panel

 

Panel

加图片：

 

 

 

 

//用户名
private var editUsername : String;
//密码
private var editPassword : String;
//提示信息
private var editShow : String;

function Start()
{
    editShow = "请您输入正确的用户名与密码";
    editUsername = "请输入用户名";
    editPassword = "请输入密码";
}

function OnGUI () 
{
    
    //显示提示信息内容
    GUI.Label(Rect(10, 10, Screen.width, 30), editShow);
    
    if (GUI.Button(Rect(10,120,100,50),"登录"))
    {
        //点击按钮修改提示信息
        editShow = "您输入的用户名为 ：" + editUsername + " 您输入的密码为："+ editPassword;
    }
//编辑框提示信息
    GUI.Label(Rect(10, 40, 50, 30), "用户名");
    
    GUI.Label(Rect(10, 80, 50, 30), "密码：");
    
    //获取输入框输入的内容
    editUsername = GUI.TextField (Rect (60, 40, 200, 30), editUsername, 15);
    editPassword = GUI.PasswordField  (Rect (60, 80, 200, 30), editPassword, "*"[0],15);
}

 

 

代码研究

---

 

Panel加载图片：

那是因为你没把图片设置为Sprite (小精灵)，图片只是Texture而已，只能作为贴图使用。

Goto: Unity3D在UI中加入Image图片

 

点击事件配置:

Goto: Unity 4.6 uGUI的点击事件

发送消息，发送给谁？ 如何控制？

using UnityEngine;
using System.Collections;
using UnityEngine.UI;

public class testclick : MonoBehaviour
{

    // Use this for initialization
    void Start () 
    {

        Button btn = gameObject.GetComponent<Button>();
        btn.onClick.AddListener(click);
    }
    
    void click()
    {
        Debug.Log ("Mouse Click");
    }
}

对应代码