天工维度魔兽争霸开发者社区-全国最大的TJ集中营-原提百万联盟

标题: 【通用】UI系列教程（一） [打印本页]

作者: Seago 时间: 2020-11-12 20:15
标题: 【通用】UI系列教程（一）
本帖最后由 Seago 于 2021-6-2 21:26 编辑

许多UI功能看似唬人，其实实现并不难。UI的难点主要在美术设计，而不是功能实现。本系列教程旨在让更多的作者学会UI的使用、组合，避免智商税。
本篇主要介绍一些基础性的知识概念，以帮助大家更好的理解。具体的操作现在已经有很多免费的UI教程可以学习了，不做过多阐述。
后续教程将逐步深入讲述如何搭建自己的UI系统。

UI的存在形式
对于代码而言，UI是以整数的形式存在的，T中定义了一个Frame类型，也许是为了方便区分，但本质还是一个整数。这个整数应该是UI的内存地址，我们不需要关心。
整数的存在形式给我们带来了一些便利。最大的好处莫过于可以配合哈希表来存储相关的数据，建立关联关系，方便我们搭建一套UI系统。

UI的类型
从使用角度来说，UI分为两大类，一类是基于Frame框架的，一类是基于SimpleFrame框架的，这两类互相独立，即不能作为对方的father节点，否则直接崩溃。
Frame框架是我们比较常用的，如BACKDROP，TEXT，BUTTON这些都是Frame框架下的。
SimpleFrame主要是一些信息面板，如英雄属性、单位攻防等。关于SimpleFrame的常用操作，367大佬有发过教程，站内搜索UI相关的教程可以找到。

UI的创建
针对Frame类型的框架，主要使用带Tag标签的创建方法。比较重要的是father和template两个参数。father节点可以统一控制显隐，即隐藏了一个UI，所以以他为father节点的UI都会被一起隐藏。
template即模板名称。如果fdf文件中能找到同名的模板，则会按照fdf中定义的格式进行创建，如果没找到，则会按照默认的格式进行创建。
UI的位置
相对位置：相对于其他UI的位置。
绝对位置：相对于屏幕坐标的位置。屏幕左下角为（0，0）点右上角（0.8，0.6）

FDF文件
FDF文件可以帮我们快速定义一套UI模板，以减少触发的编写量。详细的FDF教程，站长Carlos在CSDN上有发表教程，可以前往学习。

UI的颜色与透明度
本质是8位的16进制数，每两位分别表示RGBA，0-FF即对应0-256。
设置透明度是管用的，根据需要直接设置即可。通过计时器来不断地调整透明度即可实现淡入、淡出、闪烁等效果。

作者: thk1992 时间: 2020-11-15 01:17
沙发，支持一下

作者: Seago 时间: 2020-11-15 04:50

thk1992 发表于 2020-11-15 01:17
沙发，支持一下

多谢

作者: jack-z 时间: 2020-11-15 21:13
支持一下，兄弟加油更一下，我想知道，怎么样能简单的控制ui的大小和位置啊，我调整这个都快吐了

作者: Seago 时间: 2020-11-16 03:11

jack-z 发表于 2020-11-15 21:13
支持一下，兄弟加油更一下，我想知道，怎么样能简单的控制ui的大小和位置啊，我调整这个都快吐了 ...

如果你是想创建时获取到比较准确的数值，那比较无能为力。这个要么使用工具辅助，要么就是靠经验凭感觉。如果是需要在运行时动态的改的话，这个教程里应该会讲。

作者: gandi2019 时间: 2020-12-15 09:57

沙发，支持一下

作者: xiaoqilin910 时间: 2021-12-18 13:05
加油！大佬，顶起来

作者: cn52099 时间: 2022-1-20 23:39
开始学习

作者: pufmqxsg 时间: 2023-8-11 11:47
我来支持一下，感谢分享

欢迎光临天工维度魔兽争霸开发者社区-全国最大的TJ集中营-原提百万联盟 (http://bbs.mvprpg.com/)