unity制作登录界面(UGUI知识)

我们在平时玩游戏的时候,都会有登录系统,在这里我给大家简单实现一下这个登录系统

1.制作背景

我们先可以在网页上找几张自己喜欢的背景图片
然后把这张照片保存于我们的项目的文件夹中;
然后在unity中修改图片的属性

unity制作登录界面(UGUI知识)_第1张图片
然后把Texture Type修改成Sprite(2D and UI) 就可以在把这张图片拖到Image上了,
这样背景就做好了。

2.UI的创建

在unity中我们首先创建两个Text 两个InputField
把这两个的字体 背景颜色 设置成为自己想要的颜色即可;
unity制作登录界面(UGUI知识)_第2张图片
在这里我想说如果大家有些基础的话,大部分和Image和Text是一样的
在这里我介绍一下Content Type 其中有各种的内容格式,
如果你是作为密码输入的话,可以选择password,这样输入的密码是不可见的。
然后我们可以尝试运行 马上可以输入文字
我们可以模仿游戏中的构造模式 如下图所示
unity制作登录界面(UGUI知识)_第3张图片

登录是一个Button组件 同理改变所有合适参数即可

3.添加脚本

在unity中创建脚本 名字就叫做Account(哈哈哈,傻雕名字)

 public InputField AccountInput;//账号输入
    public InputField PasswordInput;//密码输入
    public Text Mistake;//账号及密码输入错误提示
    public Text Register;//登录成功提示
    
   public void OnButton()//Button点击事件
    {
        string AccountNumber = AccountInput.text;//获取输入账号
        string PassWordNumber = PasswordInput.text;//获取输入密码
        if(AccountNumber=="13133335840"&& PassWordNumber == "zzs20001114")//判断是否输入正确
         {
            Register .gameObject.SetActive(true);//登录效果提示
            StartCoroutine(Disappear());//调用协程
            SceneManager.LoadScene(1);//跳转别的场景
        }
        else
        {
            Mistake.gameObject.SetActive(true);//账号密码输入错误提示
            StartCoroutine(Disappear());//调用协程
        }
    }
    IEnumerator Disappear()//协程
    {
        yield return new WaitForSeconds(2);//产生效果两秒
        Mistake.gameObject.SetActive(false);//提示错误效果消失
        Register .gameObject.SetActive(false);//提示登录成功效果消失
    }

至于代码的意思 注释写的不能再清楚了(自我感觉)

代码中的登录成功 以及 错误的提示是在unity中创建两个text 并且自己设置文字
并且默认为不显示;

4.效果

登录错误效果

unity制作登录界面(UGUI知识)_第4张图片
上面的那行提示语是存在两秒就消失了(代码中的协程的作用)

登录成功效果

unity制作登录界面(UGUI知识)_第5张图片
与上同理

就这样 没有连接服务器的登录系统就差不多了

你可能感兴趣的:(unity,登录系统,UGUI)