Toast.ts 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. import { BlockInputEvents, color, ImageAsset, Label, Layers, Node, Sprite, SpriteFrame, Texture2D, tween, UIOpacity, UITransform, v3, view } from "cc";
  2. /**
  3. * 位置
  4. */
  5. export enum Gravity {
  6. BOTTOM,
  7. }
  8. const imageObj = new Image();
  9. imageObj.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACAQMAAABIeJ9nAAAAA1BMVEX///+nxBvIAAAACklEQVQI12MAAgAABAABINItbwAAAABJRU5ErkJggg==";
  10. const imageAsset = new ImageAsset(imageObj);
  11. /*
  12. Toast.makeText(gui.getLayerNode(5),"可笑可笑1").show();
  13. */
  14. export class Toast {
  15. static readonly LENGTH_SHORT = 2; // 短时间吐司
  16. static readonly LENGTH_LONG = 3.5; // 长时间吐司
  17. private static pNode: Node | null = null;
  18. private _bgNode: Node = null!;
  19. private _textNode: Node = null!;
  20. private _node: Node = null!;
  21. private _text = '';
  22. private _time = 0;
  23. private _textSize = 18;
  24. private _gravity = Gravity.BOTTOM;
  25. private constructor(root:Node) {
  26. this._node = this.getPNode(root);
  27. this._bgNode = new Node();
  28. this._bgNode.layer = Layers.Enum.UI_2D;
  29. this._bgNode.addComponent(BlockInputEvents);
  30. const sprite = this._bgNode.addComponent(Sprite);
  31. sprite.type = Sprite.Type.SLICED;
  32. const textureObj = new Texture2D();
  33. textureObj.image = imageAsset;
  34. const sf = new SpriteFrame();
  35. sf.texture = textureObj;
  36. sprite.spriteFrame = sf;
  37. sprite.color = color(0, 0, 0, 200);
  38. this._bgNode.addComponent(UIOpacity);
  39. this._bgNode.active = false;
  40. this._textNode = new Node('Text');
  41. this._textNode.layer = Layers.Enum.UI_2D;
  42. const uiTransform = this._textNode.addComponent(UITransform);
  43. uiTransform.width = this._node.getComponent(UITransform)!.width;
  44. const label = this._textNode.addComponent(Label);
  45. label.horizontalAlign = Label.HorizontalAlign.CENTER;
  46. label.verticalAlign = Label.VerticalAlign.CENTER;
  47. this._textSize = 20;
  48. this._textNode.parent = this._bgNode;
  49. this._bgNode.parent = this._node;
  50. }
  51. /**
  52. * 生成吐司
  53. * @param node
  54. * @param text
  55. * @param time
  56. * @returns
  57. */
  58. static makeText(parent:Node, text: string, time:number=Toast.LENGTH_SHORT) {
  59. let toast = new Toast(parent);
  60. toast.setText(text);
  61. toast.setTime(time);
  62. return toast;
  63. }
  64. /**
  65. * 显示吐司
  66. */
  67. show() {
  68. this.setOverFlow();
  69. this._bgNode.active = true;
  70. const uiOpacity = this._bgNode.getComponent(UIOpacity);
  71. tween(uiOpacity)
  72. .delay(this._time)
  73. .to(0.3, { opacity: 0 })
  74. .call(() => {
  75. this._bgNode.destroy();
  76. })
  77. .start();
  78. }
  79. /**
  80. * 设置文字
  81. * @param text 文字
  82. * @returns
  83. */
  84. setText(text: string): Toast {
  85. this._text = text;
  86. let label = this._textNode.getComponent(Label)!;
  87. label.string = this._text;
  88. return this;
  89. }
  90. /**
  91. * 设置文字大小
  92. * @param textSize 文字大小
  93. * @returns
  94. */
  95. setFontSize(textSize: number): Toast {
  96. this._textSize = textSize;
  97. let label = this._textNode.getComponent(Label)!;
  98. label.fontSize = this._textSize;
  99. return this;
  100. }
  101. /**
  102. * 设置时间
  103. * @param time 时间
  104. * @returns
  105. */
  106. setTime(time: number) {
  107. this._time = time;
  108. return this;
  109. }
  110. /**
  111. * 设置位置
  112. * @param gravity 位置
  113. * @returns
  114. */
  115. setGravity(gravity: Gravity): Toast {
  116. this._gravity = gravity;
  117. return this;
  118. }
  119. private setPosition() {
  120. let uiTransform = this._node.getComponent(UITransform)!;
  121. let bgUITransform = this._bgNode.getComponent(UITransform)!;
  122. if (Gravity.BOTTOM === this._gravity) {
  123. let y = -uiTransform.height / 2 + bgUITransform.height / 2 + 64;
  124. this._bgNode.position = v3(0, y, 0);
  125. }
  126. }
  127. private setOverFlow() {
  128. let maxLength = this._node.getComponent(UITransform)!.width / 2;
  129. let label = this._textNode.getComponent(Label)!;
  130. let fontLength = this._text.length * label.fontSize;
  131. let uiTransform = this._textNode.getComponent(UITransform)!;
  132. if (fontLength > maxLength) {
  133. uiTransform.width = maxLength;
  134. label.overflow = Label.Overflow.RESIZE_HEIGHT;
  135. } else {
  136. uiTransform.width = fontLength;
  137. label.overflow = Label.Overflow.NONE;
  138. }
  139. let bgUITransform = this._bgNode.getComponent(UITransform)!;
  140. bgUITransform.width = uiTransform.width + label.fontSize * 4;
  141. bgUITransform.height = uiTransform.height;
  142. this.setPosition();
  143. }
  144. private getPNode(root:Node): Node {
  145. if (null == Toast.pNode || !Toast.pNode.isValid) {
  146. Toast.pNode = new Node('Toast');
  147. let transform = Toast.pNode.addComponent(UITransform);
  148. Toast.pNode.layer = Layers.Enum.UI_2D;
  149. root.addChild(Toast.pNode);
  150. Toast.pNode.setSiblingIndex(root.children.length)
  151. let size = view.getVisibleSize();
  152. transform.contentSize = size;
  153. transform.width = size.width;
  154. transform.height = size.height;
  155. }
  156. return Toast.pNode;
  157. }
  158. }