小米 发表于 2024-7-15 18:23

Brackeys系列学习实战--塔防游戏解读【1】



https://www.zhihu.com/video/1516037382473916416
这个开头真是令我泪奔。。。最爱的Brackeys,在油管上的受欢迎度举世瞩目。他的教程有趣,也并不涉及高级复杂的语法,总是笑脸的的brackeys真是让人不舍他这个频道的停更。
于是我决定要再复习一下他的课程。
今天筹备从头快速学习一下这个有趣的游戏,但愿能带你一起入坑unity开发。。。


游戏源码github地址:git@github.com:pikaqi-dot/Tower-Defense-Tutorial.git
在开始运行前请确保游戏场景都在build setting中已经插手:


游戏玩法:


https://www.zhihu.com/video/1516090420731420672
主菜单场景



看层级场景视图:


SceneFader

在SceneFader场景对象上挂载着SceneFader.cs脚本
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.SceneManagement;
using System.Collections;

public class SceneFader : MonoBehaviour {

        public Image img;
        public AnimationCurve curve;

        void Start ()
        {
                StartCoroutine(FadeIn());
        }

        public void FadeTo (string scene)
        {
                StartCoroutine(FadeOut(scene));
        }

        IEnumerator FadeIn ()
        {
                float t = 1f;

                while (t > 0f)
                {
                        t -= Time.deltaTime;
                        float a = curve.Evaluate(t);
                        img.color = new Color (0f, 0f, 0f, a);
                        yield return 0;
                }
        }

        IEnumerator FadeOut(string scene)
        {
                float t = 0f;

                while (t < 1f)
                {
                        t += Time.deltaTime;
                        float a = curve.Evaluate(t);
                        img.color = new Color(0f, 0f, 0f, a);
                        yield return 0;
                }

                SceneManager.LoadScene(scene);
        }

}定义了两个协程FadeIn和FadeOut,并在开始时调用FadeIn。公开变量会序列化显示在面板上。



声明AnimationCurve属性的变量可以获得调整曲线


并用AnimationCurve.Evaluate方式传入曲线横轴数值,返回纵轴数值。


注意到FadeIn是从1减到0,FadeOut是从0加到1。则正是横轴从左到右和从右到左读取的效果。
可以看到Img插槽里是该预制体内的子物体Black,它的属性检视面板:


Image组件是unity自有的,其下的color属性:


可以看到第四个值是A,代表着透明度,试着拉一下就知道0是透明,1是全黑。由此就与曲线对应上了。
脚本里面的
float a = curve.Evaluate(t);
img.color = new Color(0f, 0f, 0f, a);也正是该用意。
UI场景对象的标签:


其位置信息的组件:【Rect代表着矩形的意思】


注意和Transform组件的区别。它有Anchors和Pivot,以及定位东西。

<hr/>我们可以看到RectTransform 的父类为 Transform,我们可以把RectTransform看做Transform的升级版

   Transform用RectTransform的方式需要向下转型
(Transform as RectTransform)
    RectTransform也可以直接用Transform接收可以直接向上转型
Trasnform tr = GetComponent<RectTransform>();

RectTransform也可以直接用Transform接收可以直接向上转型
Transform(针对非UI)、RectTransform(针对UI)
Anchors是在子类锚在父类上的点,因此如果没有父类(RectTransform),那么RectTransform属性面板上的Anchor Presets将不成设置,但Anchors仍可设置。

新建GameObject的时候,会自动创建一个负责打点大小、坐标等信息的控件Transform



而新建2D Object(Sprite)或者UI下的其他控件时,则Transform变成了RectTrasnform。 假如创建的GameObject下有UI对象且需要进行自适应的操作,则可以在此GameObject下再添加一个RectTransform的控件,Unity会提示是否替代本来的Transform控件,这时选yes即可。 变成RectTransform之后:



<hr/>



下面这个东西我没咋用过




Canvas Renderer


再来看该预制体下的Canvas子物体,它的属性检视面板


这里的组件要注意,Canvas组件的Render Mode属性选择
canvas的Render Mode共有三种模式:Screen Space -OverLay、Screen Space-Camera、World Space。
creen Space -OverLay:Camera相机的感化就是把它所投射获取到的界面当做UI界面。一般情况下,UI界面只是一个二维平面,所以把相机的投影设置为Orthographic,即正交投影,Culling Mask设置为UI,暗示只显示跟UI层相关的信息,接着再调整一下相机的Size,让他的大小与Canvas的保持一致,最后再设置一下相机的Z值,保证Canvas在相机之前。
Screen Space -OverLay:可以理解为Unity为你自动设置好了UICamera,而且这个相机的Depth值是大于100的(相机能设置的最大Depth值为100),所以永远显示在最前面。此模式UICamera的Z值应该是-1000,所以Z值只要大于-1000并在UICamera的正交投影范围内,就有可能显示的UI界面上。【PS depth和z值要区分清楚】
World Space就更简单了,就是把UI当做三维物体来措置。
参考unity 搞懂Canvas的Render Mode的三种模式
该脚本的最后一条:
SceneManager.LoadScene(scene);加载场景。记得要在开头引入:
using UnityEngine.SceneManagement;如果项目复杂的话还需要引入定名空间 namespace,这样可以减少冲突。
MainMenu



打开MainMenu.cs脚本
using UnityEngine;
using UnityEngine.SceneManagement;

public class MainMenu : MonoBehaviour {

        public string levelToLoad = ”MainLevel”;

        public SceneFader sceneFader;

        public void Play ()
        {
                sceneFader.FadeTo(levelToLoad);
        }

        public void Quit ()
        {
                Debug.Log(”Exciting...”);
                Application.Quit();
        }

}这里通过在面板上拖放来获得SceneFader场景对象身上的SceneFader脚本引用实例,并调用此中的公共方式FadeTo。
Application.Quit();退出
Main Camera



Directional Light





GroundPlane







StandardTurret









注意此时render mode 为world space,Rect Transform 组件调参数。



https://www.zhihu.com/video/1516372349004185600




注意此时Button组件的Transition属性为Animation。动画控制控制的是Button







https://www.zhihu.com/video/1516163552822419456


EvenySystem





画布衬着器


画布衬着器 (Canvas Renderer) 组件用于衬着画布中包含的图形 UI 对象。


属性

画布衬着器在 Inspector 中没有公开属性。
详细信息

菜单 (GameObject > Create UI) 中提供的尺度 UI 对象全部都可以在任何需要的处所附加画布衬着器,但对于自定义 UI 对象,可能需要手动添加此组件。虽然 Inspector 中没有公开属性,但可通过脚本访谒一些属性和函数;请参阅脚本参考中的 CanvasRenderer 页面以了解完整的详细信息。
页: [1]
查看完整版本: Brackeys系列学习实战--塔防游戏解读【1】