Qt（發(fā)音為“ cute”，而不是“ cu-tee”）是一個跨平臺框架，通常用作圖形工具包，它不僅創(chuàng)建CLI應(yīng)用程序中也非常有用。而且它也可以在三種主要的臺式機操作系統(tǒng)以及移動操作系統(tǒng)（如Symbian，Nokia Belle，Meego Harmattan，MeeGo或BB10）以及嵌入式設(shè)備，Android（Necessitas）和iOS的端口上運行。現(xiàn)在我們?yōu)槟闾峁┝嗣赓M的試用版。趕快點擊下載Qt最新試用版吧>>

點擊獲取更多文章教程

桌面系統(tǒng)用戶界面示例

本示例以一種簡單的方式展示了應(yīng)用程序管理器API，它是具有服務(wù)器端窗口裝飾的經(jīng)典桌面。該示例更多地關(guān)注概念，而不關(guān)注優(yōu)雅或完整性。例如，沒有錯誤檢查完成。此最小桌面系統(tǒng)中的某些功能僅打印調(diào)試消息。

支持以下功能：

• 通過單擊左上方的圖標(biāo)來啟動應(yīng)用程序
• 通過再次單擊左上方的圖標(biāo)來停止應(yīng)用程序
• 通過單擊左上方的窗口裝飾矩形關(guān)閉應(yīng)用程序窗口
• 通過單擊裝飾使應(yīng)用程序前進
• 通過按下窗戶裝飾并移動窗戶來拖動窗戶
• 應(yīng)用啟動時，系統(tǒng)用戶界面發(fā)送“ propA”更改
• 系統(tǒng)界面和App2會通過調(diào)試消息對窗口屬性更改做出反應(yīng)
• 單擊停止或重新啟動App1動畫
• App1在停止時將旋轉(zhuǎn)角度作為窗口屬性發(fā)送到系統(tǒng)UI
• App1暫停時在系統(tǒng)UI上顯示一個彈出窗口
• App2啟動時會使用IPC擴展
• App2記錄啟動它的文檔URL
• 單擊燈泡圖標(biāo)時，App2在系統(tǒng)用戶界面中觸發(fā)通知
• 顯示源自外部流程的Wayland客戶端窗口 appman

注意：此示例可以在單進程或多進程模式下運行。在下面的演練中，我們使用多進程及其相應(yīng)的術(shù)語。術(shù)語客戶和應(yīng)用 ; 服務(wù)器和系統(tǒng)UI可以互換使用。系統(tǒng)UI包括合成和通用的進程間通信（IPC）。

要開始示例，請導(dǎo)航到該minidesk文件夾，然后運行以下命令：

 -c am-config.yaml

該appman二進制文件（可執(zhí)行文件），通常位于Qt的安裝bin文件夾中。

系統(tǒng)界面窗口

import QtQuick 2.11
import QtQuick.Window 2.11
import QtApplicationManager.SystemUI 2.0

