Using QML with C++
Source code here
Original article: http://www.ics.com/blog/integrating-c-qml
Recently I stumbled onto an example where the front end of a small application was written in QML and the backend was done in C++. That was the exact thing I was searching for and it provided a great example of how to get QML and C++ working together.
Lets start with the qml:
//--------------------------------------------------------------------------
// SSH key generator UI
import QtQuick 2.1
import QtQuick.Controls 1.0
import QtQuick.Layouts 1.0
import QtQuick.Dialogs 1.0
import com.ics.demo 1.0
ApplicationWindow {
title: qsTr("SSH Key Generator")
statusBar: StatusBar {
RowLayout {
Label {
id: status
}
}
}
width: 369
height: 166
ColumnLayout {
x: 10
y: 10
// Key type
RowLayout {
Label {
text: qsTr("Key type:")
}
ComboBox {
id: combobox
Layout.fillWidth: true
model: keygen.types
currentIndex: 2
}
}
// Filename
RowLayout {
Label {
text: qsTr("Filename:")
}
TextField {
id: filename
implicitWidth: 200
onTextChanged: updateStatusBar()
}
Button {
text: qsTr("&Browse...")
onClicked: filedialog.visible = true
}
}
// Passphrase
RowLayout {
Label {
text: qsTr("Pass phrase:")
}
TextField {
id: passphrase
Layout.fillWidth: true
echoMode: TextInput.Password
onTextChanged: updateStatusBar()
}
}
// Confirm Passphrase
RowLayout {
Label {
text: qsTr("Confirm pass phrase:")
}
TextField {
id: confirm
Layout.fillWidth: true
echoMode: TextInput.Password
onTextChanged: updateStatusBar()
}
}
// Buttons: Generate, Quit
RowLayout {
Button {
id: generate
text: qsTr("&Generate")
onClicked: keygen.generateKey()
}
Button {
text: qsTr("&Quit")
onClicked: Qt.quit()
}
}
}
FileDialog {
id: filedialog
title: qsTr("Select a file")
selectMultiple: false
selectFolder: false
nameFilters: [ "All files (*)" ]
selectedNameFilter: "All files (*)"
onAccepted: {
filename.text = fileUrl.toString().replace("file://", "")
}
}
KeyGenerator {
id: keygen
filename: filename.text
passphrase: passphrase.text
type: combobox.currentText
onKeyGenerated: {
if (success) {
status.text = qsTr('<font color="green">Key generation succeeded.</font>')
} else {
status.text = qsTr('<font color="red">Key generation failed</font>')
}
}
}
function updateStatusBar() {
if (passphrase.text != confirm.text) {
status.text = qsTr('<font color="red">Pass phrase does not match.</font>')
generate.enabled = false
} else if (passphrase.text.length > 0 && passphrase.text.length < 5) {
status.text = qsTr('<font color="red">Pass phrase too short.</font>')
generate.enabled = false
} else if (filename.text == "") {
status.text = qsTr('<font color="red">Enter a filename.</font>')
generate.enabled = false
} else {
status.text = ""
generate.enabled = true
}
}
Component.onCompleted: updateStatusBar()
}
//--------------------------------------------------------------------------
Here the main qml imports are:
import QtQuick 2.1
import QtQuick.Controls 1.0
import QtQuick.Layouts 1.0
import QtQuick.Dialogs 1.0
import com.ics.demo 1.0
The first four imports are QtQuick components. The last import is the module that we are importing from main.
The qml code after these is for creating the form and putting various elements in the layout. A FileDialog is created which we will use for Browse button. Next created is KeyGenerator which will be used in C++ module. Lastly a function updateStatusBar is provided which sets various messages onto Status Bar.
The header for KeyGenerator class is as below:
//---------------------------------------------------------------------
#ifndef KEYGENERATOR_H
#define KEYGENERATOR_H
#include <QObject>
#include <QString>
#include <QStringList>
// Simple QML object to generate SSH key pairs by calling ssh-keygen.
class KeyGenerator : public QObject
{
Q_OBJECT
Q_PROPERTY(QString type READ type WRITE setType NOTIFY typeChanged)
Q_PROPERTY(QStringList types READ types NOTIFY typesChanged)
Q_PROPERTY(QString filename READ filename WRITE setFilename NOTIFY filenameChanged)
Q_PROPERTY(QString passphrase READ filename WRITE setPassphrase NOTIFY passphraseChanged)
public:
KeyGenerator();
~KeyGenerator();
QString type();
void setType(const QString &t);
QStringList types();
QString filename();
void setFilename(const QString &f);
QString passphrase();
void setPassphrase(const QString &p);
public slots:
void generateKey();
signals:
void typeChanged();
void typesChanged();
void filenameChanged();
void passphraseChanged();
void keyGenerated(bool success);
private:
QString _type;
QString _filename;
QString _passphrase;
QStringList _types;
};
Comments
Post a Comment