Appearance
C-🖼️ 游戏用户界面
ClientUI 是管理游戏界面的主要接口,它提供了以下核心功能:
- 界面布局:管理 UI 节点的层级、位置、尺寸等布局属性
- 节点管理:创建和操作各类 UI 节点(屏幕、盒子、图片、文本、输入框等)
- 事件系统:处理用户交互、节点状态变化等事件
- 样式控制:自定义节点的颜色、透明度、旋转等视觉效果
提示
在推出此功能前,已有 GUI 功能(基于 xml 编写)。但已不推荐使用,因有更优方案且支持可视化编辑。推荐使用最新的 ClientUI。 对旧版 GUI 感兴趣可查阅d.ts 文件。
类定义
typescript
declare const ui: UiNode;
declare const input: InputSystem;
declare const screenWidth: number; // 全局对象,获取当前玩家屏幕宽度
declare const screenHeight: number; // 全局对象,获取当前玩家屏幕高度
declare class InputSystem {
//...
}
declare class UiNode {
//...
}
属性列表
基础属性
节点结构
布局与变换
anchor
: 节点锚点,用于确定位置position
: 相对于父节点的位置size
: 节点尺寸rotation
: 旋转角度uiScale
: 等比例缩放数据autoResize
: 自动调整尺寸的方式
外观样式
backgroundColor
: 背景颜色backgroundOpacity
: 背景透明度pointerEventBehavior
: 鼠标指针事件响应方式
图片节点
image
: 图片内容(路径或 URL)imageOpacity
: 图片透明度imageDisplayMode
: 图像显示模式complete
: 图片加载状态
文本节点
textContent
: 文本内容richText
: 是否支持富文本textFontSize
: 字体大小textColor
: 文本颜色textFontFamily
: 字体样式textXAlignment
: 水平对齐方式textYAlignment
: 垂直对齐方式autoWordWrap
: 自动换行textLineHeight
: 行高textStrokeColor
: 描边颜色textStrokeOpacity
: 描边透明度textStrokeThickness
: 描边厚度
输入节点
placeholderColor
: 占位文本颜色placeholderOpacity
: 占位文本透明度isFocus
: 是否处于焦点状态
方法
节点操作
findChildByName
: 按名称查找子节点clone
: 复制节点
节点创建
屏幕管理
getAllScreen
: 获取所有屏幕实例
输入控制
focus
: 使输入框获得焦点blur
: 使输入框失去焦点unlockPointer
: 显示鼠标指针lockPointer
: 隐藏鼠标指针
事件处理
on
: 监听事件once
: 监听一次性事件add
: 添加事件监听器(同 on)emit
: 触发事件remove
: 移除第一个匹配的监听器off
: 移除事件监听器(同 remove)removeAll
: 移除所有监听器
枚举值
PointerEventBehavior
: 鼠标指针事件行为ImageDisplayMode
: 图像显示模式UITextFontFamily
: 字体样式