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;elseitemText.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);//设置合成窗口}
}