SortingGroup组件可以应用于当前节点或者其子节点上的UI渲染器

2025-10-19 22:55:25 +00:00 · 2023-02-08 00:33:52 +08:00
parent a120d33b79
commit d4658cabc6
17 changed files with 2597 additions and 239 deletions
--- a/assets/lcc-ui-sorting-group/engine-extend/node.jsb.ts
+++ b/assets/lcc-ui-sorting-group/engine-extend/node.jsb.ts
@@ -0,0 +1,71 @@
+import { director, Layers, misc, utils } from "cc";
+import { MeshRenderer } from "cc";
+import { profiler } from "cc";
+import { CCObject } from "cc";
+import { game } from "cc";
+import { Material } from "cc";
+import { Profiler } from "cc";
+import { Node } from "cc";
+import { JSB } from "cc/env";
+
+const _constants = {
+    fontSize: 23,
+    quadHeight: 0.4,
+    segmentsPerLine: 8,
+    textureWidth: 256,
+    textureHeight: 256,
+};
+
+if(JSB){
+    //@ts-ignore
+    const Node_ctor = Node.prototype._ctor;
+    //@ts-ignore
+    Node.prototype._ctor = function (name?: string) {
+        Node_ctor.call(this, name);
+        
+        const sharedArrayBuffer = this._getSharedArrayBufferObject();
+        // Uint32Array with 3 elements: eventMask, layer, dirtyFlags
+        this._sharedUint32Arr = new Uint32Array(sharedArrayBuffer, 0, 3);
+        // Int32Array with 1 element: siblingIndex
+        this._sharedInt32Arr = new Int32Array(sharedArrayBuffer, 12, 1);
+        // uiSortingPriority
+        this._sharedFloatArr = new Float32Array(sharedArrayBuffer, 16, 1);
+        // Uint8Array with 3 elements: activeInHierarchy, active, static, uiSortingEnabled
+        this._sharedUint8Arr = new Uint8Array(sharedArrayBuffer, 20, 4);
+
+        this._sharedUint32Arr[1] = Layers.Enum.DEFAULT; // this._sharedUint32Arr[1] is layer
+    };
+
+    Object.defineProperty(Node.prototype, 'uiSortingEnabled', {
+        configurable: true,
+        enumerable: true,
+        get (): Readonly<Boolean> {
+            return this._sharedUint8Arr[3] != 0; // Uint8, 1: active
+        },
+        set (v) {
+            this._sharedUint8Arr[3] = (v ? 1 : 0); // Uint8, 1: active
+        },
+    });
+
+    Object.defineProperty(Node.prototype, 'uiSortingPriority', {
+        configurable: true,
+        enumerable: true,
+        get (): Readonly<number> {
+            return this._sharedFloatArr[0];
+        },
+        set (v) {
+            this._sharedFloatArr[0] = v;
+        },
+    });
+
+    // 左下角调试节点创建过早，重新创建
+    //@ts-ignore
+    if (profiler._rootNode && profiler._rootNode.isValid){
+        //@ts-ignore
+        profiler._rootNode.destroy();
+        //@ts-ignore
+        profiler._rootNode = null;
+
+        profiler.generateNode();
+    }
+}
--- a/assets/lcc-ui-sorting-group/engine-extend/render-entity.ts.meta
+++ b/assets/lcc-ui-sorting-group/engine-extend/render-entity.ts.meta
@@ -2,7 +2,7 @@
  "ver": "4.0.23",
  "importer": "typescript",
  "imported": true,
-  "uuid": "fa9757e8-0812-47bb-b2cd-658d631f676a",
+  "uuid": "29c6a480-4d9e-413e-8a39-0f0f9a59a19c",
  "files": [],
  "subMetas": {},
  "userData": {}
