Qt Quick button mousearea issue

[joko]

Hi,

This is a working code, i just want some advise:

Button.qml

Item
{
    property alias text: label.text
    property bool pressed: false
 
    property int btnHeight: Functions.buttonHeight
 
    id: button
    height: btnHeight
 
    Rectangle
    {
        id: rec
        anchors.fill: parent
        color: pressed ? "#226EEA" : "#1150B7"
    }
 
    Text {
        id: label
        color: "white"
    }
}

Item
{
    property alias text: label.text
    property bool pressed: false

    property int btnHeight: Functions.buttonHeight

    id: button
    height: btnHeight

    Rectangle
    {
        id: rec
        anchors.fill: parent
        color: pressed ? "#226EEA" : "#1150B7"
    }

    Text {
        id: label
        color: "white"
    }
}

To copy to clipboard, switch view to plain text mode 

Otherfile.qml

Button
        {
            id: doneBtn
            text: qsTr("Done")
 
            MouseArea
            {
                anchors.fill: parent
                onClicked: { 
                   //some codes
                }
                onPressed: { doneBtn.pressed = true }
                onReleased: { doneBtn.pressed = false }
            }
        }

Button
        {
            id: doneBtn
            text: qsTr("Done")

            MouseArea
            {
                anchors.fill: parent
                onClicked: { 
                   //some codes
                }
                onPressed: { doneBtn.pressed = true }
                onReleased: { doneBtn.pressed = false }
            }
        }

To copy to clipboard, switch view to plain text mode 

Here are my questions:
1. I'm having problem when I put a mouse area on Button.qml, it will be overriden by the mouse area set from other file. I wanted to put the onPressed and onReleased in Button.qml, so that I don't have to write it down in every mouse area of each buttons.
2. I read somewhere that it is advisable not to put mouse area in reuseable elements, is that correct?
3. Can you please advise how to revise the code, not exactly an actual code but some tips.

TIA.

[anda_skoa]

You could
1) make the Button a MouseArea instead of Item
2) Put a MouseArea into the button, add signals to your item and then call your signals from the internal mouse area.

Mostly depends on whether you are OK with the code using the button having access to other MouseArea features.

Cheers,
_

[joko]

You could
1) make the Button a MouseArea instead of Item
2) Put a MouseArea into the button, add signals to your item and then call your signals from the internal mouse area.

Mostly depends on whether you are OK with the code using the button having access to other MouseArea features.

Cheers,
_

Thanks for the advise anda_skoa!