BaseView.ts 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. import { _decorator, UIOpacity, UITransform, Enum, Widget, Button, BlockInputEvents,Node } from 'cc';
  2. import { ResKeeper } from '../res/ResKeeper';
  3. const { ccclass, executeInEditMode, requireComponent, menu, property } = _decorator;
  4. export enum UIShowType {
  5. Single, //单独显示
  6. Overlap, //重叠显示
  7. FullScreen, //全屏显示
  8. };
  9. @ccclass('BaseView')
  10. @requireComponent([UIOpacity, UITransform])
  11. @menu('私有组件/BaseView')
  12. export class BaseView extends ResKeeper {
  13. @property({ type: Enum(UIShowType), displayName: "UI显示模式" })
  14. private ui_type: UIShowType = UIShowType.Single;
  15. @property({ displayName: "是否铺满全屏", visible: true })
  16. private _base_view_full = false;
  17. @property({ displayName: "是否拦截层事件", visible() { return this._base_view_full && !this._base_quick_close } })
  18. private _base_view_block = false;
  19. @property({
  20. displayName: "是否快速关闭", visible() {
  21. let show = this._base_view_full && !this._base_view_block;
  22. (!show) && (this._base_quick_close_cache = false);
  23. return show;
  24. }
  25. })
  26. private _base_quick_close = false;
  27. @property({ type: Node, displayName: "快速关闭排除节点", visible() { return this._base_quick_close && this._base_view_full && !this._base_view_block } })
  28. private _base_quick_close_exclude_node: Node[] = [];
  29. @property({ displayName: "快速关闭时是否摧毁UI", visible() { return this._base_quick_close && this._base_view_full && !this._base_view_block } })
  30. private _base_quick_close_destroy = true;
  31. private _$timer_uuid = 0;
  32. private _view_id = -1;
  33. private _schedule_map = new Map<number, Function>();
  34. protected _ui_opacity: UIOpacity = null;
  35. protected _ui_transform: UITransform = null;
  36. private _opening = true;
  37. protected onLoad() {
  38. this._ui_opacity = this.getComponent(UIOpacity) || this.addComponent(UIOpacity);
  39. this._ui_transform = this.getComponent(UITransform) || this.addComponent(UITransform);
  40. this._schedule_map.clear();
  41. if (this._base_view_full) {
  42. let widget = this.getComponent(Widget) || this.addComponent(Widget);
  43. widget.isAlignLeft = widget.isAlignRight = widget.isAlignTop = widget.isAlignBottom = true;
  44. widget.left = widget.right = widget.top = widget.bottom = 0;
  45. widget.alignMode = Widget.AlignMode.ON_WINDOW_RESIZE;
  46. widget.enabled = true;
  47. (this._base_view_block) && (this._base_quick_close = false);
  48. (this._base_quick_close) && (this._base_view_block = false);
  49. } else {
  50. this._base_view_block = false;
  51. this._base_quick_close = false;
  52. this._base_quick_close_destroy = true;
  53. }
  54. if (this._base_view_block) {
  55. (!this.getComponent(BlockInputEvents) && !this.getComponent(Button)) && this.addComponent(BlockInputEvents);
  56. }
  57. if (this._base_quick_close && this._base_quick_close_exclude_node && this._base_quick_close_exclude_node.length > 0) {
  58. if (!this.getComponent(BlockInputEvents) && !this.getComponent(Button)) {
  59. for (let node of this._base_quick_close_exclude_node) {
  60. node.addComponent(BlockInputEvents);
  61. }
  62. }
  63. // if ((!this.getComponent(BlockInputEvents) && !this.getComponent(Button))) {
  64. // this.node.on(Node.EventType.TOUCH_END, () => {
  65. // (!this._opening) && Framework.layer.close(this);
  66. // }, this);
  67. // }
  68. }
  69. }
  70. /**
  71. * 自定义定时器
  72. * @param callback 回调
  73. * @param interval 以秒为单位的时间间隔
  74. * @param repeat 重复次数
  75. * @param delay 开始延时
  76. */
  77. protected _schedule(callback: Function, interval?: number, repeat?: number, delay?: number) {
  78. if (callback) {
  79. let uuid = ++this._$timer_uuid;
  80. this._schedule_map.set(uuid, callback);
  81. this.schedule(callback, interval, repeat, delay);
  82. return uuid;
  83. }
  84. return -1;
  85. }
  86. /**
  87. * 释放定时器
  88. * @param uuid 任务标识
  89. */
  90. protected _unschedule(uuid: number) {
  91. if (uuid > 0) {
  92. let func = this._schedule_map.get(uuid)
  93. if (func) {
  94. this._schedule_map.delete(uuid);
  95. this.unschedule(func);
  96. }
  97. }
  98. }
  99. /**
  100. * 全局定时器
  101. * @param callback 回调
  102. * @param delay 开始延时
  103. */
  104. protected _scheduleOnce(callback: Function, delay: number = 0) {
  105. if (callback) {
  106. let uuid = ++this._$timer_uuid;
  107. this._schedule_map.set(uuid, callback);
  108. this.scheduleOnce(() => {
  109. let func = this._schedule_map.get(uuid);
  110. func && func();
  111. this.unschedule(uuid);
  112. }, Math.max(delay, 0));
  113. return uuid;
  114. }
  115. }
  116. protected _clearAllTimer() {
  117. this._schedule_map.forEach((func, key) => {
  118. this.unschedule(func);
  119. });
  120. this._schedule_map.clear();
  121. }
  122. get show_type() {
  123. return this.ui_type;
  124. }
  125. set view_id(id: number) {
  126. this._view_id = id;
  127. }
  128. get view_id() {
  129. return this._view_id;
  130. }
  131. /**
  132. * UI打开后会调用该函数
  133. * @param args 自定义参数
  134. */
  135. onOpen(...args: any[]) { }
  136. /**
  137. * UI被销毁前会调用该函数
  138. */
  139. onClose() { }
  140. /**
  141. * 显示UI
  142. */
  143. onShow() {
  144. this.node.active = true;
  145. // (this._ui_opacity) && (this._ui_opacity.opacity = 255);
  146. }
  147. /**
  148. * 隐藏UI
  149. */
  150. onHide() {
  151. // (this._ui_opacity) && (this._ui_opacity.opacity = 0);
  152. this.node.active = false;
  153. }
  154. }