以下均为来自中国大学mooc 游戏引擎原理及应用时的学习笔记


文章目录

  • 6.1 控件
  • 6.2界面功能实现
  • 6.3 界面美化


6.1 控件

unity引擎结构 unity引擎入门_unity引擎结构


unity引擎结构 unity引擎入门_游戏_02


unity引擎结构 unity引擎入门_unity引擎结构_03


unity引擎结构 unity引擎入门_unity引擎结构_04


首先在unity中新建一个text

unity引擎结构 unity引擎入门_游戏_05


text是依赖于画布存在的

可以调节字号字体位置

注意文本框是有宽度和高度的 超过了这个宽度和高度的字不会显示 除非设置成overflow

unity引擎结构 unity引擎入门_unity引擎结构_06


wrap和truncate无法表示超出文本框的内容

overflow代表允许溢出 (也就是会表示

unity引擎结构 unity引擎入门_unity引擎结构_07


按下alt+鼠标左键即可调整text在画布中的位置

unity引擎结构 unity引擎入门_游戏开发_08


(将锚点设置为0.5 0.5就可以 使得左上对齐

unity引擎结构 unity引擎入门_unity3d_09


其中文本中的这个text代笔

unity引擎结构 unity引擎入门_unity_10


代表会随着button的变化而有所拉伸想要出现一个下拉菜单可以使用dropdown

可以在dropdown 的Arrow中修改这个箭头的图片

unity引擎结构 unity引擎入门_unity引擎结构_11


unity引擎结构 unity引擎入门_游戏_12


这里可以调整颜色

这里可以调整选项

unity引擎结构 unity引擎入门_游戏开发_13


unity引擎结构 unity引擎入门_unity3d_14

slider控件

unity引擎结构 unity引擎入门_unity3d_15


unity引擎结构 unity引擎入门_unity引擎结构_16


unity引擎结构 unity引擎入门_游戏_17


unity引擎结构 unity引擎入门_游戏_18


这里可以将颜色修改成这种效果

这里还可以修改滑块的颜色及图片的颜色

unity引擎结构 unity引擎入门_游戏开发_19


unity引擎结构 unity引擎入门_游戏_20


inputfield组件在运行时输入的文字可以在text中呈现

unity引擎结构 unity引擎入门_unity_21


我们看到在这个分隔符以上的都是不可以交互的

在分隔符以下的都是

unity引擎结构 unity引擎入门_unity_22


unity引擎结构 unity引擎入门_unity_23


这个可以通过缩放来调整这个ui的窗口的大小

unity引擎结构 unity引擎入门_unity引擎结构_24


这个可以用来调整窗口边缘的柔和度

unity引擎结构 unity引擎入门_unity引擎结构_25

unity引擎结构 unity引擎入门_游戏_26


这个physcal设置意思是无论屏幕分辨率是多少 这个组件都保持固定的物理大小

6.2界面功能实现

unity引擎结构 unity引擎入门_游戏开发_27


unity引擎结构 unity引擎入门_unity3d_28


unity引擎结构 unity引擎入门_unity3d_29


unity引擎结构 unity引擎入门_游戏_30


unity引擎结构 unity引擎入门_unity引擎结构_31


首先我们在unity中创建如下的ui

unity引擎结构 unity引擎入门_unity3d_32


然后输入以下脚本

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class SJB : MonoBehaviour
{
    public Sprite ST;//这是三张剪刀石头布的图片 形式以精灵的形式来表达
    public Sprite JD;
    public Sprite BU;
    public Text Score;//分数比的text 
    public Image PlayerGesture;//放手势图片的地方
    public Image AIGesture;
    //以上这两个东西都是开放给unity界面然后将对应的组件要挂接到物体上去才行
    public int PlayerScore=0;
    public int AIScore=0;
    void Start()
    {
        
    }

    void Update()
    {
        Score.text = PlayerScore.ToString() + ":" + AIScore.ToString();
    }
    public void Call_ST()//这三个函数是要给按下button时候触发的函数
    {
        Call(0);
    }
    public void Call_JD()
    {
        Call(1);
    }
    public void Call_BU()
    {
        Call(2);
    }
    public void Call(int i)
    {
        int ai = Random.Range(0, 3);
        Num2Img(i, PlayerGesture);
        Num2Img(ai, AIGesture);
        if (i == ai)
        {

        }
        else if (i == 0)
        {
            if (ai == 1)
            {
                PlayerScore++;
            }
            else if (ai == 2)
            {
                AIScore++;
            }
        }
        else if (i == 1)
        {
            if (ai == 2)
            {
                PlayerScore++;
            }
            else if (ai == 0)
            {
                AIScore++;
            }
        }
        else if (i == 2)
        {
            if (ai == 0)
            {
                PlayerScore++;
            }
            else if (ai == 1)
            {
                AIScore++;
            }
        }
    }

    public void Num2Img(int n,Image img)
    {
        switch (n)
        {
            case 0:img.sprite = ST;break;
            case 1:img.sprite = JD;break;
            case 2:img.sprite = BU;break;
        }
    }
}

我们需要用一个物体来挂接脚本,然后将ui中的组件挂接到脚本上,因此我们创建一个空物体,然后将ui中的组件还有图片挂接到脚本上

unity引擎结构 unity引擎入门_游戏开发_33

由于这里存储的是精灵的形式

因此导入的图片也要将其形式转换成精灵

unity引擎结构 unity引擎入门_unity3d_34

对于按钮来说需要这样进行挂接:

unity引擎结构 unity引擎入门_unity引擎结构_35


首先需要把那个物体挂接上来,然后当按下这个按钮的时候我们让它call这个物体上的这个函数运行后便可得到结果

unity引擎结构 unity引擎入门_unity3d_36

6.3 界面美化

unity引擎结构 unity引擎入门_unity_37


unity引擎结构 unity引擎入门_游戏开发_38


unity引擎结构 unity引擎入门_unity引擎结构_39


unity引擎结构 unity引擎入门_游戏开发_40


unity引擎结构 unity引擎入门_游戏_41


unity引擎结构 unity引擎入门_unity3d_42


像这种显示减少了界面的存在感 还和游戏融为了一体

unity引擎结构 unity引擎入门_unity引擎结构_43


unity引擎结构 unity引擎入门_unity引擎结构_44


选择不同的种族会表现出不同的界面

我们建立一个ui的平面 并且为其附上颜色

unity引擎结构 unity引擎入门_unity_45


注意这里 我们给画布添加上一个grid layout组件,便可以使得panel中的物体有规则的排布,但是需要注意一点的是这些button必须是panel的子物体 否则的话无法实现

unity引擎结构 unity引擎入门_unity引擎结构_46

这里可以调整间距 还有每个按钮的大小

这个组件也可以调整位置

unity引擎结构 unity引擎入门_unity3d_47


unity引擎结构 unity引擎入门_游戏_48

child alignment可以处理整体在画布中的位置的对齐方式
或者说是调整最左边或者最右边或最上面的物体

这个方法

unity引擎结构 unity引擎入门_unity3d_49


可以使得调整的某个物体只按什么列

字体美化:

unity引擎结构 unity引擎入门_unity3d_50


在text中添加outline插件可以使得字体美化