精简属性

cc-inspector/src/views/devtools/comp/index.ts

@@ -0,0 +1,17 @@
+export enum CompType {
+  Node2 = "node-2",
+  Spirte2 = "sprite-2",
+  Label2 = "label-2",
+
+  Node3 = "node-3",
+  Spirte3 = "sprite-3",
+  Label3 = "label-3",
+}
+
+export function getSimpleProperties(typeName: string): string[] {
+  const config = {};
+  config[CompType.Node2] = ["position", "rotation", "scale", "anchor", "size", "color", "opacity", "skew", "group"];
+  config[CompType.Label2] = ["string", "horizontalAlign", "verticalAlign", "fontSize", "lineHeight", "overflow", "font", "fontFamily", "ebableBold", "enableItalic", "enableUnderline", "underlineHeight", "cacheMode", "useSystemFont"];
+  config[CompType.Spirte2] = ["atlas", "spriteFrame", "type", "sizeMode"];
+  return config[typeName];
+}

cc-inspector/src/views/devtools/data.ts

@@ -1,5 +1,6 @@
 import { ITreeData } from "@xuyanfeng/cc-ui/types/cc-tree/const";
 import { v4 } from "uuid";
+import { getSimpleProperties } from "./comp";
 export enum DataType {
   Number = "Number",
   String = "String",
@@ -563,12 +564,20 @@ export class Group {
     this.name = name;
     this.id = id || "";
   }
-  parse(data: Group) {
+  isSimple(name: string): boolean {
+    const arr = getSimpleProperties(this.name);
+    const b = arr.find((el) => el === name);
+    return !!b;
+  }
+  parse(data: Group, simple: boolean = false) {
     this.id = data.id;
     this.name = data.name;
     this.data = [];
     for (let i = 0; i < data.data.length; i++) {
       const item = data.data[i];
+      if (simple && !this.isSimple(item.name)) {
+        continue;
+      }
       const property = new Property(item.name, item.value).parse(item);
       this.data.push(property);
     }
@@ -619,12 +628,12 @@ export class NodeInfoData {
   /**
    * 将json数据解析成NodeInfoData
    */
-  parse(data: NodeInfoData) {
+  parse(data: NodeInfoData, simple: boolean = false) {
     this.uuid = data.uuid;
     this.group = [];
     for (let i = 0; i < data.group.length; i++) {
       const item = data.group[i];
-      const group = new Group(item.name, item.id).parse(item);
+      const group = new Group(item.name, item.id).parse(item, simple);
       this.group.push(group);
     }
     return this;

cc-inspector/src/views/devtools/inspector.vue

@@ -62,11 +62,12 @@ export default defineComponent({
         treeItemData.value = null;
       }
     });
+    let simpleProperties = true;
     bridge.on(Msg.ResponseNodeInfo, (event: PluginEvent) => {
       try {
         // 因为要用到class的一些属性，传递过来的是纯数据，所以需要重新序列化一下
         let eventData: NodeInfoData = event.data;
-        const nodeInfo = new NodeInfoData(eventData.uuid, eventData.group).parse(eventData);
+        const nodeInfo = new NodeInfoData(eventData.uuid, eventData.group).parse(eventData, simpleProperties);
         treeItemData.value = nodeInfo;
       } catch (error) {
         console.error(error);
@@ -84,6 +85,12 @@ export default defineComponent({
             updateNodeInfo();
           },
         });
+        menus.push({
+          name: simpleProperties ? "show more properties" : "show simple properties",
+          callback: () => {
+            simpleProperties = !simpleProperties;
+          },
+        });
         ccui.menu.showMenuByMouseEvent(evnet, menus);
       },
     };

cc-inspector/src/views/devtools/test/server.ts

@@ -126,6 +126,11 @@ export class TestServer {
     this.testData.buildChild("str2").buildComponent("group6").buildProperty("str2", new StringData("str2"));
 
     this.testData.buildChild("Invalid").buildComponent("group7").buildProperty("NaN", new InvalidData(NaN)).buildProperty("null", new InvalidData(null)).buildProperty("Infinity", new InvalidData(Infinity)).buildProperty("undefined", new InvalidData(undefined));
+    this.testData
+      .buildChild("comp")
+      .buildComponent("node-2") //
+      .buildProperty("rotation", new NumberData(0))
+      .buildProperty("max", new NumberData(100));
   }
   add(client: TestClient) {
     this.clients.push(client);