Unity类银河战士恶魔城学习总结（P129 Craft UI 合成面板UI）

【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili

教程源地址：https://www.udemy.com/course/2d-rpg-alexdev/

本章节实现了合成面板的UI设置

UI_CraftWindow.cs

字段作用：

1. UI 组件：

   • itemName / itemDescription / icon：显示装备名称、描述和图标。
   • craftButton：合成按钮，点击后执行合成逻辑。
   • materialImage：显示合成所需材料的图片和数量。

2. 数据输入：

   • SetCraftWindow(ItemData_Equipment _data)：传入装备数据用于更新窗口内容。

主要功能：

1. 清空已有材料显示：

   • 将所有 materialImage 和对应文字的颜色设置为透明，重置 UI。

2. 更新材料信息：

   • 遍历 craftingMaterials 列表，将材料图标和数量显示到对应 materialImage

3. 更新装备信息：

   • 显示装备的图标、名称和描述。

4. 绑定合成逻辑：

   • 为 craftButton 添加点击事件，调用CanCraft() 检查并处理合成逻辑。

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

public class UI_CraftWindow : MonoBehaviour
{
    [SerializeField] private TextMeshProUGUI itemName;
    [SerializeField] private TextMeshProUGUI itemDescription;
    [SerializeField] private Image icon;
    [SerializeField] private Button craftButton;   

    [SerializeField] private Image[] materialImage;


    public void SetCraftWindow(ItemData_Equipment _data)
    {
        for (int i = 0; i < materialImage.Length; i++)
        {
            materialImage[i].color = Color.clear;
            materialImage[i].GetComponentInChildren<TextMeshProUGUI>().color = Color.clear;
        }

        for (int i = 0; i < _data.craftingMaterials.Count; i++)
        {
            if(_data.craftingMaterials.Count > materialImage.Length)
                Debug.LogWarning("你拥有的材料比合成需要的材料多");

            materialImage[i].sprite = _data.craftingMaterials[i].data.icon;
            materialImage[i].color = Color.white;

            TextMeshProUGUI materialSlotText = materialImage[i].GetComponentInChildren<TextMeshProUGUI>();

            materialImage[i].GetComponentInChildren<TextMeshProUGUI>().text = _data.craftingMaterials[i].stackSize.ToString();
            materialImage[i].GetComponentInChildren<TextMeshProUGUI>().color = Color.white;

        }

        icon.sprite = _data.icon;
        itemName.text = _data.itemName;
        itemDescription.text = _data.GetDescription();

        craftButton.onClick.AddListener(() => Inventory.instance.CanCraft(_data,_data.craftingMaterials));
    }
}

UI_CraftList.cs

这段代码是用于管理合成装备界面的 Unity 脚本，核心功能包括动态生成合成槽列表、默认显示第一个装备详情，以及响应用户点击刷新列表：

1. 字段作用：

   • craftSlotParent：合成槽的父物体，用于容纳动态生成的合成槽。
   • craftSlotPrefab：合成槽的预制体。
   • craftEquipment：装备数据列表。

2. 主要方法：

   • SetupCraftList()：清空旧的合成槽并根据 craftEquipment 数据生成新的合成槽。
   • OnPointerDown()：用户点击时刷新合成槽列表。
   • SetupDefaultCraftWindow()：初始化并显示第一个装备的详情。

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class UI_CraftList : MonoBehaviour, IPointerDownHandler
{
    [SerializeField] private Transform craftSlotParent;//合成槽父物体
    [SerializeField] private GameObject craftSlotPrefab;//合成槽预制体

    [SerializeField] private List<ItemData_Equipment> craftEquipment;//合成装备列表
    

    void Start()
    {
        transform.parent.GetChild(0).GetComponent<UI_CraftList>().SetupCraftList();
        SetupDefaultCraftWindow();
    }

    
    public void SetupCraftList()
    {
        for (int i = 0; i < craftSlotParent.childCount; i++)
        {
            Destroy(craftSlotParent.GetChild(i).gameObject);
        }


        for (int i = 0; i < craftEquipment.Count; i++)
        {

            GameObject newSlot = Instantiate(craftSlotPrefab, craftSlotParent);
            newSlot.GetComponent<UI_CraftSlot>().SetupCraftSlot(craftEquipment[i]);

        }
    }

    public void OnPointerDown(PointerEventData eventData)
    {
        SetupCraftList();
    }


    public void SetupDefaultCraftWindow()
    {
        if (craftEquipment[0]!= null)
            GetComponentInParent<UI>().craftWindow.SetCraftWindow(craftEquipment[0]);
    }
}

UI_CraftSlot.cs

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

//2024年11月15日
//函数放在新的创建Craft panel的itemSlot里
public class UI_CraftSlot : UI_ItemSlot//继承物品槽UI
{

    protected override void Start()
    {
        base.Start();
    }


    public void SetupCraftSlot(ItemData_Equipment _data)//设置合成槽
    {

        if (_data == null)
            return;

        item.data = _data;

        itemImage.sprite = _data.icon;//设置图标
        itemText.text = _data.itemName;//设置名字

        if (itemText.text.Length > 12)
            itemText.fontSize = itemText.fontSize * .7f;
        else
            itemText.fontSize = 24;
    }

    private void OnValidate()
    {
        
    }


    public override void OnPointerDown(PointerEventData eventData)
    {
        //ItemData_Equipment craftData = item.data as ItemData_Equipment;

        //Inventory.instance.CanCraft(craftData, craftData.craftingMaterials);//检查是否可以制作该物品

        ui.craftWindow.SetCraftWindow(item.data as ItemData_Equipment);//设置合成窗口
    }
}