Integrate C++ and QML. Qt 5.4

  • I was reading the Qt documentation for the past couple of hours trying to figure out a way to make a UI created with Qt Quick UI (QML) communicate (interact) with C++ code (functions... etc.).

    I've read the 5 or 6 similar questions on here to but I'm kind of confused, I have problems figuring out where to start or what to do first. I'd appreciate it a lot if someone could take the time and list the steps needed to make this work.

    What i've done so far. I tried doing ...>add new Item> C++ class but I failed with an error saying:" failed to add one or more files to project"> It seems like the files (.. .cpp and .h) are created, they were in the folder where the other project files were but not included in the project. What I wanna do is just something simple like changing the text of the textedit through a C++ function or any other way possible.

    //Test.qml (main.qml)
    @import QtQuick 2.1
    import QtQuick.Window 2.0

    Rectangle {
    id: rootRect
    width: Screen.width/2
    height: Screen.height/2
    color: "gray"

        id: textField
        width: 120
        height: 40
        color: "white"
        x:274; y: 61
        border.color: "blue"
        border.width: 4
        radius: 2
    TextEdit {
        id: display
        x: 274
        y: 61
        width: 80
        height: 20
        text: qsTr("Text Edit")
        font.pixelSize: 22
        color: "black"
        anchors.centerIn: textField
        id: inputField
        width: textField.width
        height: textField.height
        border.color: "green"
        border.width: 3
        color: "white"
        x: 140; y: 61
        id: input
        color: "red"
        font.pixelSize: 30
        anchors.centerIn: inputField
        text: "Some Text"



    @import QtQuick 2.0
    import QtQuick.Window 2.0

    Item {

    property string defaultText: "New Text"
    id: button
    width: rootRect.width/6
    height: rootRect.height/8
    color: "black"
    x: 200; y: 200
    radius: 10
        id: buttonClickArea
        width: 0
        anchors.rightMargin: 0
        anchors.bottomMargin: 0
        anchors.fill: button
        onClicked: {
                display.text = defaultText


    Thank you for taking the time to read this and/or any replies.

  • Lifetime Qt Champion

    Hi and welcome to devnet,

    Is your project based on the Qt Quick application template ?

  • Thank you.

    Yes, SGaist, it is. It's just a simple UI with a button and two textedit fields.

  • Lifetime Qt Champion

    I meant: is it a pure QML project or do you use e.g. a QtQuick2ApplicationViewer to show your QML window ?

  • I'm preety new to Qt, actually, It's my first time I got my hands on it (not new to c++ though). To be hones I don't know what that "QtQuick2ApplicationViewer" is.

    I just went: new project>Application>Qt Quick UI and then after that i added another new item - right click (on the project, left side window of Qt) > add new > QML File (Qt Quick 2).

    I don't know if I'm allowed to paste links here but if it's not I'll remove it right away. Was following this guys tutorials.

  • Lifetime Qt Champion

    No problem with sharing links as long as they are related to Qt :)

    Ok, so the tutorial is using a Qt Quick UI project which means QML only and no C++. You need to create a new project using the Qt Quick Application template. With that one you'll be able to use both C++ and QML. You also have the "Extending QML Functionalities using C++" chapter in Qt's documentation that should help you get started with mixing QML and C++

  • Thank You very much.

    I guess I'll have to dig into the documentation some more.

    Thanks again.

Log in to reply

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.