【Unity】制作简单的登录界面和实现线框高亮

本文内容

在上文内容的基础上做以下更改：

1. 首先进入启动界面，有个滚动条展示载入进度，10秒后滚动条满格切换到登录界面；
2. 登录界面：账号密码输入框，可以输入账号密码，点击登录在Console输出当前所登录账号，切换到主界面；
3. 游戏界面：主窗口显示若干三维场景元素，点击选中某个物体，并线框高亮，点击地面将当前选中物体移到点击的位置。

步骤

1. 打开上文的项目，新建登录场景“Login”；
   
2. 给Login添加背景：Create->Quad，将背景图片拖到Quad上；
   
3. 添加输入框、选项框及按钮：Create->UI->Input Field/Toggle/Button，调整位置，并修改它们的Text；
   
   
4. 给Button添加脚本：

public InputField Name;
public InputField Password;
public Text Hint;

public void OnClick()
{
    //账号密码不合法
    if(Name.text == "" || Password.text == "")
    {
        Hint.text = "请输入账号及密码";
    }
    else
    {
        Debug.Log(Name.text); //在Console输出当前账号
        SceneManager.LoadScene("Menu");
    }
}

并为其选择Name、Password及Hint；

5. 接下来为Password加密：新建脚本：

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

public class Password : MonoBehaviour
{
    public Toggle toggle;
    public InputField password;

    void Start()
    {
        toggle.onValueChanged.AddListener(ToggleClick);
    }

    void Update()
    {

    }

    public void ToggleClick(bool isShow)
    {
        password.contentType = isShow ? InputField.ContentType.Standard : InputField.ContentType.Password;
        password.Select();
    }
}

拖到Password上，并选择相应的Toggle和Password；

6. 运行；
   
   
   
7. 点击File->Build Settings…将Login加入，运行，输入账号及密码，点击登录，就会切换到下一界面，并且在Console会显示当前账号；
   
   
8. 进入Game界面，在https://github.com/cakeslice/Outline-Effect下载压缩包，解压后将Assets下OutlineEffect拖到Project的Assets下，将OutlineEffect脚本拖到摄像机上，然后在Scripts文件夹下新建脚本：

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

public class HighlightingObject : MonoBehaviour
{
    private bool isSelected = false;

    // Update is called once per frame
    void Update()
    {
        if(Input.GetMouseButtonDown(0))
        {
            Ray ray = Camera.main.ScreenPointToRay(Input.mousePosition);
            RaycastHit hit;
            if(Physics.Raycast(ray,out hit) && isSelected==true)
            {
                string output = "new position:" + hit.point.ToString();
                Debug.Log(output);
                gameObject.GetComponent().position = hit.point;
            }
            if(Physics.Raycast(ray,out hit) && isSelected == false && hit.transform == transform)
            {
                isSelected = true;
                Debug.Log("object selected");
                gameObject.AddComponent();
            }
        }
    }
}

将该脚本拖到物体上，这样物体就可以点击高亮并移动到鼠标点击的位置；

9. 但此时物体高亮后颜色也会改变，选择Main Camera的Outline Effect组件，修改参数：
   
   这样物体颜色就不会改变了；