add event grade

laya/pages/view/CyberTheme/CyberTrajectory.ui

@@ -1,8 +1,8 @@
 {
     "x":0,
     "type":"View",
-    "selectedBox":1,
+    "selectedBox":88,
-    "selecteID":152,
+    "selecteID":153,
     "props":{"width":1125,"sceneColor":"#000000","sceneBg":"laya/views/view/CyberTheme/CyberTrajectory.png","runtime":"Laya.runtime.ViewBase","height":2436},
     "nodeParent":-1,
     "label":"View",
@@ -889,13 +889,14 @@
             "props":{"top":440,"right":20,"left":20,"bottom":250},
             "nodeParent":1,
             "label":"Box",
-            "isOpen":false,
+            "isOpen":true,
             "isDirectory":true,
             "isAniNode":true,
             "hasChild":true,
             "compId":102,
             "child":[
                 {
+                    "x":30,
                     "type":"Image",
                     "props":{"top":0,"skin":"images/border/border_1@3x.png","right":0,"left":0,"bottom":0},
                     "nodeParent":102,
@@ -908,6 +909,7 @@
                         ]
                 },
                 {
+                    "x":30,
                     "type":"Panel",
                     "props":{"var":"panelTrajectory","vScrollBarSkin":"images/slider/vslider_1@3x.png","top":80,"right":20,"name":"panelTrajectory","left":0,"bottom":80},
                     "nodeParent":102,
@@ -919,17 +921,19 @@
                     "compId":18,
                     "child":[
                         {
+                            "x":45,
                             "type":"VBox",
                             "props":{"var":"vboxTrajectory","top":0,"right":40,"name":"vboxTrajectory","left":20},
                             "nodeParent":18,
                             "label":"VBox(vboxTrajectory)",
-                            "isOpen":false,
+                            "isOpen":true,
                             "isDirectory":true,
                             "isAniNode":true,
                             "hasChild":true,
                             "compId":17,
                             "child":[
                                 {
+                                    "x":60,
                                     "type":"Box",
                                     "props":{"right":0,"name":"boxTrajectoryItem","left":0},
                                     "nodeParent":17,
@@ -941,11 +945,25 @@
                                     "compId":88,
                                     "child":[
                                         {
+                                            "x":75,
+                                            "type":"Box",
+                                            "props":{"y":0,"width":10,"top":0,"runtime":"Laya.runtime.ColorfulBox","name":"boxGrade","left":0,"height":50},
+                                            "nodeParent":88,
+                                            "label":"Box(boxGrade)",
+                                            "isDirectory":false,
+                                            "isAniNode":true,
+                                            "hasChild":false,
+                                            "compId":153,
+                                            "child":[
+                                                ]
+                                        },
+                                        {
+                                            "x":75,
                                             "type":"HBox",
-                                            "props":{"y":0,"x":200,"name":"hboxAge","anchorX":1,"align":"middle"},
+                                            "props":{"y":0,"x":220,"name":"hboxAge","anchorX":1,"align":"middle"},
                                             "nodeParent":88,
                                             "label":"HBox(hboxAge)",
-                                            "isOpen":true,
+                                            "isOpen":false,
                                             "isDirectory":true,
                                             "isAniNode":true,
                                             "hasChild":true,
@@ -989,8 +1007,9 @@
                                                 }]
                                         },
                                         {
+                                            "x":75,
                                             "type":"Label",
-                                            "props":{"wordWrap":true,"text":"你的父母开始辅导你数学和英语，智力+1","right":0,"name":"labContent","left":220,"leading":44,"fontSize":50,"font":"方正像素12","color":"#ffffff"},
+                                            "props":{"wordWrap":true,"text":"你的父母开始辅导你数学和英语，智力+1","right":0,"name":"labContent","left":240,"leading":44,"fontSize":50,"font":"方正像素12","color":"#ffffff"},
                                             "nodeParent":88,
                                             "label":"Label(labContent)",
                                             "isDirectory":false,
@@ -1005,6 +1024,7 @@
                     "$HIDDEN":false
                 },
                 {
+                    "x":30,
                     "type":"Box",
                     "props":{"y":20,"x":20,"var":"btnUp","top":20,"right":20,"name":"btnUp","left":20,"height":50},
                     "nodeParent":102,
@@ -1053,6 +1073,7 @@
                         }]
                 },
                 {
+                    "x":30,
                     "type":"Box",
                     "props":{"y":1676,"x":20,"var":"btnDown","right":20,"name":"btnDown","left":20,"height":50,"bottom":20},
                     "nodeParent":102,

package.json

@@ -16,7 +16,7 @@
         "babel-loader": "^8.2.2",
         "core-js": "^3.17.2",
         "html-webpack-plugin": "^5.5.0",
-        "v-transform": "^1.0.1",
+        "v-transform": "^1.0.2",
         "webpack": "^5.64.4",
         "webpack-cli": "^4.8.0",
         "webpack-dev-server": "^4.1.0"

src/ui/themes/cyber/trajectory.js

@@ -60,6 +60,7 @@ export default class CyberTrajectory extends ui.view.CyberTheme.CyberTrajectoryU
         const item = CyberTrajectory.#createComponent('boxTrajectoryItem');
         item.labContent = item.getChildByName('labContent');
         item.labAge = item.getChildByName('hboxAge').getChildByName('labAge');
+        item.boxGrade = item.getChildByName('boxGrade');
         return item;
     }
     #isEnd;
@@ -134,6 +135,10 @@ export default class CyberTrajectory extends ui.view.CyberTheme.CyberTrajectoryU
                 }
             }
         ).join('\n');
