QML and C++ connect to signal

Question

I want to connect QML Signals to c++ functions. I do not really understand how I can get the right item. Right now I try it in the following way, which is not working (Also, would there be easier ways?), here is the code I tried:

main.cpp:

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include "include/myclass.h"

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl(QLatin1String("qrc:/main.qml")));

    QQmlComponent component(&engine, "qrc:/Page1.qml");
    QObject *item = component.create();
    MyClass myClass;
    QObject::connect(item, SIGNAL(testSignal()),&myClass,SLOT(cppSlot()));

    return app.exec();
}

main.qml:

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 800
    height: 460

    Page1 {
        id: page1
        visible: true
    }
}

Page1.qml:

import QtQuick 2.7
import QtQuick.Window 2.2

Item {
    width: 800
    height: 460

    signal testSignal()

    CustomButton {
        id: cppSignalButton
        x: 14
        y: 55
        buttonText: "Test CPP Signal"
        onButtonClicked: {
            testSignal();
        }
     }
}

CustomButton.qml:

import QtQuick 2.7
import QtQuick.Window 2.2


Rectangle {
    id: root
    width: 200
    height: 50
    color: "#000000"
    border.color: "#FFFFFF"

    property string buttonText
    signal buttonClicked()

    MouseArea {
        id: mouseArea
        anchors.fill: parent

        onClicked:{
            root.buttonClicked();
        }

    }
        Text {
            id: text1
            x: 105
            y: 31
            color: "#ffffff"
            text: buttonText
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
            font.pixelSize: 20
        }
}

and myclass.cpp:

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <iostream>
#include <fstream>
#include <QQuickItem>
#include <QQuickView>

class MyClass : public QObject
{
    Q_OBJECT
public:
    MyClass(){

    };
public slots:
    void cppSlot() {
        std::ofstream textfile;
        textfile.open("test.txt");
        textfile << "Signal worked" << std::endl;
        textfile.close();
        qInfo( "Called the C++ slot" );
    }
};

Answer 1

First you should read this article: Integrating QML and C++

You can invoke your MyClass object method from qml in the following way:

//main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>
#include "include/myclass.h"

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    MyClass myClass;
    engine.rootContext()->setContextProperty("myClass", &myClass);
    engine.load(QUrl(QLatin1String("qrc:/main.qml")));



    return app.exec();
}

//Page1.qml

import QtQuick 2.7
import QtQuick.Window 2.2

Item {
    width: 800
    height: 460

    signal testSignal()

    CustomButton {
        id: cppSignalButton
        x: 14
        y: 55
        buttonText: "Test CPP Signal"
        onButtonClicked: {
            myClass.cppSlot(); //now you can use the context property to invoke your slot
        }
     }
}