--- a/assets/lcc-ui-sorting-group/engine-extend/render-entity.ts
+++ b/assets/lcc-ui-sorting-group/engine-extend/render-entity.ts
@@ -1,141 +0,0 @@
-
-/**
- * 由于RenderEntity未暴露，所以修改就只有另辟蹊径
- */
-
-import { Graphics } from "cc";
-import { UIRenderer } from "cc";
-import { TiledLayer } from "cc";
-import { UIMeshRenderer } from "cc";
-import { __private,dragonBones,sp } from "cc";
-import { JSB } from "cc/env";
-import { DEFAULT_SORTING_PRIORITY } from "../sorting-define";
-
-export enum RenderEntityFloatSharedBufferView {
-    localOpacity,
-    sortingPriority,
-    count,
-}
-
-export enum RenderEntityUInt8SharedBufferView {
-    colorR,
-    colorG,
-    colorB,
-    colorA,
-    maskMode,
-    count,
-}
-
-export enum RenderEntityBoolSharedBufferView {
-    colorDirty,
-    enabled,
-    useLocal,
-    count,
-}
-
-/**
- * RenderEntity类
- */
-let RenderEntityClass:typeof __private._cocos_2d_renderer_render_entity__RenderEntity = null;
-
-/**
- * 更新RenderEntity实体
- */
-export function UpdateRenderEntity(renderEntity:__private._cocos_2d_renderer_render_entity__RenderEntity){
-    if(renderEntity && !RenderEntityClass){
-        RenderEntityClass = renderEntity.constructor as typeof __private._cocos_2d_renderer_render_entity__RenderEntity;
-
-        // @ts-ignore
-        RenderEntityClass.prototype.initSharedBuffer = function(){
-            this._sortingPriority = DEFAULT_SORTING_PRIORITY;
-            if (JSB) {
-                //this._sharedBuffer = new Float32Array(RenderEntitySharedBufferView.count);
-                const buffer = this._nativeObj.getEntitySharedBufferForJS();
-                let offset = 0;
-                this._floatSharedBuffer = new Float32Array(buffer, offset, RenderEntityFloatSharedBufferView.count);
-                offset += RenderEntityFloatSharedBufferView.count * 4;
-                this._uint8SharedBuffer = new Uint8Array(buffer, offset, RenderEntityUInt8SharedBufferView.count);
-                offset += RenderEntityUInt8SharedBufferView.count * 1;
-                this._boolSharedBuffer = new Uint8Array(buffer, offset, RenderEntityBoolSharedBufferView.count);
-            }
-        };
-
-        if(!('sortingPriority' in RenderEntityClass.prototype)){
-            Object.defineProperty(RenderEntityClass.prototype, 'sortingPriority', {
-                get: function() { 
-                    return this._sortingPriority; 
-                },
-                set: function(value) { 
-                    this._sortingPriority = value;
-                    // console.log(`JSB sortingPriority ${value}`);
-                    if (JSB) {
-                        this._floatSharedBuffer[RenderEntityFloatSharedBufferView.sortingPriority] = value;
-                    }
-                },
-                enumerable: true
-            });
-        }
-        
-        // @ts-ignore
-        renderEntity.initSharedBuffer();
-
-        console.log('Update RenderEntity Class');
-    }
-}
-
-// @ts-ignore
-const Graphics_createRenderEntity = Graphics.prototype.createRenderEntity;
-// @ts-ignore
-Graphics.prototype.createRenderEntity = function(){
-    let entity = Graphics_createRenderEntity.call(this);
-    UpdateRenderEntity(entity);
-    return entity;
-}
-
-const UIMeshRenderer_onLoad = UIMeshRenderer.prototype.onLoad;
-UIMeshRenderer.prototype.onLoad = function(){
-    UpdateRenderEntity(this._renderEntity);
-    return UIMeshRenderer_onLoad.call(this);
-}
-
-// @ts-ignore
-const UIRenderer_createRenderEntity = UIRenderer.prototype.createRenderEntity;
-// @ts-ignore
-UIRenderer.prototype.createRenderEntity = function(){
-    let entity = UIRenderer_createRenderEntity.call(this);
-    UpdateRenderEntity(entity);
-    return entity;
-}
-
-if(dragonBones){
-    // @ts-ignore
-    const ArmatureDisplay_createRenderEntity = dragonBones.ArmatureDisplay.prototype.createRenderEntity;
-    // @ts-ignore
-    dragonBones.ArmatureDisplay.prototype.createRenderEntity = function(){
-        let entity = ArmatureDisplay_createRenderEntity.call(this);
-        UpdateRenderEntity(entity);
-        return entity;
-    }
-}
-
-if(sp){
-    // @ts-ignore
-    const Skeleton_createRenderEntity = sp.Skeleton.prototype.createRenderEntity;
-    // @ts-ignore
-    sp.Skeleton.prototype.createRenderEntity = function(){
-        let entity = Skeleton_createRenderEntity.call(this);
-        UpdateRenderEntity(entity);
-        return entity;
-    }
-}
-
-if(TiledLayer){
-    // @ts-ignore
-    const TiledLayer_createRenderEntity = TiledLayer.prototype.createRenderEntity;
-    // @ts-ignore
-    TiledLayer.prototype.createRenderEntity = function(){
-        let entity = TiledLayer_createRenderEntity.call(this);
-        UpdateRenderEntity(entity);
-        return entity;
-    }
-}
--- a/assets/lcc-ui-sorting-group/engine-extend/ui-renderer.ts
+++ b/assets/lcc-ui-sorting-group/engine-extend/ui-renderer.ts
@@ -4,31 +4,13 @@ declare module 'cc' {
    interface UIRenderer {
        
        /**
-         * 排序优先级 - private
+         * 渲染优先级
         */
-        _sortingPriority:number;
+        renderPriority:number;

        /**
-         * 排序优先级
+         * 渲染透明度
         */
-        sortingPriority:number;
-
-        /**
-         * 排序透明度
-         */
-        sortingOpacity:number;
+        renderOpacity:number;
    }
 }
