Unity3D之UGUI——制作纸牌类游戏加入房间的输入面板

Unity3D之UGUI——制作纸牌类游戏加入房间的输入面板

在玩纸牌类游戏，我们经常创建房间，然后邀请好友加入房间进行游戏。点击加入房间后，弹出加入房间的面板，输入房号即可加入。

现在我们就利用unity制作一个加入房间的输入面板，GO GO！

首先我们利用UGUI组件搭建输入界面，大家可以自行设计样式，图片素材可自找，当然如有需要，我会附上我的工程文件下载地址。搭建界面如下图：

Button_0至Button_9 表示0至9数字按键，Button_reset为重置，Button_del为删除，Button_exit为右上方的退出按钮，

num_group下的6个text为输入后显示的房间号。

界面就是这样，具体的布置就不详讲了。

代码部分:

创建C#脚本：JoinRoomSettingScript.cs

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

public class JoinRoomSettingScript : MonoBehaviour {
    private List<String> inputChars;//输入的字符

    public List<Text> inputTexts;//显示的text组件

    public List<GameObject> btnList;//所有数字按键

    public Button button_reset, button_del;//撤销，删除按钮
	
	void Start () {
        
        inputChars = new List<string>();//实例输入字符集合

        //通过访问集合，循环绑定按钮的监听事件
        for(int i = 0; i < btnList.Count; i++) {
            GameObject obj = btnList[i];

            btnList[i].GetComponent<Button>().onClick.AddListener(delegate () {
                this.OnClickHandle(obj);});
        }
	}
	
	/// <summary>
    /// 每帧运行都调用onEnterOk()函数
    /// </summary>
	void Update () {
        onEnterOk();
	}

    /// <summary>
    /// 数字按钮点击事件
    /// </summary>
    /// <param name="gobj"></param>
    public void OnClickHandle(GameObject gobj) {
        clickNumber(gobj.GetComponentInChildren<Text>().text);
    }
    private void clickNumber(string number) {

        if (inputChars.Count >= 6) {

            return;//输入达到6位数，跳出该函数
        }
        inputChars.Add(number);

        int index = inputChars.Count;

        inputTexts[index - 1].text = number.ToString();//显示数字到显示处
    }

    /// <summary>
    /// 删除按钮的点击事件
    /// </summary>
    public void deleteNumber() {
        if (inputChars != null && inputChars.Count > 0) {
            inputChars.RemoveAt(inputChars.Count - 1);
            inputTexts[inputChars.Count].text = "";
        }
    }
    /// <summary>
    /// 重置按钮的点击事件
    /// </summary>
    public void resetNumber() {
        if(inputChars !=null && inputChars.Count > 0) {
            inputChars.Clear();
            for(int i=0;i< inputTexts.Count; i++) {
                inputTexts[i].text = "";
            }
        }
    }

    /// <summary>
    /// 输入6个字符就提交
    /// </summary>
    private void onEnterOk() {
        if (inputChars.Count == 6) {
            String roomNumber = inputChars[0] + inputChars[1] + inputChars[2] + inputChars[3] + inputChars[4] + inputChars[5];
            Debug.Log(roomNumber);

        }
    }
    /// <summary>
    /// 关闭面板
    /// </summary>
    public void closeDialog() {
        Destroy(this);
        Destroy(gameObject);
    }
    
}

将该代码挂载载Panel_join _room _bg上，然后并拖动组件到脚本中声明的集合中，Input Texts中size输入6，Btn List 中 size 输

入 10

然后绑定 Button_reset,Button_del,Button_exit的点击事件

拖动后点击Founction，选择 JoinRoomSettingScript----->ResetNummber()

，

我只演示其中一个按钮绑定，其余两个方法相同，相信一定难不倒聪明的你。

绑定完成后，就可以运行了，点击数字按钮就可以显示了，nice nice！

如有不同想法，请互相交流！共同学习！ GO GO！继续成长之路。

如需工程文件请留言哦，我会尽快发上！当然也可以用NGUI来做，原理一样。

Unity3D之UGUI——制作纸牌类游戏加入房间的输入面板

猜你喜欢