qml实现一个可以八方向缩放的矩形

LearningMegan

于 2024-08-15 15:26:08 发布

阅读量113

点赞数 3

文章标签： qml C++

本文链接：https://blog.csdn.net/Sunshine_love520/article/details/141223424

版权


```cpp
import QtQuick 2.15
import Utility 1.0
import DataBase 1.0
import PatchData 1.0
import LayerData 1.0
import MonitorBase 1.0
import Kompass 1.0
import "Adsorbed.js" as Adsorb

Rectangle{
    id: rectDelegate

    property var userId: model.modelData.userId
    property var type: model.modelData.type
    property alias name: itemName.text
    property var scaleFactor: 1.0
    property var borderColor_normal: "#5D8D88"
    property var borderColor_checked: "#E56C00"
    property var scaleAreaFillColor: "#E56C00"
    property int textPosition: RectangleDelegate.TextPosition.BottomLeft
    property var textTransformOrigin: Item.Center
    property var textColor: "#FFFFFF"
    property var minX: 0
    property var minY: 0
    property var minWidth: 64
    property var minHeight: 64
    property bool isLayerCanvas: false
    property bool nameVisible: true
    property bool scaleAreaVisible: true   //鼠标八方向缩放区域是否显示 
    property bool useEditData: false
    property bool dropEnable: false
    property var rot: 0
    property int step: 6 / scaleFactor;     //鼠标的检测区域尺寸
    property var pressedPos;   //鼠标按下时的坐标
    property var currentPos;   //鼠标移动时的坐标
    property var mode: Kompass.EnRealTimeMode
    property var areaType
    property var absorbItemList: []
    //是否点击
    property alias ispressed: mouse_area.pressed
    //鼠标状态
    property int mouseState: RectangleDelegate.MouseState.Center
    property alias nameRectColor: nameRect.color
    property var nameAmplify: true
    property var rectangleDelegateTranslateFlag : false
    //异形形态模式
    property bool isShapeForm: false

    signal doubleClicked()
    signal itemSelected(var selected)
    signal rightButtonReleased()

    //鼠标锚点枚举
    enum MouseState {
        TopLeft,
        TopRight,
        BottomRight,
        BottomLeft,
        Top,
        Bottom,
        Left,
        Right,
        Center
    }

    //自定义文本显示位置，用于处理文本显示在rectangle的什么位置
    enum TextPosition {
        TopLeft,
        TopRight,
        BottomLeft,
        BottomRight,
        Center
    }

    //更新模型数据
    function updateX(x) {
        if (useEditData) {
            MonitorBaseObj.updateLayerGeometryProperty(model.modelData, DataBase.XposType, x);
        }
        else if (isLayerCanvas) {
            model.modelData.layerX = x
        }
        else {
            model.modelData.x = x
        }
    }
    function updateY(y) {
        console.log("updateY()： ", y)
        if (useEditData) {
            MonitorBaseObj.updateLayerGeometryProperty(model.modelData, DataBase.YposType, y);
        }
        else if (isLayerCanvas) {
            model.modelData.layerY = y
        }
        else {
            model.modelData.y = y
        }
    }
    function updateWidth(w) {
        if (isLayerCanvas) {
            model.modelData.layerWidth = w
        }
        else {
            model.modelData.width = w
        }
    }
    function updateHeight(h) {
        if (isLayerCanvas) {
            model.modelData.layerHeight = h
        }
        else {
            model.modelData.height = h
        }
    }

    function selectPatch() {
        if (model.modelData) {
            if(model.modelData.type === DataBase.Screen) {
                MonitorBaseObj.selectScreen(model.modelData.userId, model.modelData.userId, true)
            }
            else {
                MonitorBaseObj.selectPatch(model.modelData.userId, model.modelData.userId, true, false)
            }
        }
    }

    function move(xOffset, yOffset) {
        MonitorBaseObj.move(rectDelegate.areaType, model.modelData, xOffset, yOffset);

        var adsorbOffset = Adsorb.collisionDetect(model.modelData, absorbItemList, rectDelegate.areaType)
        if (adsorbOffset !== null) {
            MonitorBaseObj.move(rectDelegate.areaType, model.modelData, adsorbOffset.x, adsorbOffset.y);
            Adsorb.updateFlag(model.modelData, absorbItemList, rectDelegate.areaType)
        }
    }

    function scaleByTopLeft(wratio, hratio, anchorIndexA, anchorIndexB) {
        if ((Math.round(model.modelData.width) <= minWidth && wratio - 1.0 < 1e-6)
            || (Math.round(model.modelData.height) <= minHeight && hratio - 1.0 < 1e-6)) {
            return;
        }

        MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, wratio, hratio, Kompass.EnTopLeft)

        //缩放吸附
        var offset = Adsorb.collisionDetect(model.modelData, absorbItemList, rectDelegate.areaType, anchorIndexA, anchorIndexB)
        if (offset !== null) {
            var transPos = getTransPoint(offset.x, offset.y)
            var xoffsetRatio = 1 + transPos.x * 1.0 / rectDelegate.width
            var yoffsetRatio = 1 + transPos.y * 1.0 / rectDelegate.height
            //限制最小尺寸，防止缩小到看不见。
            if (xoffsetRatio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                xoffsetRatio = rectDelegate.minWidth * 1.0 / rectDelegate.width

            if (yoffsetRatio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                yoffsetRatio = rectDelegate.minHeight * 1.0 / rectDelegate.height

            MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, xoffsetRatio, yoffsetRatio, Kompass.EnTopLeft)
            Adsorb.updateFlag(model.modelData, absorbItemList, rectDelegate.areaType)
        }
    }

    function scaleByBottomLeft(wratio, hratio, anchorIndexA, anchorIndexB) {
        if ((Math.round(model.modelData.width) <= minWidth && wratio - 1.0 < 1e-6)
            || (Math.round(model.modelData.height) <= minHeight && hratio - 1.0 < 1e-6)) {
            return;
        }

        MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, wratio, hratio, Kompass.EnBottomLeft)

        //缩放吸附
        var offset = Adsorb.collisionDetect(model.modelData, absorbItemList, rectDelegate.areaType, anchorIndexA, anchorIndexB)
        if (offset !== null) {
            var transPos = getTransPoint(offset.x, offset.y)
            var xoffsetRatio = 1 + transPos.x * 1.0 / rectDelegate.width
            var yoffsetRatio = 1 - transPos.y * 1.0 / rectDelegate.height

            //限制最小尺寸，防止缩小到看不见。
            if (xoffsetRatio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                xoffsetRatio = rectDelegate.minWidth * 1.0 / rectDelegate.width

            if (yoffsetRatio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                yoffsetRatio = rectDelegate.minHeight * 1.0 / rectDelegate.height

            MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, xoffsetRatio, yoffsetRatio, Kompass.EnBottomLeft)
            Adsorb.updateFlag(model.modelData, absorbItemList, rectDelegate.areaType)
        }
    }

    function scaleByTopRight(wratio, hratio, anchorIndexA, anchorIndexB) {
        if ((Math.round(model.modelData.width) <= minWidth && wratio - 1.0 < 1e-6)
            || (Math.round(model.modelData.height) <= minHeight && hratio - 1.0 < 1e-6)) {
            return;
        }

        MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, wratio, hratio, Kompass.EnTopRight)

        var offset = Adsorb.collisionDetect(model.modelData, absorbItemList, rectDelegate.areaType, anchorIndexA, anchorIndexB)
        if (offset !== null) {
            var transPos = getTransPoint(offset.x, offset.y)
            var xoffsetRatio = 1 - transPos.x / rectDelegate.width
            var yoffsetRatio = 1 + transPos.y / rectDelegate.height
            //限制最小尺寸，防止缩小到看不见。
            if (xoffsetRatio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                xoffsetRatio = rectDelegate.minWidth * 1.0 / rectDelegate.width

            if (yoffsetRatio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                yoffsetRatio = rectDelegate.minHeight * 1.0 / rectDelegate.height

            MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, xoffsetRatio, yoffsetRatio, Kompass.EnTopRight)
            Adsorb.updateFlag(model.modelData, absorbItemList, rectDelegate.areaType)
        }
    }

    function scaleByBottomRight(wratio, hratio, anchorIndexA, anchorIndexB) {
        if ((Math.round(model.modelData.width) <= minWidth && wratio - 1.0 < 1e-6)
            || (Math.round(model.modelData.height) <= minHeight && hratio - 1.0 < 1e-6)) {
            return;
        }

        MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, wratio, hratio, Kompass.EnBottomRight)

        var offset = Adsorb.collisionDetect(model.modelData, absorbItemList, rectDelegate.areaType, anchorIndexA, anchorIndexB)
        if (offset !== null) {
            var transPos = getTransPoint(offset.x, offset.y)
            var xoffsetRatio = 1 - transPos.x / rectDelegate.width
            var yoffsetRatio = 1 - transPos.y / rectDelegate.height
            //限制最小尺寸，防止缩小到看不见。
            if (xoffsetRatio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                xoffsetRatio = rectDelegate.minWidth * 1.0 / rectDelegate.width

            if (yoffsetRatio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                yoffsetRatio = rectDelegate.minHeight * 1.0 / rectDelegate.height

            MonitorBaseObj.scale(rectDelegate.areaType, model.modelData, xoffsetRatio, yoffsetRatio, Kompass.EnBottomRight)
            Adsorb.updateFlag(model.modelData, absorbItemList, rectDelegate.areaType)
        }
    }

    function getTransPoint(deltX, deltY) {
        var angle = rectDelegate.rotation * Math.PI / 180
        var xOffset = deltX * Math.cos(angle) + deltY * Math.sin(angle)
        var yOffset = deltY * Math.cos(angle) - deltX * Math.sin(angle)
        return Qt.point(xOffset, yOffset)
    }

    function updateAdsordList() {
        //更新吸附列表
        absorbItemList = MonitorBaseObj.getItems(rectDelegate.areaType)
        Adsorb.updateAbsorRange(5.0 / rectDelegate.scaleFactor)
    }

    function clear() {
        painter.clear()
        absorbItemList = []
        MonitorBaseObj.sendMsgUpdateGeometryProperty(model.modelData, tansToPropertyType(model.modelData.type));
    }

    function tansToPropertyType(type) {
        if(type === DataBase.Layer) {
            return Kompass.EnLayerData
        }
        else if(type === DataBase.Patch) {
            if(useEditData){
                return Kompass.EnPatchData
            }
            else {
                return Kompass.EnOutPutPatchData
            }
        }
    }

    x: isLayerCanvas ? model.modelData.layerX : model.modelData.x
    y: isLayerCanvas ? model.modelData.layerY : model.modelData.y
    z: isLayerCanvas ? model.modelData.layerZ : model.modelData.z
    width: isLayerCanvas ? model.modelData.layerWidth : model.modelData.width
    height: isLayerCanvas ? model.modelData.layerHeight : model.modelData.height
    border.color: (useEditData ? model.modelData.editSelected : model.modelData.selected) ? borderColor_checked : borderColor_normal
    border.width: 2.0 / scaleFactor
    //transformOrigin: Item.TopLeft
    rotation: isLayerCanvas ? model.modelData.layerRotation : model.modelData.rotate
    color: "transparent"
    clip: true
    antialiasing: true

    Rectangle {
        id: nameRect
        property var nameMaxWidth: rectDelegate.width * 0.8 * scaleFactor

        width: itemName.contentWidth < nameRect.nameMaxWidth ? itemName.contentWidth + 20 : Math.min(nameRect.nameMaxWidth + 20, rectDelegate.width * scaleFactor - 4)
        height: itemName.contentHeight + 10
        color: (useEditData ? model.modelData.editSelected : model.modelData.selected) && !isShapeForm ? "#000000" : "transparent"
        visible: rectDelegate.nameVisible
        scale: 1.0 / scaleFactor
        transformOrigin: rectDelegate.textTransformOrigin
        clip: true
        z: 1

        KText {
            id: itemName
            anchors.centerIn: parent
            //width: parent.width
            //height: parent.height
            verticalAlignment: Text.AlignVCenter
            horizontalAlignment: Text.AlignHCenter
            text: model.modelData.name + model.modelData.serial
            color: rectDelegate.textColor
            elide: Text.ElideRight
            translateFlag : rectangleDelegateTranslateFlag
            font.pixelSize: (nameAmplify && (useEditData ? model.modelData.editSelected : model.modelData.selected)) && !isShapeForm ? 14 : 10
        }
    }


    MouseArea {
        id: mouse_area
        acceptedButtons: Qt.LeftButton | Qt.RightButton
        hoverEnabled: rectDelegate.focus
        anchors.fill: rectDelegate
        property var innerPressedPos: Qt.point(0, 0)

        onPressed: {
            innerPressedPos = Qt.point(mouse.x, mouse.y)
            //ctrl+多选，shift+连选，默认单选
            switch (mouse.modifiers) {
                case Qt.ControlModifier:   //ctrl多选
                     console.log("ControlModifier")
                    if (mouse.button === Qt.LeftButton) {
                        if (model.modelData) {
                            if (useEditData) {
                                var bSelected = model.modelData.editSelected
                                MonitorBaseObj.selectEditData(model.modelData, !bSelected, true)
                            }
                            else if(model.modelData.type === DataBase.Screen) {
                                var bSelected = model.modelData.selected
                                MonitorBaseObj.selectScreen(model.modelData.userId, model.modelData.userId, !bSelected, true)
                            }
                            else {
                                var bSelected = model.modelData.selected
                                MonitorBaseObj.selectPatch(model.modelData.userId, model.modelData.userId, !bSelected, isLayerCanvas, true)
                            }
                        }
                    }
                    break;
                default:   //单选
                    if (rectDelegate.visible) {

                        if (mouse.button === Qt.RightButton && MonitorBaseObj.hasMultiSelected(areaType))
                        {
                            console.log("RightButton And MultiSelected")
                            return
                        }

                        rectDelegate.focus = true
                        pressedPos = parent.mapToItem(parent.parent, mouseX, mouseY);
                        updateAdsordList()

                        //console.log("rectangle name: ", model.modelData.name, model.modelData)
                        if (model.modelData) {
                            if (useEditData) {
                                MonitorBaseObj.selectEditData(model.modelData, true)
                            }
                            else if(model.modelData.type === DataBase.Screen) {
                                MonitorBaseObj.selectScreen(model.modelData.userId, model.modelData.userId, true)
                            }
                            else {
                                MonitorBaseObj.selectPatch(model.modelData.userId, model.modelData.userId, true, isLayerCanvas)
                            }
                        }
                        mouse.accepted = true;
                    }
                    break;
            }
        }
        onReleased: {
            painter.clear()
            absorbItemList = []
            //console.log("onReleased pos:", rectDelegate.x, rectDelegate.y)
            MonitorBaseObj.sendMsgUpdateGeometryProperty(model.modelData, tansToPropertyType(model.modelData.type));

            if (mouse.button === Qt.RightButton) {
                rectDelegate.rightButtonReleased()
            }

            mouse.accepted = true;
        }
        onPositionChanged: {
            console.log("onPositionChanged")
            if (mouse_area.pressed && mouse.button === Qt.RightButton) {
                return
            }

            if (mouse_area.pressed) {

                currentPos = parent.mapToItem(parent.parent, mouseX, mouseY);

                switch (mouseState) //判断鼠标当前状态
                {
                    case RectangleDelegate.MouseState.Center:
                        console.log("======== Center, pos: ", rectDelegate.x, rectDelegate.y, "offset: ", currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var xOffset = currentPos.x - pressedPos.x;
                        var yOffset = currentPos.y - pressedPos.y;
                        move(xOffset, yOffset)
                        break;
                    case RectangleDelegate.MouseState.TopLeft:
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 - transPos.x * 1.0 / rectDelegate.width
                        var hratio = 1 - transPos.y * 1.0 / rectDelegate.height

                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByBottomRight(wratio, hratio, 3, -1)
                        break;

                    case RectangleDelegate.MouseState.Left:
                        //var wratio = 1 - (currentPos.x - pressedPos.x) * 1.0 / rectDelegate.width
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 - transPos.x * 1.0 / rectDelegate.width
                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        scaleByTopRight(wratio, 1.0, 1, 3)
                        break;

                    case RectangleDelegate.MouseState.BottomLeft:
                        //var wratio = 1 - (currentPos.x - pressedPos.x) * 1.0 / rectDelegate.width
                        //var hratio = 1 + (currentPos.y - pressedPos.y) * 1.0 / rectDelegate.height
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 - transPos.x * 1.0 / rectDelegate.width
                        var hratio = 1 + transPos.y * 1.0 / rectDelegate.height

                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByTopRight(wratio, hratio, 1, -1)
                        break;

                    case RectangleDelegate.MouseState.Top:
                        //var hratio = 1 - (currentPos.y - pressedPos.y) * 1.0 / rectDelegate.height
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var hratio = 1 - (transPos.y) * 1.0 / rectDelegate.height
                        //限制最小尺寸，防止缩小到看不见。
                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByBottomLeft(1.0, hratio, 2, 3)
                        break;

                    case RectangleDelegate.MouseState.Bottom:
                        //var hratio = 1 + (currentPos.y - pressedPos.y) * 1.0 / rectDelegate.height
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var hratio = 1 + transPos.y * 1.0 / rectDelegate.height
                        //限制最小尺寸，防止缩小到看不见。
                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByTopLeft(1.0, hratio, 0, 1)
                        break;

                    case RectangleDelegate.MouseState.TopRight:
                        //var wratio = 1 + (currentPos.x - pressedPos.x) * 1.0 / rectDelegate.width
                        //var hratio = 1 + (pressedPos.y - currentPos.y) * 1.0 / rectDelegate.height
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 + transPos.x * 1.0 / rectDelegate.width
                        var hratio = 1 - transPos.y * 1.0 / rectDelegate.height

                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByBottomLeft(wratio, hratio, 2, -1)
                        break;

                    case RectangleDelegate.MouseState.Right:
                        //var wratio = 1 + (currentPos.x - pressedPos.x) * 1.0 / rectDelegate.width
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 + transPos.x * 1.0 / rectDelegate.width

                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        scaleByTopLeft(wratio, 1.0, 0, 2)
                        break;

                    case RectangleDelegate.MouseState.BottomRight:
                        var transPos = getTransPoint(currentPos.x - pressedPos.x, currentPos.y - pressedPos.y)
                        var wratio = 1 + transPos.x * 1.0 / rectDelegate.width
                        var hratio = 1 + transPos.y * 1.0 / rectDelegate.height

                        //限制最小尺寸，防止缩小到看不见。
                        if (wratio < rectDelegate.minWidth * 1.0 / rectDelegate.width)
                            wratio = rectDelegate.minWidth * 1.0 / rectDelegate.width

                        if (hratio < rectDelegate.minHeight * 1.0 / rectDelegate.height)
                            hratio = rectDelegate.minHeight * 1.0 / rectDelegate.height

                        scaleByTopLeft(wratio, hratio, 0, -1)
                        break;
                    default:
                }

                pressedPos = currentPos;
            }
            else if (scaleAreaVisible) {
                if (mouseX < rectDelegate.step && mouseX >= 0) {
                    if (0 <= mouseY && mouseY < rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.TopLeft;
                        //mouse_area.cursorShape = Qt.SizeFDiagCursor;
                    }
                    else if ((rectDelegate.height - rectDelegate.step) < mouseY && mouseY <= rectDelegate.height) {
                        mouseState = RectangleDelegate.MouseState.BottomLeft;
                        //mouse_area.cursorShape = Qt.SizeBDiagCursor;
                    }
                    else if (rectDelegate.step <= mouseY && mouseY <= rectDelegate.height - rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.Left;
                        //mouse_area.cursorShape = Qt.SizeHorCursor;
                    }
                }
                else if (rectDelegate.width - rectDelegate.step < mouseX && mouseX <= rectDelegate.width) {
                    if (0 <= mouseY && mouseY < rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.TopRight;
                        //mouse_area.cursorShape = Qt.SizeBDiagCursor;
                    }
                    else if ((rectDelegate.height - rectDelegate.step) < mouseY && mouseY <= rectDelegate.height) {
                        mouseState = RectangleDelegate.MouseState.BottomRight;
                        //mouse_area.cursorShape = Qt.SizeFDiagCursor;
                    }
                    else if (rectDelegate.step <= mouseY && mouseY <= rectDelegate.height - rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.Right;
                        //mouse_area.cursorShape = Qt.SizeHorCursor;
                    }
                }
                else if (rectDelegate.width - rectDelegate.step >= mouseX && mouseX >= rectDelegate.step) {
                    if (0 <= mouseY && mouseY < rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.Top;
                        // mouse_area.cursorShape = Qt.SizeVerCursor;
                    }
                    else if ((rectDelegate.height - rectDelegate.step) < mouseY && mouseY <= rectDelegate.height) {
                        mouseState = RectangleDelegate.MouseState.Bottom;
                        //mouse_area.cursorShape = Qt.SizeVerCursor;
                    }
                    else if (rectDelegate.step <= mouseY && mouseY <= rectDelegate.height - rectDelegate.step) {
                        mouseState = RectangleDelegate.MouseState.Center;
                        //mouse_area.cursorShape = Qt.ArrowCursor;
                    }
                }
            }

            mouse.accepted = true;
        }
        onDoubleClicked: {
            rectDelegate.doubleClicked()
        }
    }

    //失去焦点时改变鼠标形状，且将鼠标状态重置为Center
    onFocusChanged: {
        if (!rectDelegate.focus) {
            mouse_area.cursorShape = Qt.ArrowCursor;
            mouseState = RectangleDelegate.MouseState.Center;
        }
    }

    Component.onCompleted: {
        if (RectangleDelegate.TextPosition.TopLeft === textPosition)  //显示在左上角
        {
            nameRect.anchors.top = nameRect.parent.top
            nameRect.anchors.topMargin = 2 / scaleFactor
            nameRect.anchors.left = nameRect.parent.left
            nameRect.anchors.leftMargin = 2 / scaleFactor
            itemName.horizontalAlignment = Text.AlignLeft
        }
        else if (RectangleDelegate.TextPosition.TopRight === textPosition)  //显示在右上角
        {
            nameRect.anchors.top = rectDelegate.top
            nameRect.anchors.topMargin = 2 / scaleFactor
            nameRect.anchors.right = rectDelegate.right
            nameRect.anchors.rightMargin = 2 / scaleFactor
            itemName.horizontalAlignment = Text.AlignRight
        }
        else if (RectangleDelegate.TextPosition.BottomLeft === textPosition)  //显示在左下角
        {
            nameRect.anchors.bottom = rectDelegate.bottom
            nameRect.anchors.bottomMargin = 2 / scaleFactor
            nameRect.anchors.left = rectDelegate.left
            nameRect.anchors.leftMargin = 2 / scaleFactor
            itemName.horizontalAlignment = Text.AlignLeft
        }
        else if (RectangleDelegate.TextPosition.BottomRight === textPosition)  //显示在右下角
        {
            nameRect.anchors.bottom = rectDelegate.bottom
            nameRect.anchors.bottomMargin = 2 / scaleFactor
            nameRect.anchors.right = rectDelegate.right
            nameRect.anchors.rightMargin = 2 / scaleFactor
            itemName.horizontalAlignment = Text.AlignRight
        }
        else if (RectangleDelegate.TextPosition.Center === textPosition)  //显示在中心
        {
            nameRect.anchors.centerIn = rectDelegate
            itemName.horizontalAlignment = Text.AlignHCenter
        }
    }

    Connections{
        target: model.modelData
        enabled: rectDelegate.enabled
        ignoreUnknownSignals: true
        function onSelectedChanged(selected) {
            //rectDelegate.focus = selected
            rectDelegate.itemSelected(selected)
        }
    }

    DropArea {
        id: dropArea
        anchors.fill: parent
        enabled: dropEnable
        keys: ["materialId", "playerId"]

        onDropped: {
            if (drop.proposedAction == Qt.MoveAction || drop.proposedAction == Qt.CopyAction) {
                drop.acceptProposedAction()
                var materialId = drop.getDataAsString("materialId")
                var playerId = drop.getDataAsString("playerId")
                //var mediaId = drop.getDataAsString("mediaId")
                if (materialId.length > 0) {
                    //console.log("EditArea onDropped chid: ", itemName.text, model.modelData.userId, materialId, playerId)\

                    if (model.modelData.type === DataBase.Layer || model.modelData.type === DataBase.SplitLayer) {
                        MonitorBaseObj.sendMsgAddMedia(model.modelData.userId, materialId, playerId)
                    }
                    else if (model.modelData.type === DataBase.Patch) {
                        MonitorBaseObj.sendMsgAddMedia(model.modelData.parentId, materialId, playerId)
                    }
                }
            }
        }
    }
}

MonitorBase::MonitorBase(void* engine) : QQuickItem(nullptr), m_pool(10)
{
    QQmlApplicationEngine* eng = (QQmlApplicationEngine*)engine;
    QString str = QCoreApplication::applicationDirPath() + "/Ext/";

    eng->rootContext()->setContextProperty("MonitorBaseObj", this);
    m_engine = eng;
    initData();

    m_devicelistmodel = new DeviceListModel();

    ShapeBase::getInstance()->initData();
    eng->rootContext()->setContextProperty("ShapeBaseObj", ShapeBase::getInstance());
}