-
-if(!('sortingPriority' in UIRenderer.prototype)){
-    Object.defineProperty(UIRenderer.prototype, 'sortingPriority', {
-        get: function() { 
-            return this._sortingPriority; 
-        },
-        set: function(value) { 
-            this._sortingPriority = value;
-            this._renderEntity.sortingPriority = value;
-        },
-        enumerable: true
-    });
-}
--- a/assets/lcc-ui-sorting-group/engine-extend/ui-transform.ts
+++ b/assets/lcc-ui-sorting-group/engine-extend/ui-transform.ts
@@ -0,0 +1,55 @@
+import { UITransform } from "cc";
+import { JSB } from "cc/env";
+
+declare module 'cc' {
+    interface UITransform {
+        
+        /**
+         * 排序优先级 - private
+         */
+        _sortingPriority:number;
+
+        /**
+         * 排序优先级
+         */
+        sortingPriority:number;
+
+        /**
+         * 排序优使能 - private
+         */
+        _sortingEnabled:boolean;
+
+        /**
+         * 排序优使能
+         */
+        sortingEnabled:boolean;
+    }
+}
+
+if(!('sortingPriority' in UITransform.prototype)){
+    Object.defineProperty(UITransform.prototype, 'sortingPriority', {
+        get: function() { 
+            return this._sortingPriority; 
+        },
+        set: function(value) { 
+            this._sortingPriority = value;
+            if(JSB){
+                this.node.uiSortingPriority = value;
+            }
+        },
+        enumerable: true
+    });
+
+    Object.defineProperty(UITransform.prototype, 'sortingEnabled', {
+        get: function() { 
+            return this._sortingEnabled; 
+        },
+        set: function(value) { 
+            this._sortingEnabled = value;
+            if(JSB){
+                this.node.uiSortingEnabled = value;
+            }
+        },
+        enumerable: true
+    });
+}
--- a/assets/lcc-ui-sorting-group/engine-extend/ui-transform.ts.meta
+++ b/assets/lcc-ui-sorting-group/engine-extend/ui-transform.ts.meta
@@ -0,0 +1,9 @@
+{
+  "ver": "4.0.23",
+  "importer": "typescript",
+  "imported": true,
+  "uuid": "421d8e4a-74d5-4851-a739-de22c13f87e3",
+  "files": [],
+  "subMetas": {},
+  "userData": {}
+}
--- a/assets/lcc-ui-sorting-group/engine-extend/ui.ts
+++ b/assets/lcc-ui-sorting-group/engine-extend/ui.ts
@@ -1,6 +1,5 @@
 import { clamp, gfx,Node,RenderData,UI,StencilManager,UIRenderer, renderer } from 'cc';
 import { JSB } from 'cc/env';
