unity2D横版游戏教程5-UI

Posted 2023-03-29 真的没事鸭

UI是User Interface的缩写，也就是用户界面。像登录界面的按钮，游戏的得分，暂停的按钮等都是UI

 

之前我门创建一个Cherries变量来计算我们收集樱桃的数量，现在我们创建一个UI来显示我们收集樱桃的数量

我们在Hierarchy界面右键->UI，这些都是UI，比如按钮，滚动条，文字等等

 我们需要创建一个Canvas(画布)，Canvas相当承载UI元素的容器，我们的UI都在Canvas里面

 EventSystem是创建Canvas自动生成的，就是一个情景触发的系统，先不用管他

我们在Canvas下面创建一个一个Text文本组件用来显示文字，右键->UI->Legacy->Text,Legacy里面是老的UI组件，现在已经有新的，功能更强大的组件代替他们，所以他们就移到了Legacy里面，不过也可以使用。

比如Text-TextMeshPro也是文本组件，不过比Text功能更加齐全。不过我们这里用老的Text而不用Text-TextMeshPro,因为新的Text-TextMeshPro不支持中文输入，老的Text支持中文输入而且操作也更简单一点

如果想要让Text-TextMeshPro支持中文输入可以参考这篇文章：unity最新版本的Text（TMP）UI文本怎么显示中文_真的没事鸭的博客-CSDN博客_unity的text不显示中文

 创建好之后，我们双击Canvas，我们发现Canvas好像脱离了游戏画面，是一个单独呈现的屏幕。没错，UI的元素都会在单独的Canvas界面上编辑，方便我们区分游戏的画面

 我们调整一下Text的位置，我们在Hierarchy栏点击Text，在右边属性栏有个锚点预设

 我们点击这个方框，按住alt键选择右上角的方框，这样Text组件就自动跑到右上角的位置，并且设置完锚点之后，无论屏幕怎么变，Text始终在屏幕的右上角的位置，注意我们下面的图片是没有按住alt键时的情景，我们按住alt选择白色框框的位置就行。

 我们把Text中文字调整一下，调整成居中对齐，改变一下字体的大小还有颜色，同时把Text的内容改一下，改成”樱桃：0”

 调整之后是这样的

 接下来我们就要让这个UI跟随我们的角色收集的数量发生变化，我们打开playercontroller代码，目前现在只有playercontroller这一个C#代码文件

我们要让Text跟随角色发生变化，那么我们首先要获得Text组件，所以我们声明一下Text变量，但是发现Text报错了。

 我们按住alt+回车，发现是因为缺少了对应的命名空间

 所以我们加上UnityEngine.UI命名空间

 

 这样Text就不会报错了

我们让cherries每次加一就设置一下Text的内容，这样Text就跟随cherries发生变化了

 这样就做好了，但是运行之前记得把Text拖给player

 这样每碰到一个樱桃，显示的樱桃数量就会加一

最后贴一下playercontroller的代码

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

public class playercontroller : MonoBehaviour

    private Rigidbody2D rb;//获得Rigidbody2D组件
    private Collider2D coll;//获得Collider2D组件
    private Animator anim;//获得动画组件
    public float speed, jumpForce;//公开，设置速度和跳跃力
    public LayerMask ground;//获得地面图层
    public Transform groundCheck;//检测角色是否碰到地面
    private bool isJump, isGround;//判断是否按下空格键,判断是否在地面
    private int jumpCount;//用来设置角色是几段跳
    private int cherries;//计数变量
    public Text cherryText;//樱桃计数的UI组件

    //初始化
    void Start()
    
        rb = GetComponent<Rigidbody2D>();
        coll = GetComponent<Collider2D>();
        anim = GetComponent<Animator>();
    

    void Update()
    
        //如果按下空格键并且在地面上
        if (Input.GetKeyDown(KeyCode.Space) && jumpCount > 0)
        
            isJump = true;
        
    
    private void FixedUpdate()
    
        isGround = Physics2D.OverlapCircle(groundCheck.position, 0.1f, ground);
        Movement();
        Jump();
        SwitchAnim();
    

    //基础移动
    void Movement()
    
        float horizontal = Input.GetAxisRaw("Horizontal");
        rb.velocity = new Vector2(horizontal * speed, rb.velocity.y);//设置x轴的移动
        //设置角色的转向问题
        if (horizontal != 0)
        
            transform.localScale = new Vector3(horizontal, 1, 1);
            anim.SetBool("run", true);
        
        else
            anim.SetBool("run", false);
    

    //跳跃
    void Jump()
    
        //如果在地面设置二段跳
        if (isGround)
        
            jumpCount = 2;
        
        //按下跳跃键且在地面上
        if (isJump && isGround)
        
            rb.velocity = new Vector2(rb.velocity.x, jumpForce);
            jumpCount--;
            isJump = false;
        
        //按下跳跃键且不在地面上且jumpCount大于0
        else if (isJump && !isGround && jumpCount > 0)
        
            rb.velocity = new Vector2(rb.velocity.x, jumpForce);
            jumpCount--;
            isJump = false;
        
    

    //切换动画
    void SwitchAnim()
    
        //如果在下落状态
        if (rb.velocity.y < 0 && !isGround)
        
            anim.SetBool("fall", true);
            anim.SetBool("jump", false);
        
        //如果在跳跃状态
        if (!isGround && rb.velocity.y > 0)
        
            anim.SetBool("jump", true);
        
        //如果在地面上
        else if (coll.IsTouchingLayers(ground))
        
            anim.SetBool("fall", false);
        
    

    //判断是否碰到物品
    private void OnTriggerEnter2D(Collider2D collision)
    
        if(collision.tag=="Collection")
        
            Destroy(collision.gameObject);
            cherries++;
            cherryText.text = "樱桃：" + cherries;