Window {
    title: "Minidesk - QtApplicationManager Example"
    width: 1024
    height: 640
    color: "whitesmoke"

    Readme {}

    Text {
        anchors.bottom: parent.bottom
        text: (ApplicationManager.singleProcess ? "Single" : "Multi") + "-Process Mode"
    }
    ...

該QtApplicationManager.SystemUI模塊需要導(dǎo)入來訪問應(yīng)用程序管理器的API。系統(tǒng)UI窗口具有固定的大小和“ whitesmoke”背景色。除了Window之外，root元素還可以是常規(guī)項目，例如Rectangle。應(yīng)用程序管理器會為您將其包裝在一個窗口中。在背景頂部，我們顯示一個Readme元素，其中包含有關(guān)可用功能的信息。左下角有一個文本指示，指示應(yīng)用程序管理器是在單進程模式還是多進程模式下運行。

    // Application launcher panel
    Column {
        Repeater {
            model: ApplicationManager

            Image {
                source: icon
                opacity: isRunning ? 0.3 : 1.0

                MouseArea {
                    anchors.fill: parent
                    onClicked: isRunning ? application.stop() : application.start("documentUrl");
                }
            }
        }
    }

中繼器提供了設(shè)置在一個應(yīng)用程序圖標(biāo)列在系統(tǒng)UI的左上角; 所述ApplicationManager元件是模型。其中，ApplicationManager提供了icon用作圖像源URL 的角色。該iconURL是在應(yīng)用程序的定義info.yaml文件。為了指示應(yīng)用程序已啟動，通過將其綁定到isRunning角色來減少相應(yīng)應(yīng)用程序圖標(biāo)的不透明度。

單擊應(yīng)用程序圖標(biāo)可通過調(diào)用ApplicationObject.start（）啟動相應(yīng)的應(yīng)用程序。可通過ApplicationManager模型中的application角色訪問此功能。這兩個應(yīng)用程序均以（可選）文檔URL開頭（documentUrl）。如果應(yīng)用程序已經(jīng)在運行，則調(diào)用ApplicationObject.stop（）。

Windows系統(tǒng)界面中的應(yīng)用程序

// System UI chrome for applications
    Repeater {
        model: ListModel { id: topLevelWindowsModel }

        delegate: Image {
            source: "chrome-bg.png"
            z: model.index

            Text {
                anchors.horizontalCenter: parent.horizontalCenter
                text: "Decoration: " + (model.window.application ? model.window.application.name("en")
                                                                 : 'External Application')
            }

            MouseArea {
                anchors.fill: parent
                drag.target: parent
                onPressed: topLevelWindowsModel.move(model.index, topLevelWindowsModel.count - 1, 1);
            }

            Rectangle {
                width: 25; height: 25
                color: "chocolate"

                MouseArea {
                    anchors.fill: parent
                    onClicked: model.window.close();
                }
            }

            WindowItem {
                anchors.fill: parent
                anchors.margins: 3
                anchors.topMargin: 25
                window: model.window

                Connections {
                    target: window
                    function onContentStateChanged() {
                        if (window.contentState === WindowObject.NoSurface)
                            topLevelWindowsModel.remove(model.index, 1);
                    }
                }
            }

            Component.onCompleted: {
                x = 300 + model.index * 50;
                y =  10 + model.index * 30;
            }
        }
    }

該模型是一個普通的ListModel ，它由WindowManager創(chuàng)建的窗口對象所提供。下面顯示了填充此ListModel的窗口角色的代碼。現(xiàn)在，讓我們集中討論此Repeater的代表包括什么：

• 大部分是透明的背景圖片。該位置取決于model.index，因此每個應(yīng)用程序窗口都有一個不同的初始位置。
• 創(chuàng)建該窗口的應(yīng)用程序的名稱，其前綴為“ Decoration”。此名稱來自在應(yīng)用程序的info.yaml文件中定義的相關(guān)ApplicationObject。
• 一個用于拖動和抬起窗口的MouseArea。該鼠標(biāo)區(qū)域填滿整個窗口。包含應(yīng)用程序窗口的WindowItem放置在其頂部，因此將無法處理拖動。
• 左上角的一個小的巧克力色矩形，用于關(guān)閉窗口（請參見WindowObject.close（））。由于我們的示例應(yīng)用程序只有一個頂級窗口，因此關(guān)閉它會導(dǎo)致相應(yīng)的應(yīng)用程序退出。
• 核心：一個WindowItem，用于WindowObject在系統(tǒng)用戶界面中呈現(xiàn)；類似于圖像文件和QML的圖像組件之間的關(guān)系。
• 最后，一旦從應(yīng)用程序（客戶端）端銷毀了窗口的窗口，則將代碼從ListModel中刪除，這是因為它已關(guān)閉，變?yōu)椴豢梢姞顟B(tài)，或者應(yīng)用程序本身退出或崩潰了。這些情況中的任何一種都會導(dǎo)致WindowObject失去其表面。如Animated Windows System UI Example中所示，更復(fù)雜的System UI可以使窗口消失動畫。
  

未完待續(xù).......下一篇文章我們將發(fā)布完整版代碼！

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