feat: 规则太长不展示的问题-dom实现

hzlh-beautifulFunFestival-snake-20241222/assets/Scripts/Panels/RulePanel.ts

@@ -7,6 +7,7 @@ const {ccclass, property} = _decorator;
 
 import { HTMLRichText } from "../../Component/HTMLRichText/HTMLRichText";
 import { getWebData, WebNetName } from "../Utils/WebNet/WebNet";
+import { game } from "cc";
 
 @observer
 @ccclass('RulePanel')
@@ -18,12 +19,40 @@ export default class RulePanel extends Panel {
     @property(Node) closeBtn: Node = null;
     @property(Node) spNode: Node = null;
 
+    dom: HTMLDivElement = null;  
+
     onLoad() {
         this.closeBtn.on(Button.EventType.CLICK, this.clickClose);
     }
 
     async start() {
-        this.setRuleTxt(getWebData(WebNetName.tcs_Index).data?.rule || "");
+        // this.setRuleTxt(getWebData(WebNetName.tcs_Index).data?.rule || "");
+
+        if (!this.dom) {
+            this.dom = document.createElement("div");
+        }
+  
+        this.dom.innerHTML = `<div style="
+              position: absolute;
+              left: 1.34rem;
+              top: 4.14rem;
+              width: 4.85rem;
+              height: 7.2rem;
+              font-size: 0.21rem;
+              color: #590505;
+              overflow: hidden;
+              overflow-y: auto;
+              word-break: break-word;
+          ">
+              ${getWebData(WebNetName.tcs_Index).data?.rule || ""}
+          </div>
+          `;
+  
+        game.container.appendChild(this.dom);
+    }
+
+    protected onDestroy() {
+        this.dom && this.dom.remove();
     }
 
     clickClose = () => {