update

assets/Scripts/chat18x/ui/components/ChatContentsLayout.ts

@@ -3,7 +3,10 @@ import {
   Component,
   instantiate,
   Node,
+  NodeEventType,
   ScrollView,
+  Tween,
+  UIOpacity,
   UITransform,
   Vec3,
   view,
@@ -34,6 +37,13 @@ export class ChatContentsLayout extends Component {
   @property(ScrollView)
   private scrollView: ScrollView = null;
 
+  // 内容透明度组件
+  private contentOpacity: UIOpacity = null;
+  // 是否正在按下
+  private isPressing: boolean = false;
+  // 长按计时器
+  private longPressTimer: number = null;
+
   fixMaxWidth: number;
 
   protected start(): void {
@@ -41,7 +51,15 @@ export class ChatContentsLayout extends Component {
     this.rBubble.node.active = false;
     this.fixMaxWidth = 730;
 
-    // 获取父节点的ScrollView组件
+    // 获取或添加UIOpacity组件到content节点
+    this.contentOpacity = this.node.getComponent(UIOpacity) || this.node.addComponent(UIOpacity);
+
+    // 注册触摸事件
+    if (this.scrollView && this.scrollView.node) {
+      this.scrollView.node.on(NodeEventType.TOUCH_START, this.onTouchStart, this);
+      this.scrollView.node.on(NodeEventType.TOUCH_END, this.onTouchEnd, this);
+      this.scrollView.node.on(NodeEventType.TOUCH_CANCEL, this.onTouchEnd, this);
+    }
   }
 
   protected onEnable(): void {
@@ -251,4 +269,70 @@ export class ChatContentsLayout extends Component {
       this.bubbles.push(bubble);
     }
   }
+
+  /**
+   * 触摸开始事件
+   */
+  private onTouchStart(): void {
+    // 清除之前的计时器
+    if (this.longPressTimer) {
+      clearTimeout(this.longPressTimer);
+    }
+
+    // 设置长按计时器（300ms后触发）
+    this.longPressTimer = setTimeout(() => {
+      this.isPressing = true;
+      // 使用Tween动画平滑调整透明度
+      Tween.stopAllByTarget(this.contentOpacity);
+      new Tween(this.contentOpacity)
+        .to(0.2, { opacity: 50 }) // 调整到约20%透明度
+        .start();
+    }, 300);
+  }
+
+  /**
+   * 触摸结束事件
+   */
+  private onTouchEnd(): void {
+    // 清除计时器
+    if (this.longPressTimer) {
+      clearTimeout(this.longPressTimer);
+      this.longPressTimer = null;
+    }
+
+    // 如果已经按下，恢复透明度
+    if (this.isPressing) {
+      this.isPressing = false;
+      Tween.stopAllByTarget(this.contentOpacity);
+      new Tween(this.contentOpacity)
+        .to(0.2, { opacity: 255 }) // 恢复到100%透明度
+        .start();
+    }
+  }
+
+  /**
+   * 组件销毁时清理资源
+   */
+  protected onDestroy(): void {
+    // 清理事件监听
+    if (this.scrollView && this.scrollView.node) {
+      this.scrollView.node.off(NodeEventType.TOUCH_START, this.onTouchStart, this);
+      this.scrollView.node.off(NodeEventType.TOUCH_END, this.onTouchEnd, this);
+      this.scrollView.node.off(NodeEventType.TOUCH_CANCEL, this.onTouchEnd, this);
+    }
+
+    // 清理计时器
+    if (this.longPressTimer) {
+      clearTimeout(this.longPressTimer);
+      this.longPressTimer = null;
+    }
+
+    // 清理延时任务
+    this.clearDelayedTasks();
+
+    // 停止所有动画
+    if (this.contentOpacity) {
+      Tween.stopAllByTarget(this.contentOpacity);
+    }
+  }
 }