Qt（發音為“ cute”，而不是“ cu-tee”）是一個跨平臺框架，通常用作圖形工具包，它不僅創建CLI應用程序中也非常有用。而且它也可以在三種主要的臺式機操作系統以及移動操作系統（如Symbian，Nokia Belle，Meego Harmattan，MeeGo或BB10）以及嵌入式設備，Android（Necessitas）和iOS的端口上運行。現在我們為你提供了免費的試用版。趕快點擊下載Qt最新試用版吧>>

了解如何編寫您的第一個系統UI。

介紹

這個例子展示了一個非常簡單的System UI實現，展示了Qt Application Manager的基本構建塊。

應用程序的圖標和名稱在左側。您可以單擊它們各自的圖標來啟動和停止它們。右側的列布局顯示其窗口。

應用程序在特定顏色的背景下顯示“ Hello World！”。

此示例包括四個單獨的QML應用程序：一個系統UI和三個示例應用程序：“ Hello Red”，“ Hello Green”和“ Hello Blue”。System UI也是QML應用程序，盡管它是一個特殊的應用程序。

每個應用程序都放在一個單獨的目錄中，如下所示：

• system-ui.qml
• apps
  • hello-world.blue
    • icon.png
    • info.yaml
    • main.qml
  • hello-world.red
    • icon.png
    • info.yaml
    • main.qml
  • hello-world.green
    • icon.png
    • info.yaml
    • main.qml

每個應用程序都有一個main.qml文件，一個圖標和一個info.yaml。此YAML文件包含應用程序元數據，例如應用程序名稱，其圖標文件名等。

驗證appman路徑中是否包含二進制文件。否則，appman在使用二進制文件時，必須明確指定其位置。

如果您的appman的路徑中有二進制文件，則可以按以下方式運行系統用戶界面：

examples/applicationmanager/hello-world$ appman --builtin-apps-manifest-dir ./apps system-ui.qml

該--builtin-apps-manifest-dir命令行參數告訴appman在哪里查找bult，在應用中這種情況下apps的子目錄內置應用程序是預先安裝的應用程序，無法通過ApplicationInstaller ;API 刪除。下一個參數是系統用戶界面的main.qml文件名system-ui.qml。

你可以看到下面的屏幕截圖：

有關命令行選項的更多信息，請運行appman --help。

像任何簡單的QML應用程序一樣，我們的示例代碼以一些導入開始，并在根目錄處添加一個普通Item。唯一的區別是我們的系統用戶界面還導入了QtApplicationManager.SystemUI模塊QtQuick。

import QtQuick 2.4
import QtApplicationManager.SystemUI 2.0

Item {
    width: 800
    height: 600

接下來，在根項目的左側有一個列，在其中放置可用應用程序的圖標及其名稱。

   // Show application names and icons
    Column {
        spacing: 20
        Repeater {
            model: ApplicationManager
            Column {
                Image {
                    source: model.icon
                    MouseArea {
                        anchors.fill: parent
                        onClicked: model.isRunning ? application.stop() : application.start()
                    }
                }
                Text {
                    font.pixelSize: 20
                    text: model.name
                }
            }
        }
    }

我們使用ApplicationManager單例作為模型，為每個可用的應用程序提供一行。在每一行中，我們有：

• icon具有圖標URL 值
• name具有本地化應用程序名稱的作用
• isRunning提供應用程序狀態的布爾值
• application包含其ApplicationObject值

單擊圖標可啟動其應用程序，或者如果它已經在運行，則將其停止。

接下來，我們將Column錨點放置在root的右側Item。在本專欄中，我們為當前正在運行的所有應用程序布置現有窗口：

 // Show windows
    Column {
        anchors.right: parent.right
        Repeater {
            model: WindowManager
            WindowItem {
                width: 600
                height: 200
                window: model.window
            }
        }
    }

這次，我們使用WindowManager單例作為模型。每個窗口一排，每排中包括WindowObject。

為了有一個窗口在我們的系統UI中渲染，我們必須指定其WindowObject到WindowItem，象我們上面那樣。默認情況下，調整窗口大小以匹配呈現它的WindowItem的大小。

下面我們將實現在彩色背景下的文本我們的Hello World應用程序顯示一個“ Hello World！”。

import QtQuick 2.4 QtQuick 2.4
import QtApplicationManager.Application 2.0import QtApplicationManager.Application 2.0

ApplicationManagerWindow {
    {
    color:  "blue"

    Text {
        {
        anchors.centerIn: centerIn: parent
        text:  "Hello World!"
    }}
}}

此示例與純QML應用程序之間的唯一區別是，根元素是模塊提供的ApplicationManagerWindowQtApplicationManager.Application。

該info.yaml文件包含有關應用程序的元數據。它以一些描述此文件包含Qt Application Manager應用程序元數據的樣板開始。

formatVersion: 1: 1
formatType: am-application: am-application
------

然后是應用程序ID，用于唯一標識應用程序。建議遵循反向DNS方案，但不強制執行。這是“ Hello World”示例UI中的“ Blue”應用程序。

id:      'hello-world.blue':      'hello-world.blue'

然后是圖標文件名：

icon:    'icon.png':    'icon.png'

該code字段指定應用程序的入口點。對于QML應用程序，這意味著其主要QML文件的文件名。

code:    'main.qml':    'main.qml'

該runtime字段指定應用程序使用的運行時。在此示例中，所有應用程序均以QML編寫，因此我們使用'qml'運行時。'native'例如，另一個運行時用于已編譯的可執行應用程序，其中該code條目將指向其二進制可執行文件名。

runtime: 'qml': 'qml'

最后是各種語言的應用程序的用戶可見名稱。對于此示例，我們僅提供英語：

name::
  en: 'Hello Blue': 'Hello Blue'

本篇文章中的內容你都學會了嗎？如果這篇文章沒能滿足你的需求、點擊獲取更多文章教程！現在立刻下載Qt免費試用吧！更多Qt類開發工具QtitanRibbon、QtitanChart、QtitanNavigation、QtitanDocking、QtitanDataGrid在線訂購現直降1000元，歡迎咨詢慧都獲取更多優惠>>