lcc-ui-sorting-group-demo/assets/lcc-ui-sorting-group/sorting-group.ts

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(UITransform)
@disallowMultiple(true)
@executeInEditMode(true)
export class SortingGroup extends Component {
    /**
     * 排序层
     */
    @type(Enum(SortingLayer))
    sortingLayer:SortingLayer = SortingLayer.DEFAULT;

    /**
     * 排序值
     */
    @property({ type:CCFloat, min: 0, max : ORDER_IN_LAYER_MAX })
    orderInLayer:number = 0;

    private _uiTransform:UITransform = null;

    onLoad(){
        this._uiTransform = this.getComponent(UITransform);
    }

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

    onDisable(){
        this._uiTransform.sortingPriority = 0;
        this._uiTransform.sortingEnabled = false;
    }
}