大家好，我是灰（微博@天外灰仙儿），来自辉鸦工作室，该说的东西在第一期已经说过了，就让我们继续来学习吧~

由于上一期作业在课上都教过了，包括以后的作业我都只打算留课上教过的东西，所以下一期开头也不再做讲解了。作业目的是让大家不要眼高手低，跟着做一遍能加深印象！

一、新建一个实验场景吧！

上一期我们已经简单接触并使用了“变量（var）”和“方法（func）”，不知道大家还记不记得，不会还给我了吧！其实代码可以说就是由变量和方法来组成的，变量是用来储存数据的容器，而方法就是用来操纵变量的手段(#^.^#)

举个例子，如果变量是一个个食材，那方法就是各种各样的烹饪手段，这一期教程我们就先来认识一下各个食材——变量的种类。其实在我微博之前也发过一篇介绍各个种类的博，这一期我会展开讲讲，并带大家实践一下！

Godot，启动！！

还是先打开上一期的项目。

我们点这个加号，新建一个场景！

这一期是做资料卡嘛，这东西一听就是个UI！所以我们根节点选择用户界面~UI其实就是用户界面（User Interface）的缩写啦！

我们把根节点改个名字，就叫Test_2吧。

然后我们按ctrl+s保存一下，右键一下空白的地方，选择新建文件夹。

就取名叫lesson_2，然后点一下确定！

确保我们的路径已经到lesson_2了，然后点击保存。

选中根节点，然后点击这个加号来新建一个脚本！

全都默认的就好，我们点击创建！

这样最基础的开发环境我们就搭建好啦~

二、设计角色卡的样式吧！

我们点击上方的2D，回到2D视图。

现在的角色卡是空白的，我们来想一想资料卡一般需要啥东西呢？

首先肯定需要一个背景吧，我们右键根节点，选择添加子节点！

我们搜索一下panel，panel直译就是面板的意思，我们一般用它来担任UI最基础的背景框架！然后点击下方的创建就行了！话说添加子节点这个过程我后面可不可以省略掉呀T T，大家应该都会了吧！

这个小黑块就是我们新建出来的panel啦，但是它太小了，我希望它可以填满整个窗口！

 

我们点击这个绿色的锚点预设，然后选择整个矩形。

它就直接填满我们整个窗口啦！

接下来肯定需要一个头像对不对，很多有经验的朋友可能第一时间想到的就是Sprite2D节点，但是在节点列表里大家可以发现，Sprite2D节点是蓝色的，而UI相关的节点都是绿色的！

上面这个图里大家也发现了，原来各个节点也不是一家亲的，它们分为三个门派！首先它们共同属于Node大学（白色），分别下设了Node2D学院（蓝色）、Control学院（绿色）、Node3D学院（红色）！这正好对应了我们新建场景时，可以选择的三种根节点！

但这其实并不意味着，我们根节点选了Control（用户界面 UI），就只能在下面挂绿色的节点，其实也是可以挂蓝色节点的。不过蓝色的2D节点我们一般是用于游戏中的2D物体，绿色的UI节点一般用于UI，而资料卡上的头像明显更属于UI这一卦，所以用UI节点而不是用蓝色的Sprite2D节点更合适一些~

那接下来，我们添加新的子节点的时候，就不要在根节点上继续添加了，因为我希望这个头像以及其他的资料都可以附着在刚刚创建的Panel面板上，所以我们选择Panel节点，在它上面添加子节点！

在这里我们添加TextureRect节点，直译就是纹理方块，一个用于显示纹理的UI节点，它是绿色的！

大伙再准备一个头像，我相信大家手里应该都有吧，没有的话就用自己QQ头像！这里我准备的是我们辉鸦的OC，叫芙拉~

这个大家从电脑文件夹里直接拖拽到这就行！文件名一定要是英文！不是的话拖进来再改也行！

大家再把图直接拖拽到TextureRect的Texture里就行啦！

然后头像就会显示出来啦，做到这里大家可能会发现，这个图只能放大，不能缩小~

大家可以在Texture下面发现，现在的Expand Mode（缩放模式）是Keep Size（保持尺寸），在介绍里我们可以看到这种模式就是只能放大不能缩小的。

我们将其换成Ignore Size（忽略尺寸）就可以自由缩放啦~

同样的，我们把下面的Stretch Mode（拉伸模式）改为Keep Aspect Centered（保持比例并居中）。

这样我们随意拉伸，都可以让头像处于框框的中心，并且保持原始比例！

差不多挪挪位置，我就放左上方了，大家可以随意放喜欢的位置！

大家根据自己角色的配色不同，肯定也不希望背景完全相同，我们可以再次选中Panel，右键添加子节点。

就添加一个我们上一期讲到的ColorRect节点，用来改变颜色！

我们还是将锚点预设改为整个矩形。

然后大家会发现，连头像也被颜色盖住了！

这是因为节点也和绘画软件里的图层一样，是有层级关系的~越接近根节点的节点，显示的优先级越低！所以我们需要把ColorRect节点挪到头像的上方。

这样头像就正常显示出来啦！

然后选中ColorRect节点时，就可以在引擎右侧的检查器里修改颜色啦~

接下来，我们也是运用上节课学到的知识，来添加角色的资料信息！

三、添加角色信息

信息在界面上肯定是以文字形式显示了，大家还记得我们上次讲过的怎么做文字吗？只需要添加Label节点就可以了！

不过由于这次使用的Label会很多，我们一个个去调整字体太麻烦了！这里我来教大家一种批量改字体的方法，先新建两个Label节点~选中第一个Label节点，然后按ctrl+d也可以直接复制出来一个！

这里大家可能会有疑问，既然可以复制的话，那我做好一个Label，再批量复制不就行了？但这样的话，如果以后还想要修改字体的话，就需要一个个去修改调整了，非常麻烦！当然也可以使用Godot自带的主题系统，但是这个系统会让所有的Label都呈现出一个字体，也不是我们很希望的结果！

大家先选择第一个Label，可以在右边检查器里看到有一个Label Settings。

我们点击一下，然后选择新建。

再点一下展开，就可以编辑字体啦！

我们右键它，可以将其另存。

直接保存到lesson_2目录下。

之后我们选中第二个Label，再Label Settings里选择Quick Load快速加载或者加载。

找到我们刚刚创建的，打开！这样两个Label就挂载了同一个字体设置！之后我们修改任何一个地方的这个设置，就能同步到所有挂了这个设置的Label上了！

大家点击上面这个按钮，可以打开网格吸附，方便调整Label的位置！

在这里我就多复制了几个Label出来，随便调了调。值得注意的是，每一项我都把标签和内容分开了，比如“性别：”和“女”分别是两个Label。同时我希望大家包含的这些信息种类至少要和我写的一样，包括：

1、性别这种肯定框在了一定范围内的（这里不考虑除了男女之外的其他性别，当然你可以自行添加你所认可的性别，我没有加仅仅是因为我本人并不是特别了解跨性别等概念，未来有时间我一定多多了解）。

2、身高或体重这种需要有小数点后几位的。

3、职业名称和姓名这种需要用文字来表述的。

4、是否已婚或者是否有吸烟病史手术史这种只能回答“是或不是”的。

5、成绩或血量这种需要用整数来表示的。

在这里我还感觉名字应该大一点，但是又不希望修改一个名字导致影响其他字体的大小，又不想把名字的字体全都重新设置。可以在名字的Label里，右键这里。然后选择唯一化。

大家可以看到这里的名字变了，说明它已经不是我们之前用的那个Setting了，相当于又另存了一份！现在可以自由修改大小啦~

在这里我把可能会修改的内容放在这里，并且都改了名字，同时大家别忘了头像也是我们可能会修改的内容。至于为什么要这么做，我相信大家做资料卡肯定不想让这个卡用一次就完了，一定是希望这个可以作为一个模板，随时换其他角色也可以用！那么都改成我们起的名字，方便我们后续快速找到它们~

同时建议大家也像我一样，在名字后面也加上这个节点的类型，这样是防止后续可能会出现重名的问题~

四、如何灵活修改角色信息与变量运用

首先我们点击我们最开始创建的这个脚本。跳转到脚本视图。

我们按住shift键，点我们需要修改的这些节点里，最上面的一个，再点最下面的一个，就可以全选这些节点。

然后拖拽到脚本里，拖拽到这里后先按住ctrl，再松开左键，再松开ctrl，就能批量把这些节点都存到变量里。

在下面，我们开始创建新的变量。不知道大家对上节课的内容还有印象吗，var就是声明一个变量的意思，后面跟的白字profile就是这个变量的名字，是我们可以自定义的。冒号后面跟的绿字就是这个变量的类型，当不写类型的时候它就是一个动态的任意类型。这里我们希望头像是一个限制住的Texture2D（2d纹理）类型，所以这里就这样声明。

在这里我想继续声明角色的名字name，并且设置为String（字符串类型，用来储存文字），但是编译器报错了，并且name的颜色也是淡蓝色的。

这其实是因为系统自带的节点的名字属性也叫“name”，所以是重名了，那我们改成别的就行了！我就起名叫character_name（角色名）了！

下面设定性别时，有一个小难点，就是我们如何限制死只能有男和女两种性别呢？其实大家听到“限制”这个词时，可能会想到这好像和上面两行变量一样，它们把内容限制成了“2d纹理”和“文字”了，我们下面是不是也可以把性别限制成“男、女”呢？

有的朋友可能会想到创造一种新的变量类型，就叫性别！其实这样比较复杂，如果我们只是单纯地用于显示的话，可以创造一个枚举变量类型。

在这里enum就是创建枚举的意思，右边的Sex就是它名字，枚举的名字我一般习惯大写字母开头~后面跟着一个大括号{}，大括号里每一行都可以加一个你想限制死的元素，元素我们都习惯于设成全大写的。

同时每一个元素后面都跟着一个等于号和一个整数，因为这里我们其实并没有创建出一个新的变量类型，只是收集来了一些整数，把这些整数加个名字（如FEMALE、MALE）而已。这个等于号和整数也可以不写，系统会自动把元素从0开始编号的~每个元素定义好后，后面都要跟一个逗号用于分割！

大家后续使用Sex枚举的时候，可以直接使用Sex.FEMALE，当然大家也可以试着print一下Sex.FEMALE，可以发现这个输出就是1，不会显示元素名。所以枚举本质上就是一个限制了范围的整数集合！

那下面我们就可以把sex（性别，注意是全小写的）的变量类型设置为Sex啦！

下面我们再设置一下身高的变量，类型是float（小数类型，也叫浮点数类型）。

接着是job，String类型，和姓名一样。

然后是婚否这一项，因为只有是和否两种回答（不考虑保密这个选项），所以我们类型设置为bool（布尔值），布尔是一个只包含true（真）和false（假）的一个枚举！这里true就是1，false就是0。但因为它太过常用，已经成功成为了系统自带类型，所以我们也不需要bool.true这样使用，直接用true就行了！

最后我们加上成绩变量，限制为int（整数类型）。

为了能明显体现出我们的变量切换，这里再导入一个头像~这节课我们暂时不用，下节课会用到，所以暂时没有也没关系！

下面我肯定是希望这些变量都可以在外部修改的，而不是每次都操纵代码或者去一个个改节点的属性~所以我们可以在这些变量前面全部加上@export 。

这样我们选择根节点，可以在检查器里看到，这些属性居然和系统自带的那些属性一样显示了~

当然也可以设置一下默认的值，比如这里我先把两个头像从文件系统里拖拽到代码里，一样也是按住ctrl再松开左键！（一个也行！）

大家可以看到，这次前面的类型不是var，而是const。const和var正好相反，它不是变量而是“常量”，也就是无法修改的量。常量的名字我们一般习惯用全大写字母来表示。大家还记得前面哪里也是用的全大写字母吗？没错，就是在枚举里，每个元素也是全大写字母的，因为这些元素对应的整数也是定义好之后就不可以再修改了！

等于号后面的preload加路径，其实和@onready很像，都是提前加载好这些资源，只不过节点的路径是在节点树里，这些文件系统里拖来的路径是对应的文件夹路径。

然后我们可以在这里加上= PROFILE，也就是我们刚导入到代码里的图片。

可以看到在检查器里已经帮我们挂上了默认的图片！

接下来我们把默认值都给加上。

大家就能看到这里已经将默认值都修改好啦！

下面我希望游戏启动的时候，能够自动把这些信息同步到资料卡上。那我们可以在ready方法里，把这些Label的text属性全都给改成我们的变量，就像上节课讲的一样！

那大家在实际操作中，大概率会和下图一样，全部飘红~

在这里我们一个个解决，首先text属性本身是只接受String类型的变量的，什么布尔、整数、小数类型它都不识别，所以我们需要把这些值在传进去前先转化成String类型！

其实也很简单，把变量前面加个str再用括号括起来就行，str就是String的缩写！

接下来运行的时候，大家可以看到，大部分数据都对了，但是性别怎么是1呢（虽然某些情况下来说也不是不行），这个婚否怎么是false呢，虽然意思也对，但怎么看都觉得别扭！

实际上大家也能发现，出问题的两个都是枚举类型（还记得吗，bool也是一种特殊的枚举）。我们不希望它们显示枚举本身的内容，而是希望能显示出枚举所代表的含义（比如男、女、是、否等等）。

在这里我教大家一个三元运算符：【真值 if 条件 else 假值】。

我直接举一个实例给大家看。

在这里，就是用if判断一下后面的变量是0还是非0，if直译就是“如果”。

就是说如果后面跟的变量是0，就判断为“假”；如果跟的变量非0，就判断为“真”！当“条件”也就是这个变量为真时，就把真值交出来，如果变量为假时，就把假值交出来。

那么对于sex来说，1是女，0是男，那么女就是真值，男就是假值，这样就可以根据sex来直接判断把哪个字给text啦~对于married也是同理哦！现在运行一下就没有问题啦！

五、作业

结合本节课所学内容，做出一个自己OC或者喜欢的角色的资料卡！其实TextureRect节点也可以用来放在最底层用于显示背景，这个大家可以自由发挥哈~

最后我希望你的作业可以由两张图组成，一个是资料卡的整体效果，另一个是检查器里的属性。我要看看你是否把每个属性都设成了对的类型，而不是一股脑全用String了！因为合理使用变量是防止出错，优化内存，加快计算的非常重要的手段！

喜欢钻研的朋友可以去尝试一下怎么制作动态的资料卡，甚至说可以互动的资料卡~还可以随时一键切换资料卡内容等等功能！期待你的作品！