界面 / UserWidget
UserWidget Class  
自定义控件
UI控件的集合,预制体UI
Hierarchy 
↳
UserWidget
Table of contents 
Accessors  
focusable(): boolean client | 
|---|
| 获取是否响应键盘焦点事件 | 
rootContent(): Canvas client | 
| 获取根Canvas | 
safeAreaEnable(): boolean client | 
| 是否适配安全区 | 
click
Accessors  
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 | 
| 获取名字 | 
onFocusChange(): Delegate<(absolutionPosition: Vector2) => boolean> client | 
| 焦点改变事件 | 
onFoucsLost(): Delegate<(absolutionPosition: Vector2) => boolean> client | 
| 丢失焦点事件 | 
onKeyDownEvent(): Delegate<(absolutionPosition: Vector2, keyEvent: KeyEvent) => boolean> client | 
| 按键按下事件 | 
onKeyUpEvent(): Delegate<(absolutionPosition: Vector2, keyEvent: KeyEvent) => boolean> client | 
| 按键抬起事件 | 
onMouseButtonDoubleClick(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标双击事件 | 
onMouseButtonDown(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标按下事件 | 
onMouseButtonUp(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标抬起事件 | 
onMouseEnter(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标进入控件事件 | 
onMouseLeave(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标离开控件事件 | 
onMouseMove(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标移动事件 | 
onMouseWheel(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 鼠标滚轮滚动事件 | 
onTouchEnded(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 触摸结束事件 | 
onTouchMoved(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 触摸移动事件 | 
onTouchStarted(): Delegate<(absolutionPosition: Vector2, pointEvent: PointerEvent) => boolean> client | 
| 触摸按下事件 | 
paintSpaceGeometry(): Geometry client | 
| 获取最后一次用于渲染Widget的几何信息 | 
parent(): Widget client | 
| 获取父节点 | 
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 | 
|---|
| 添加子节点 | 
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 | 
| 获取子节点数量 | 
invalidateLayoutAndVolatility(): void client | 
| 立刻触发重新渲染的和排布计算 | 
removeAllChildren(): void client | 
| 清除所有子节点,会销毁UI无法再使用 | 
removeChild(child: Widget): void client | 
| 移除节点,会销毁UI无法在使用 | 
removeChildAt(index: number): void client | 
| 移除第几个节点,会销毁UI无法再使用 | 
removeObject(): void client | 
| 立刻移除并添加到根节点 可以再使用 | 
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 | 返回创建的控件 | 
|---|