12 建一个商店，商店里面都是炮塔 (和儿子一起编游戏-塔防系列 )

本文链接：https://blog.csdn.net/xmsea/article/details/105980818

12.1 基本概念

标准的塔防游戏都会提供一个面板，玩家在面板上选择要置放什么样子的武器，这一款塔防也不例外。这里面就涉及到了U3D的界面配备和动态装配炮塔预制类。

12.2 做商店面板

老余首次接触U3D的界面设计，那是相当的不适应，首先要切换到2D不说，U3D还给整了好大的一块画布，可是不适应也得适应，人3D系统就这样，先做一个面板Panel出来：

那个竖着杵在那里的就是做界面的Canvas，一般情况下，我们要在2D模式下做界面布局，在游戏视图看效果：

老余秉承多年来的良好界面开发习惯，把Panel做到水平拉升，高度可修改：

接着老余试着在Panel上面加了一个按钮，这个按钮就是用来以后选择炮塔的，顺便把Panel名字改成ShopPanel，毕竟可读性还是非常重要的吗！

一开始老余给按钮设计的高和宽都是100像素

为了让多个按钮均匀分布，老余使用了Horizontal Layout Group的技术，这个在界面设计中很常见了，就是把子元素均匀排列，不管主界面放大缩小。

再接着，就是把按钮挂上炮塔的图标，老余在Prefab中找到马桶炮塔，直接在右侧预览图切了图，大概250 * 200像素，然后用免费的制图小工具把背景搞成透明色，存成.png文件待用

U3D对图片文件的使用有特别要求，否则放上来也看不见：

然后，老余把图片拖拽到Source Image上面去了：

老余改了一下Highlighted Color，这样能在鼠标划过的时候，他可以看到，毕竟易用性也很重要吗！

做好的按钮在设计视图和游戏视图都可以看见，效果还不错。

12.3 马桶炮塔基本可用

Shop的脚本关键的部分是SelectStandardTurret，通过按钮的onclick事件调用

using UnityEngine;

public class Shop : MonoBehaviour
{
    public TurretBlueprint standardTurret;
    public TurretBlueprint MLTurret;


    BuildManager buildManager;

    private void Start()
    {
        buildManager = BuildManager.instance;
    }
    public void SelectStandardTurret()
    {
        Debug.Log("Standard Turret Purchased");
        buildManager.SelectTurretToBuild(this.standardTurret);
    }

}

就在On Click()那个地方绑定就好了。