-import { DEFAULT_SORTING_PRIORITY } from '../sorting-define';

 declare module 'cc' {
    interface UI {
@@ -64,14 +63,14 @@ UI.prototype.flushRendererCache = function(){
    const rendererCache = this.rendererCache;
    if(rendererCache.length > 0){
        if(this.rendererOrder){
-            rendererCache.sort((a, b)=>{ return a._sortingPriority - b._sortingPriority; });
+            rendererCache.sort((a, b)=>{ return a.renderPriority - b.renderPriority; });
        }
        // console.log(`flushRendererCache ${rendererCache.length}`);
        for(let render of rendererCache){
            // console.log(`${render.node.name} render hash ${render.renderData.dataHash}`);
            render.fillBuffers(this);
-            if(render.sortingOpacity >= 0){
-                updateOpacity(render.renderData, render.sortingOpacity);
+            if(render.renderOpacity >= 0){
+                updateOpacity(render.renderData, render.renderOpacity);
                const buffer = render.renderData.getMeshBuffer();
                if (buffer) {
                    buffer.setDirty();
@@ -126,7 +125,7 @@ UI.prototype.update = function() {
    }
 }

-UI.prototype.walk = function(node: Node, level = 0){
+UI.prototype.walk = function(node: Node, level = 0, sortingPriority = 0){
    if (!node.activeInHierarchy) {
        return;
    }
@@ -134,6 +133,8 @@ UI.prototype.walk = function(node: Node, level = 0){
    const uiProps = node._uiProps;
    const render = uiProps.uiComp as UIRenderer;
    const stencilEnterLevel = render && (render.stencilStage === _cocos_2d_renderer_stencil_manager__Stage.ENTER_LEVEL || render.stencilStage === _cocos_2d_renderer_stencil_manager__Stage.ENTER_LEVEL_INVERTED);
+    const transform = uiProps.uiTransformComp;
+    sortingPriority = (transform && transform._sortingEnabled) ? transform._sortingPriority : sortingPriority;

    // Save opacity
    const parentOpacity = this._pOpacity;
@@ -167,14 +168,14 @@ UI.prototype.walk = function(node: Node, level = 0){
            }
        }else{
            this.rendererCache.push(render);
-            render._sortingPriority = render._sortingPriority ?? DEFAULT_SORTING_PRIORITY;
-            if(render._sortingPriority != DEFAULT_SORTING_PRIORITY){
+            render.renderPriority = sortingPriority;
+            if(sortingPriority != 0){
                this.rendererOrder = true;
            }
            if (this._opacityDirty && render && !render.useVertexOpacity && render.renderData && render.renderData.vertexCount > 0) {
-                render.sortingOpacity = opacity;
+                render.renderOpacity = opacity;
            }else{
-                render.sortingOpacity = -1;
+                render.renderOpacity = -1;
            }
        }
    }
@@ -182,7 +183,7 @@ UI.prototype.walk = function(node: Node, level = 0){
    if (children.length > 0 && !node._static) {
        for (let i = 0; i < children.length; ++i) {
            const child = children[i];
-            this.walk(child, level);
+            this.walk(child, level, sortingPriority);
        }
    }

--- a/assets/lcc-ui-sorting-group/sorting-define.ts
+++ b/assets/lcc-ui-sorting-group/sorting-define.ts
@@ -7,7 +7,7 @@ export enum SortingLayer {
    //-- 自定义，在此之上，小于 DEFAULT 的层级

    /** 
-     * 默认层级，在没有应用排序的UI渲染上的默认层级
+     * 默认层级，在没有应用排序的UI渲染上的默认层级 *不要修改此枚举*
     */
    DEFAULT = 0,

@@ -21,8 +21,3 @@ export enum SortingLayer {
 * 在层级中最大排序值
 */
 export const ORDER_IN_LAYER_MAX = 100000;
-
-/**
- * 默认排序优先级
- */
-export const DEFAULT_SORTING_PRIORITY = SortingLayer.DEFAULT * ORDER_IN_LAYER_MAX;
--- a/assets/lcc-ui-sorting-group/sorting-group.ts
+++ b/assets/lcc-ui-sorting-group/sorting-group.ts
@@ -1,10 +1,10 @@

-import { _decorator, Component, Node, ccenum, CCInteger, CCFloat, Enum, director, UI, UIRenderer } from 'cc';
-import { DEFAULT_SORTING_PRIORITY, ORDER_IN_LAYER_MAX, SortingLayer } from './sorting-define';
+import { _decorator, Component, Node, ccenum, CCInteger, CCFloat, Enum, director, UI, UIRenderer, UITransform } from 'cc';
+import { ORDER_IN_LAYER_MAX, SortingLayer } from './sorting-define';
 const { ccclass, property, type, disallowMultiple, requireComponent, executeInEditMode } = _decorator;

@ccclass('lcc-ui/SortingGroup')
-@requireComponent(UIRenderer)
+@requireComponent(UITransform)
@disallowMultiple(true)
@executeInEditMode(true)
 export class SortingGroup extends Component {
@@ -20,20 +20,19 @@ export class SortingGroup extends Component {
    @property({ type:CCFloat, min: 0, max : ORDER_IN_LAYER_MAX })
    orderInLayer:number = 0;

-    /**
-     * UI渲染器
-     */
-    private _uiRenderer:UIRenderer = null;
+    private _uiTransform:UITransform = null;

    onLoad(){
-        this._uiRenderer = this.getComponent(UIRenderer);
+        this._uiTransform = this.getComponent(UITransform);
    }

    onEnable(){
-        this._uiRenderer.sortingPriority = Math.sign(this.sortingLayer) * (Math.abs(this.sortingLayer) * ORDER_IN_LAYER_MAX + this.orderInLayer);
+        this._uiTransform.sortingPriority = Math.sign(this.sortingLayer) * (Math.abs(this.sortingLayer) * ORDER_IN_LAYER_MAX + this.orderInLayer);
+        this._uiTransform.sortingEnabled = true;
    }

    onDisable(){
-        this._uiRenderer.sortingPriority = DEFAULT_SORTING_PRIORITY;
+        this._uiTransform.sortingPriority = 0;
+        this._uiTransform.sortingEnabled = false;
    }
 }
--- a/assets/test/scenes/test-scene-sorting.scene
+++ b/assets/test/scenes/test-scene-sorting.scene
@@ -27,11 +27,11 @@
    "_active": true,
    "_components": [],
    "_prefab": {
-      "__id__": 42
+      "__id__": 57
    },
    "autoReleaseAssets": false,
    "_globals": {
-      "__id__": 43
+      "__id__": 58
    },
    "_id": "b977450f-1cd5-49fa-a8db-db655012dcf5"
  },
@@ -227,27 +227,33 @@
      },
      {
        "__id__": 25
+      },
+      {
+        "__id__": 38
+      },
+      {
+        "__id__": 50
      }
    ],
    "_active": true,
    "_components": [
      {
-        "__id__": 38
+        "__id__": 53
      },
      {
-        "__id__": 39
+        "__id__": 54
      },
      {
-        "__id__": 40
+        "__id__": 55
      },
      {
-        "__id__": 41
+        "__id__": 56
      }
    ],
    "_prefab": null,
    "_lpos": {
      "__type__": "cc.Vec3",
-      "x": 959.9999999999999,
+      "x": 960.0000000000001,
      "y": 540,
      "z": 0
    },
@@ -873,6 +879,9 @@
    ],
    "_active": false,
    "_components": [
+      {
+        "__id__": 36
+      },
      {
        "__id__": 37
      }
@@ -1024,8 +1033,8 @@
    "_enabled": true,
    "__prefab": null,
    "sortingLayer": 1,
-    "orderInLayer": 0,
-    "_id": "efCgxc/lVEPqsH8au8/ebz"
+    "orderInLayer": 3,
+    "_id": "b7SyZGN8ZByo48B8plzxZd"
  },
  {
    "__type__": "cc.Node",
@@ -1147,9 +1156,6 @@
      },
      {
        "__id__": 35
-      },
-      {
-        "__id__": 36
      }
    ],
    "_prefab": null,
@@ -1240,19 +1246,6 @@
    "_cacheMode": 0,
    "_id": "27iorVNlhOCpEZnibntFMV"
  },
-  {
-    "__type__": "5c8c9BaV+VA1Z3pK+Zsi3Cb",
-    "_name": "",
-    "_objFlags": 0,
-    "node": {
-      "__id__": 33
-    },
-    "_enabled": true,
-    "__prefab": null,
-    "sortingLayer": 1,
-    "orderInLayer": 0,
-    "_id": "126CLe+FtLK6NZ5f0v9mHT"
-  },
  {
    "__type__": "cc.UITransform",
    "_name": "",
@@ -1274,6 +1267,529 @@
    },
    "_id": "c0+Znh+wNM+4H6zrz3BEP5"
  },
+  {
+    "__type__": "5c8c9BaV+VA1Z3pK+Zsi3Cb",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 25
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "sortingLayer": 1,
+    "orderInLayer": 2,
+    "_id": "0fSX301tNL3ID+MhrxV/d7"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Node-001",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 7
+    },
+    "_children": [
+      {
+        "__id__": 39
+      },
+      {
+        "__id__": 42
+      },
+      {
+        "__id__": 45
+      }
+    ],
+    "_active": false,
+    "_components": [
+      {
+        "__id__": 48
+      },
+      {
+        "__id__": 49
+      }
+    ],
+    "_prefab": null,
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": -218.293,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_layer": 33554432,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": "5aZiXEa0JHkqYnTDtoDhPZ"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Label",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 38
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 40
+      },
+      {
+        "__id__": 41
+      }
+    ],
+    "_prefab": null,
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 86.86400000000003,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_layer": 33554432,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": "fcd9mrQURJl70Yh4NjZFfk"
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 39
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 318.81,
+      "height": 50.4
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": "b4U1x/26ZMYorC7jryRepx"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 39
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_customMaterial": null,
+    "_srcBlendFactor": 2,
+    "_dstBlendFactor": 4,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_string": "label111111111111",
+    "_horizontalAlign": 1,
+    "_verticalAlign": 1,
+    "_actualFontSize": 40,
+    "_fontSize": 40,
+    "_fontFamily": "Arial",
+    "_lineHeight": 40,
+    "_overflow": 0,
+    "_enableWrapText": true,
+    "_font": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_isItalic": false,
+    "_isBold": false,
+    "_isUnderline": false,
+    "_underlineHeight": 2,
+    "_cacheMode": 0,
+    "_id": "e78f0Gaa1BVbyP/NEimc2D"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SpriteSplash",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 38
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 43
+      },
+      {
+        "__id__": 44
+      }
+    ],
+    "_prefab": null,
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": 4.493000000000052,
+      "y": 7.488500000000045,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_layer": 33554432,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": "e9YhmcmeJOWpNBcf0S6ISS"
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 42
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 654.13,
+      "height": 378.563
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": "4cBrueDfBClLeJCqVLHVjF"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 42
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_customMaterial": null,
+    "_srcBlendFactor": 2,
+    "_dstBlendFactor": 4,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 122,
+      "g": 255,
+      "b": 0,
+      "a": 136
+    },
+    "_spriteFrame": {
+      "__uuid__": "7d8f9b89-4fd1-4c9f-a3ab-38ec7cded7ca@f9941",
+      "__expectedType__": "cc.SpriteFrame"
+    },
+    "_type": 0,
+    "_fillType": 0,
+    "_sizeMode": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_useGrayscale": false,
+    "_atlas": null,
+    "_id": "5fDWm0jBRKnJQw/0J3YViz"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "Label-001",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 38
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 46
+      },
+      {
+        "__id__": 47
+      }
+    ],
+    "_prefab": null,
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": -47.92500000000001,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_layer": 33554432,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": "d54BCitp5CbbB0vOFgIGbA"
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 45
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 329.22,
+      "height": 50.4
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": "77RtH07pZMGoZCo4eGSEh+"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 45
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_customMaterial": null,
+    "_srcBlendFactor": 2,
+    "_dstBlendFactor": 4,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_string": "label22222222222",
+    "_horizontalAlign": 1,
+    "_verticalAlign": 1,
+    "_actualFontSize": 40,
+    "_fontSize": 40,
+    "_fontFamily": "Arial",
+    "_lineHeight": 40,
+    "_overflow": 0,
+    "_enableWrapText": true,
+    "_font": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_isItalic": false,
+    "_isBold": false,
+    "_isUnderline": false,
+    "_underlineHeight": 2,
+    "_cacheMode": 0,
+    "_id": "b295f53fRNOoD+5khP4lUS"
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 38
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 100,
+      "height": 100
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": "f3nDcnVYdN6pZUfDtW0fDt"
+  },
+  {
+    "__type__": "5c8c9BaV+VA1Z3pK+Zsi3Cb",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 38
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "sortingLayer": 1,
+    "orderInLayer": 1,
+    "_id": "e8pXnnkRRPfo50O0CR7SRu"
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SpriteSplash",
+    "_objFlags": 0,
+    "_parent": {
+      "__id__": 7
+    },
+    "_children": [],
+    "_active": false,
+    "_components": [
+      {
+        "__id__": 51
+      },
+      {
+        "__id__": 52
+      }
+    ],
+    "_prefab": null,
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": -630.484,
+      "y": -352.824,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_layer": 33554432,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": "c0VfwcFp5DzZIfeDWG4MA7"
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 50
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 654.13,
+      "height": 378.563
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": "16eXrC15RCR7XXix5wahAm"
+  },
+  {
+    "__type__": "cc.Sprite",
+    "_name": "",
+    "_objFlags": 0,
+    "node": {
+      "__id__": 50
+    },
+    "_enabled": true,
+    "__prefab": null,
+    "_customMaterial": null,
+    "_srcBlendFactor": 2,
+    "_dstBlendFactor": 4,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 0,
+      "b": 0,
+      "a": 136
+    },
+    "_spriteFrame": {
+      "__uuid__": "7d8f9b89-4fd1-4c9f-a3ab-38ec7cded7ca@f9941",
+      "__expectedType__": "cc.SpriteFrame"
+    },
+    "_type": 0,
+    "_fillType": 0,
+    "_sizeMode": 0,
+    "_fillCenter": {
+      "__type__": "cc.Vec2",
+      "x": 0,
+      "y": 0
+    },
+    "_fillStart": 0,
+    "_fillRange": 0,
+    "_isTrimmedMode": true,
+    "_useGrayscale": false,
+    "_atlas": null,
+    "_id": "b9Wwwx4phE7oA1FN/IyNcP"
+  },
  {
    "__type__": "cc.UITransform",
    "_name": "",
@@ -1321,8 +1837,8 @@
    "__prefab": null,
    "_alignFlags": 45,
    "_target": null,
-    "_left": -1.1368683772161603e-13,
-    "_right": -1.1368683772161603e-13,
+    "_left": 1.1368683772161603e-13,
+    "_right": 1.1368683772161603e-13,
    "_top": 0,
    "_bottom": 0,
    "_horizontalCenter": 0,
@@ -1379,19 +1895,19 @@
  {
    "__type__": "cc.SceneGlobals",
    "ambient": {
-      "__id__": 44
+      "__id__": 59
    },
    "shadows": {
-      "__id__": 45
+      "__id__": 60
    },
    "_skybox": {
-      "__id__": 46
+      "__id__": 61
    },
    "fog": {
-      "__id__": 47
+      "__id__": 62
    },
    "octree": {
-      "__id__": 48
+      "__id__": 63
    }
  },
  {