API界面 / UserWidget
UserWidget Class
自定义控件
UI控件的集合，预制体UI
Hierarchy
↳
UserWidget
Table of contents
Properties
click
Properties
onCustomPropertyChange: Readonly<MulticastDelegate<(path: string, value: unknown, oldValue: unknown) => void>> client |
|---|
| 监听自定义属性同步事件 |
Accessors
focusable(): boolean client |
|---|
| 获取是否响应键盘焦点事件 |
rootContent(): Canvas client |
| 获取根Canvas |
safeAreaEnable(): boolean client |
| 是否适配安全区 |
click
Accessors
alignPosition(): Readonly<Vector2> client |
|---|
| 获取控件的对齐位置,在对齐方式为靠右对齐、靠下对齐、中心对齐时，alignPosition的值与positon不同； |
autoSizeHorizontalEnable(): boolean client |
| 获取是否自动水平设置大小 |
autoSizeVerticalEnable(): boolean client |
| 获取是否自动垂直设置大小 |
cachedGeometry(): Geometry client |
| 获取上一次的GetTickSpaceGeometry |
constraints(): Readonly<UIConstraintAnchors> client |
| 获取控件的布局 |
desiredSize(): Vector2 client |
| 获取期望大小 |
enable(): boolean client |
| 是否可用 |
guid(): string client |
| 获取控件GUID |
isHovered(): boolean client |
| 是否是hovered |
mouseCursor(): MouseCursor client |
| 获取控件上光标类型 |
name(): string client |
| 获取名字 |
paintSpaceGeometry(): Geometry client |
| 获取最后一次用于渲染Widget的几何信息 |
parent(): Widget client |
| 获取父节点 |
pivot(): Vector2 client |
| 获取控件锚点位置,这个属性决定了控件图形与锚点的相对位置；(0,0)时，锚点位于控件左上角；(0.5,0.5)时，锚点位于控件正中心 |
position(): Readonly<Vector2> client |
| 获取控件的位置 |
renderOpacity(): number client |
| 获取渲染透明度 |
renderScale(): Vector2 client |
| 获取渲染缩放 |
renderShear(): Vector2 client |
| 获取渲染错切形变 |
renderTransformAngle(): number client |
| 获取渲染的角度 |
renderTransformPivot(): Vector2 client |
| 获取渲染锚点 |
size(): Vector2 client |
| 获取大小 |
tickSpaceGeometry(): Geometry client |
| 获取最后一次用于驱动Widget Tick的几何信息 |
transform(): Readonly<UITransform> client |
| 得到控件的大小和位置 |
visibility(): SlateVisibility client |
| 获取可见性 |
visible(): boolean client |
| 是否可见 |
zOrder(): number client |
| 获取zorder |
Methods
addToViewport(zOrder: number): void client |
|---|
| 添加到屏幕上 |
removeRootContent(): void client |
| 移除根Canvas，会销毁根Canvas，无法再次使用 |
newObject(parent?: Canvas): UserWidget client |
| 创建 UserWidget 控件 |
click
Methods
addChild(child: Widget): void client |
|---|
| 添加子节点 |
clone(position: Vector2, Parent?: Widget): Widget client |
| 克隆UI控件及其子节点到指定父控件位置（默认到其父节点） |
destroyObject(): void client |
| 立刻移除并销毁 不可以在使用 |
equal(that: Widget): boolean client |
| 判断是不是同一个对象 |
findChildByPath(inPath: string): Widget client |
| 通过相对路径查找节点 |
getChildAt(index: number): Widget client |
| 获取第几位子节点 |
getChildByName<T: extends Widget<T>>(name: string): T: extends Widget<T> client |
| 通过名字查找节点 |
getChildrenCount(): number client |
| 获取子节点数量 |
getCustomProperties(): string[] client |
| 获取所有自定义属性 |
getCustomProperty<T: extends CustomPropertyType>(propertyName: string): T: extends CustomPropertyType client |
| 获取自定义属性 |
getCustomPropertyChangeDelegate(property): Readonly<MulticastDelegate<(path: string, value: unknown, oldValue: unknown) => void>> client |
| 给定对象属性修改时触发的事件代理 |
invalidateLayoutAndVolatility(): void client |
| 立刻触发重新渲染的和排布计算 |
removeAllChildren(): void client |
| 清除所有子节点,会销毁UI无法再使用 |
removeChild(child: Widget): void client |
| 移除节点,会销毁UI无法在使用 |
removeChildAt(index: number): void client |
| 移除第几个节点,会销毁UI无法再使用 |
removeObject(): void client |
| 立刻移除并添加到根节点 可以再使用 |
serialize(): string client |
| 序列化UI控件 |
setCustomProperty(propertyName: string, value: undefined CustomPropertyType): void client |
| 设置自定义属性 |
deserialize(Data: string, Parent?: Widget): Widget client |
| 反序列化UI |
Properties
Accessors
focusable
• | • | ||||
|---|---|---|---|---|---|
获取是否响应键盘焦点事件 Returns
| 设置是否响应键盘焦点事件 Parameters
|
rootContent
• | • | ||||
|---|---|---|---|---|---|
获取根Canvas Returns
| 设置UI的根Canvas Parameters
|
safeAreaEnable
• | • | ||||
|---|---|---|---|---|---|
是否适配安全区 Returns
| 是否适配安全区 Parameters
|
Methods
addToViewport
• addToViewport(zOrder): void client
添加到屏幕上
Parameters
zOrder number | 添加到屏幕的层级关系 range:不做限制 type:整数 |
|---|
ts
@Component
export default class AccountExample extends Script {
protected onStart(): void {
if (!SystemUtil.isClient()) return;
let button = new ButtonUI();
}
}
class ButtonUI {
public button:StaleButton;
constructor() {
this.creatUI();
}
private creatUI() {
let size = WindowUtil.getViewportSize();
// 创建一个UI对象
let ui = UserWidget.newObject();
// 将UI添加到屏幕上
ui.addToViewport(1);
// 创建一个画布组件
let canvas = Canvas.newObject();
canvas.size = new Vector2(1920, 1080);
canvas.position = Vector2.zero;
// 将Ui的根画布设置为canvas
ui.rootContent = canvas;
this.button = StaleButton.newObject(canvas);
this.button.size = new Vector2(size.x / 14, size.y / 20);
this.button.text = "StaleButton";
this.button.fontSize = 18;
this.button.transitionEnable = true;
InputUtil.bindButton(Keys.X, this.button);
this.button.setPressedImageColorDecimal(200, 200, 200, 255);
this.button.onClicked.add(() => {
// 当按下按钮执行以下逻辑
console.log("The \"StaleButton\" button was pressed ~");
})
}
}@Component
export default class AccountExample extends Script {
protected onStart(): void {
if (!SystemUtil.isClient()) return;
let button = new ButtonUI();
}
}
class ButtonUI {
public button:StaleButton;
constructor() {
this.creatUI();
}
private creatUI() {
let size = WindowUtil.getViewportSize();
// 创建一个UI对象
let ui = UserWidget.newObject();
// 将UI添加到屏幕上
ui.addToViewport(1);
// 创建一个画布组件
let canvas = Canvas.newObject();
canvas.size = new Vector2(1920, 1080);
canvas.position = Vector2.zero;
// 将Ui的根画布设置为canvas
ui.rootContent = canvas;
this.button = StaleButton.newObject(canvas);
this.button.size = new Vector2(size.x / 14, size.y / 20);
this.button.text = "StaleButton";
this.button.fontSize = 18;
this.button.transitionEnable = true;
InputUtil.bindButton(Keys.X, this.button);
this.button.setPressedImageColorDecimal(200, 200, 200, 255);
this.button.onClicked.add(() => {
// 当按下按钮执行以下逻辑
console.log("The \"StaleButton\" button was pressed ~");
})
}
}removeRootContent
• removeRootContent(): void client
移除根Canvas，会销毁根Canvas，无法再次使用
newObject
• Static newObject(parent?): UserWidget client
创建 UserWidget 控件
Parameters
parent? Canvas | 创建控件的外Outer对象 default:null |
|---|
Returns
UserWidget | 返回创建的控件 |
|---|