+        $_.deepMapSet(
+            item.boxGrade,
+            $ui.common.gradeBlk[content[content.length - 1].grade || 0]
+        );
         this.vboxTrajectory.addChild(item);
         this.#trajectoryItems.push(item);
         this.#trajectoryItems.forEach((item, index) => item.y = index);

src/ui/themes/default/trajectory.js

@@ -35,6 +35,9 @@ export default class Trajectory extends ui.view.DefaultTheme.TrajectoryUI {
         item.labAge = item.getChildByName('hboxAge').getChildByName('labAge');
         const config = $ui.common.trajectoryItem;
         $_.deepMapSet(item, config.box);
+        item.grade = grade => {
+            $_.deepMapSet(item, config.grade[grade || 0]);
+        }
         item.getChildByName('hboxAge')._childs.forEach(child => child.color = config.ageColor);
         item.labContent.color = config.contentColor;
         return item;
@@ -111,6 +114,7 @@ export default class Trajectory extends ui.view.DefaultTheme.TrajectoryUI {
                 }
             }
         ).join('\n');
+        item.grade(content[content.length - 1].grade);
         this.vboxTrajectory.addChild(item);
         this.#trajectoryItems.push(item);
         this.#trajectoryItems.forEach((item, index) => item.y = index);

src/ui/themes/views.js

@@ -55,6 +55,24 @@ const cyber = {
                 '#b17cffff',
                 '#ffce45ff',
             ],
+            gradeBlk: [
+                {
+                    defaultColor: '#cccccc',
+                    hoverColor: '#cccccc',
+                },
+                {
+                    defaultColor: '#55fffe',
+                    hoverColor: '#55fffe',
+                },
+                {
+                    defaultColor: '#b17cff',
+                    hoverColor: '#b17cff',
+                },
+                {
+                    defaultColor: '#ffce45',
+                    hoverColor: '#ffce45',
+                },
+            ]
         },
         pages: {
             [pages.MAIN]: {
@@ -183,12 +201,26 @@ const dark = {
             defaultFontColor: '#eeeeee',
             trajectoryItem: {
                 box: {
-                    defaultColor: '#4a5361',
-                    defaultStroke: '#4a5361',
-                    hoverColor: '#4a5361',
-                    hoverStroke: '#4a5361',
                     filters: ()=>[new Laya.GlowFilter("#eeeeee", 8, 0, 0)],
                 },
+                grade: [
+                    {
+                        defaultColor: '#4a5361',
+                        hoverColor: '#4a5361',
+                    },
+                    {
+                        defaultColor: '#1160b0',
+                        hoverColor: '#1160b0',
+                    },
+                    {
+                        defaultColor: '#9379ca',
+                        hoverColor: '#9379ca',
+                    },
+                    {
+                        defaultColor: '#ab6157',
+                        hoverColor: '#ab6157',
+                    },
+                ],
                 ageColor: '#ffffee',
                 contentColor: '#eeeeee',
             },
@@ -625,6 +657,21 @@ const light = {
                 box: {
                     filters: ()=>[new Laya.GlowFilter("#b1b1b1", 8, 0, 0)],
                 },
+                grade: [
+                    {},
+                    {
+                        defaultColor: '#55fffe',
+                        hoverColor: '#55fffe',
+                    },
+                    {
+                        defaultColor: '#b17cff',
+                        hoverColor: '#b17cff',
+                    },
+                    {
+                        defaultColor: '#ffce45',
+                        hoverColor: '#ffce45',
+                    },
+                ],
                 ageColor: '#000000',
                 contentColor: '#000000',
             },

yarn.lock

@@ -3537,10 +3537,10 @@ uuid@^3.4.0:
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee"
   integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==
 
-v-transform@^1.0.1:
+v-transform@^1.0.2:
-  version "1.0.1"
+  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/v-transform/-/v-transform-1.0.1.tgz#380dd837e3b14189ccc47aafa8e675601403f2f2"
+  resolved "https://registry.yarnpkg.com/v-transform/-/v-transform-1.0.2.tgz#93f5be5e7ea6f070d544ab3d96569bace91c754d"
-  integrity sha512-F1VBbBLoFkFdpxFiHCq5neSoBsfFPDbecye5+B5OjE05U0K2RcdZR7lFkziqo1WP4Do36lUjN5Ok/E6GLUJgiQ==
+  integrity sha512-oBl76Q/JWVvglT3yHujWj6uNS4QygAERhdcdPKHpd47+K9+gotBUvCrdiVnizLscLzsz8GGi/KlOwZHnm9STxA==
   dependencies:
     commander "^8.2.0"
     xlsx "^0.17.1"