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.0Rectangle {
id: rootRect
width: Screen.width/2
height: Screen.height/2
color: "gray"Button{} Rectangle{ 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 } Rectangle{ id: inputField width: textField.width height: textField.height border.color: "green" border.width: 3 color: "white" x: 140; y: 61 } TextEdit{ id: input color: "red" font.pixelSize: 30 anchors.centerIn: inputField text: "Some Text" }
}@
@import QtQuick 2.0
import QtQuick.Window 2.0Item {
property string defaultText: "New Text" Rectangle{ id: button width: rootRect.width/6 height: rootRect.height/8 color: "black" x: 200; y: 200 radius: 10 } MouseArea{ 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.
-
Hi and welcome to devnet,
Is your project based on the Qt Quick application template ?
-
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. https://www.youtube.com/watch?v=QvQAu8n8FRI&index=9&list=PLB22HyVdO1GkLFrvRi5vIo5XcWS0EflxD
-
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++