docs/基类.md · 伍拾陆/ccc-tnt-framework

# 基类
## `GComponent` 
继承自 `Component`

属性
- `prefabUrl`，`bundle`：需要子类搭配【类装饰器】 `@prefabUrl("xxx/xxx","bundle")` 或者 `@prefabUrl("bundle#xxx/xxx")` 使用。  
- `loaderKey`： 属性为 资源管理器的键值，用以保证资源能够正确的加载和释放，尽量不要手动去设置这个值  
为保持接口风格统一，使用 onStart 代理 start ， 也可以直接使用 start ，不影响。

方法

- `find`:  获取节点，与引擎的 find 不同的是这里传入的是节点名而非节点路径
- `getNodeByName`： 获取节点，等同于 `find`
- `loadPrefabNode`： 使用当前脚本的加载器加载预制体
- `addPrefabNode`： 使用当前脚本的加载器加载预制体并添加到指定节点

>在首次调用 `getNodeByName` 或 `find` 时，框架会自动创建节点树缓存，减小后续使用此接口的开销。  
>
>注意：  
如果想查找动态添加的节点，需要先调用 `resetNodeCache` 清理缓存，否则无法查找到。  
如果提供了动态添加节点的父节点，则可以不用调用 `resetNodeCache`，方法会自动对缓存打补丁。     
>  
>例如：  
在节点 `NodeA` 上动态添加了节点 `NodeB`  
调用 `this.getNodeByName("NodeB",NodeA)` 能够正常查找到节点 `NodeB`  
调用 `this.getNodeByName("NodeB")` 则无法查找到，这时候需要调用 `this.resetNodeCache()`。

##  `UIBase` 
继承自 `GComponent`

实现了大部分 `ComponentUtils` 中的功能

`UIBase` 的子类  
- `UIItem` 小部件
- `UIPanel` 面板
- `UIWindowBase` 弹窗基类
  - `UIPopup` 模态窗口 会自动生成半透明蒙版
  - `UIWindow` 全屏窗口 需要手动设置背景图

1. UI 基类
每一个作为预制体的小部件、面板、弹窗都需要对应一个脚本  
当前类所在的节点添加预制体时，提供了以下几个方法

- `addPanel`    预添加可切换的面板，没有真正创建实例，使用示例可参考 `EmbedWindow` 
- `showPanel`   显示预制体面板，如果有实例则直接显示，没有实例则创建后显示，使用示例可参考 `EmbedWindow` 
- `addUI`       添加预制体节点，直接加载并创建实例，有参数提示，使用示例可参考 `EmbedWindow` 
- `loadUI`      加载预制体节点，只加载不进行创建实例

2. 弹窗  
在弹窗关闭时，默认会自动释放弹窗的预制体资源，如果需要关闭可以调用 `setReleaseWindowPrefab` 进行设置

使用示例 PauseWindow.ts
```

const { prefabUrl } = tnt._decorator;

// 外部需要传入的参数
// 参数接口命名规则：弹窗名+Options，如弹窗名为 `PauseWindow` 则接口命名为 `PauseWindowOptions`
// 注意需要使用 declare global {} ，否则智能提示不生效

declare global { 
  interface PauseWindowOptions{
    pauseBgm: boolean;
  }
}

//@prefabUrl("window-example#prefabs/PauseWindow")// 预制体路径  写法1 
@prefabUrl("prefabs/window/PauseWindow","window-example") // 预制体路径，写法2 两种写法都可以
@ccclass('PauseWindow')
export class PauseWindow extends tnt.UIPopup<PauseWindowOptions> {
    
    onActive(): void {
      // 窗口激活, 首次打开和从冻结状态激活都会被调用
      if(this.options.pauseBgm){
        // ...
      }
    }
    onFreeze(): void {
      // 窗口冻结，窗口被关闭时不会被自动调用
    }

onShowCallback() {
      // 界面完整显示的回调
    }
    onCloseCallback() {
      // 界面完全关闭的回调
    }
    
    _playShowAnimation(tag: number, callback: () => void) {
      // 定制显示动效
      callback();
    }
    _playCloseAnimation(tag: number, callback: () => void) {
      // 定制关闭动效
      callback();
    }
    // ... 其他方法请直接查看 UIWindowBase 源码 
}

```

伍拾陆/ccc-tnt-framework

About

Releases

Contributors

Language(Optional)

Activities