qml button not firing, same with MouseArea

Question

Ive created a new QML project based on Qt 5.9.3. I setup a simple ApplicationWindow with a Button as well as my own button (MyButton) and I never get the onClicked() event to fire (apparently) for either of them. My application window pops up with 2 buttons showing. Clicking on either of them shows nothing in my console output.

Im also pre-compiling my qml source files in the .pro file if that even matters. I get some Font errors on startup which I fix in the C++ to get some fonts going so I can see something, other than that there are no errors or warnings. Ive spent a couple hours just trying to get a simple mouse click event through with no luck.

Any help is appreciated.

Here's my main.qml:

import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: "App Title"
    color: "white"

    Button {
        text: "Button"
        onClicked: {
            console.log("clicked")
        }
    }
    MyButton {
        anchors.right: parent.right
        anchors.top: parent.top
        onClicked: {
            console.log("my button clicked")
        }
    }
}

and MyButton.qml

import QtQuick 2.7

Rectangle {
    id: button
    width: 100
    height: 50
    color: "yellow"

    signal clicked()

    MouseArea {
        id: mouseArea
        anchors.fill: button
        visible: false
        enabled: true
        onClicked: {
            console.log("my button mouse clicked")
            clicked()
        }
    }
}

UPDATE: I did a very stupid thing. in my main.cpp file which I did not include I thought I would be cleaner and move my QQmlEngine init code into its own separate method. Of course when the engine reference went out of scope it caused my issue. I didn't look there because I wrongly assumed that the qml code wouldn't work at all if something were wrong there. Sorry to get back on this so late, its been a very busy week and sorry for wasting bandwidth. Thank you for the great debugging suggestions as well for future reference!

Answer 1

I don't know about your problem with the Button from QtQuick.Controls 2.0 - it works perfectly for me.

With your own implementation of the MyButton, that does not work for me either.

The reason is that visible: false will deactivate the MouseArea (and all the children of it) - setting enabled: true won't change that.
Setting visible: false is unnecessary anyway, as a MouseArea has nothing to render - being effictively invisible.

Once you have changed that, you should get a warning:

Error: Insufficient arguments

as you call the signal clicked of the MouseArea which requires an argument (MouseEvent). To call your self-defined signal, call button.clicked() instead.R

---

If you still don't get anyting, you will need to take further debugging steps.

1. Check whether you can generate any output using console.log for example by adding Component.onComplete: console.log("Output works") to one of your objects.

2. Check whether your input is really broken, by changing the color of the Rectangle when the MouseArea is clicked: color: (mouseArea.pressed ? 'red' : 'green')

3. Install an eventFilter to your QGuiApplication (in C++) that will print something, if an MouseEvent is registered.