Shulou(Shulou.com)06/01 Report--

This article mainly explains "how to use QT to add desktops to embedded Linux". The content in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's way of thinking to study and learn how to use QT to add desktops to embedded Linux.

1. Create a QML application

In Qt Creator, click:-> File-> New File or Project- > Applications-> Qt Quick Application

Then click next all the way to finish.

two。 Parse configuration file

All applications installed in the Linux system will have a configuration file in the / usr/share/applications directory to explain how to start the application, as shown below:

# ls-1x / usr/share/applications/apport-gtk.desktopapturl.desktoparduino.desktopaudacity.desktopbcompare.desktop...

Take bcompare.desktop as an example:

[Desktop Entry] Name=Beyond CompareExec=bcompareIcon=bcompare...

Field meaning:

The Name field is the name of the application

The Exec field is the startup command for the application

The Icon field is the applied icon name

Parse the profile:

/ / File: main.cppQVariantList apps () {QVariantList ret; QDirIterator it (DESKTOP_FILE_SYSTEM_DIR,...); while (it.hasNext ()) {const auto filename = it.next (); QSettings desktopFile (filename, QSettings::IniFormat); / / navigate to [Desktop Entry] desktopFile.beginGroup (DESKTOP_ENTRY_STRING); / / extract app information AppInfo app App.exec = desktopFile.value ("Exec"). ToString (). Remove ("\") .remove (QRegExp ("%."); app.icon = desktopFile.value ("Icon"). ToString (); app.name = desktopFile.value ("Name"). ToString (); / save app information ret.append (QStringList {app.name, app.icon, app.exec});} return ret } int main (int argc, char * argv []) {[...] / / pass the parsed app information to the QML front end engine.rootContext ()-> setContextProperty ("apps", apps ()); [...]}

The core is to traverse all the files in a directory, and QSettings is responsible for parsing the configuration files.

Running effect:

/ / print out all the app startup information exec: "xpad" icon: "xpad" name: "Xpad" [...] 3. Achieve the overall layout

We can use the Repeater control. Repeater can help us generate duplicate content, here we specify a maximum of 24 app per page.

Implement the layout through SwipeView + Repeater:

/ / File: main.qmlSwipeView {[...] Property int selectedIndex: 0 Repeater {id: pageRepeater model: appPages.length Item {property var page: appPages [index] Grid {columns: 6 Repeater {model: page.length Image { Source: "qrc:/images/qtlogo.png"}}

The first Repeater is used to generate all the pages

The second Repeater is used to generate icons for all the APP on the page. Here we first use the logo of Qt instead of the real APP icon.

Running effect:

Sliding left and right is already supported at this time, but the APP information has not been filled in yet.

4. Support for displaying application icons

In main (), we set a property called apps, which contains all the information about APP:

Engine.rootContext ()-> setContextProperty ("apps", apps ())

We need to replace Qt logo with the icon of APP in the front interface.

Display the APP icon:

/ / File: main.qmlGrid {[...] Repeater {model: page! = = undefined? Page.length: 0 Column {Image {property var app: page [index] / / APP icon source: "image://icons/" + app [1] [...]} Label {property var app: page [index] id: label / / name of APP text: app [0] [...]}

There are very few changes.

Running effect:

Only icons are supported at this time, but mouse selection is still not supported.

5. Support for selected applications

The selected application needs to add handling of mouse hover events. When the mouse moves over an icon, Qt captures the mouse hover event and passes it to the control where the current focus is located. We extract the interface code from APP, put it separately in AppEntry.qml, make it a separate control, and then add the handling of mouse hover events to it.

Icon controls: AppEntry.qml

/ / File: AppEntry.qmlPane {id: root property var app [...] / / when the mouse moves over the icon, send a signal hovered () signal hovered () MouseArea {[...] OnHoveredChanged: {if (hovered) {root.hovered ()}} Column {anchors.fill: parent Image {source: "image://icons/" + app [1] [...]} Label {[...]}}

When you receive a hovered signal from an AppEntry control in main.qml, you need to change its background color to remind the user that the icon is selected.

/ / File: main.qmlRepeater {model: page.length AppEntry {app: page [index] [...] / / selected changes the background color selected: swipeView.selectedIndex = = index onHovered: {swipeView.select (index)} [...]}}

Running effect:

This is already able to display the selected status, but still cannot start the application.

6. Support to launch the application

In Qt, you can use QProcess to create processes. Here we create a subclass of QProcess to run APP.

Subclasses of QProcess:

/ / File: process.cppvoid Process::start (const QString & program, const QVariantList & arguments) {[...] QProcess::startDetached (program);} / / File: process.hclass Process: public QProcess {Q_OBJECTpublic: Process (QObject * parent = nullptr); Q_INVOKABLE void start (const QString & program, const QVariantList & arguments = {});}; / / File: main.cppint main (int argc, char * argv []) {/ / pass an instance of Process to the front end engine.rootContext ()-> setContextProperty ("proc", new Process (& engine));}

The front end handles click events:

/ / File: AppEntry.qmlsignal clicked () MouseArea {[...] OnClicked: {root.clicked ()}}

When the user clicks the icon, the AppEntry control emits a clicked () signal.

/ / File: main.qmlAppEntry {app: page [index] [...] / main window launch APP onClicked: {exec (app [2])} [...]} function exec (program) {console.debug ("Exec:" + program) proc.start (program) Qt.quit ();}

Finally, call Process::start () to start APP.

Running effect:

Thank you for your reading, the above is the content of "how to use QT to add desktops to embedded Linux". After the study of this article, I believe you have a deeper understanding of how to use QT to add desktops to embedded Linux. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.