概述
一個優秀的應用程序不僅要有實用的功能,還要有一個漂亮美膩的外觀,這樣才能使應用程序更加友善、操作性良好,更加符合人體工程學。作為一個跨平臺的UI開發框架,Qt提供了強大而且靈活的界面外觀設計機制,能夠幫助開發人員構建現代化、直觀性強、功能強大的用戶界面。
Qt UI設計的特點包括:
- 統一的外觀:Qt提供了統一的圖標、字體和顏色風格,使得應用程序在不同平臺上具有相同的外觀。
- 靈活的布局:Qt支持各種布局方式,包括基于網格的布局、垂直和水平框架、堆疊布局等,使得應用程序具有靈活性和可擴展性。
- 多樣化的控件:Qt提供了各種控件,包括按鈕、文本框、滑塊、菜單、對話框等,開發人員可以根據需求選擇最適合的控件。
- 群組化控件:Qt提供了群組化控件,如復選框和單選框等,方便用戶進行選擇操作。
- 功能強大的繪圖:Qt提供了強大的繪圖能力,使得開發人員可以輕松地創建各種圖形界面元素。
QStyle類和QStyleFactory類
QStyle類是一個抽象基類,封裝了GUI的外觀。Qt中的各種風格都繼承自QStyle類。
Qt包含了一組QStyle子類來模擬Qt支持的不同平臺的風格(QWindowsStyle, QMacStyle等)。默認情況下,這些樣式內置于Qt GUI模塊中。樣式也可以作為插件提供。
Qt的內置小部件使用QStyle來執行幾乎所有的繪圖,確保它們看起來完全像等效的本地小部件。
如下圖顯示了9種不同樣式的QComboBox:
QStyleFactory類可以創建QStyle對象。
QStyleFactory使用create()函數和標識樣式的鍵創建一個QStyle對象。這些樣式要么是內置的,要么是從樣式插件動態加載的。
可以使用keys()函數獲取可用的風格。它們通常包括"windows" 和 “fusion”。而有些風格,如“windowsxp”、“windowsvista”及“macintosh”只有在特定平臺上才有效。注意鍵是不區分大小寫的。
使用QtCreator預覽樣式
在使用Qt Creator設計師設計界面時,可以使用Qt提供的風格預覽功能進行預覽。
預覽效果如下:
Windows
風格
Vista
風格
也可以在運行程序時,調用QApplication
的setStyle()
函數來指定要使用的風格:
QApplication a(argc, argv);a.setStyle(QStyleFactory::create("fusion"));
顯示如下:
或者使用命令行調用:
./myapplication -style windows
如果沒有指定樣式,Qt將根據用戶的平臺或桌面環境選擇最合適的樣式。
還可以使用QWidget::setStyle()
函數在單個小部件上設置樣式。
出去Qt提供的這些風格外,如果想實現自定義風格,一般做法是子類發Qt的風格類。如子類化QProxyStyle
類。
class NorwegianWoodStyle : public QProxyStyle{Q_OBJECTpublic:NorwegianWoodStyle();void polish(QPalette &palette) override;void polish(QWidget *widget) override;void unpolish(QWidget *widget) override;int pixelMetric(PixelMetric metric, const QStyleOption *option,const QWidget *widget) const override;int styleHint(StyleHint hint, const QStyleOption *option,const QWidget *widget, QStyleHintReturn *returnData) const override;void drawPrimitive(PrimitiveElement element, const QStyleOption *option,QPainter *painter, const QWidget *widget) const override;void drawControl(ControlElement control, const QStyleOption *option,QPainter *painter, const QWidget *widget) const override;private:static void setTexture(QPalette &palette, QPalette::ColorRole role,const QPixmap &pixmap);static QPainterPath roundRectPath(const QRect &rect);};
QPalette使用
QPalette類包含每個小部件狀態的顏色組。
調色板由三個顏色組組成:Active、Disabled和Inactive。Qt中的所有小部件都包含一個調色板,并使用它們的調色板來繪制自己。這使得用戶界面易于配置,并且更容易保持一致性。
如果想要創建一個新的小部件,Qt強烈建議使用調色板中的顏色,而不是硬編碼特定的顏色。
顏色組:
- The Active group 用于具有鍵盤焦點的窗口。
- The Inactive group用于其他窗口。
- The Disabled組用于由于某種原因禁用的小部件(而不是窗口)。
活動和非活動窗口都可以包含禁用的小部件。(禁用的小部件通常被稱為不可訪問或顯示為灰色。)
在大多數樣式中,Active和Inactive看起來是一樣的。
可以使用setColor()和setBrush()為調色板的任何顏色組中的特定角色設置顏色和畫筆。顏色組包含一組小部件用于繪制自身的顏色。
要修改顏色組,可以調用setColor()和setBrush()函數,這取決于想要純顏色還是像素圖圖案。
也有相應的color()和brush(),以及一個常用的方便函數來獲取當前ColorGroup的ColorRole: window(), windowText(), base()等。
可以使用復制構造函數復制一個調色板,并使用isCopyOf()測試兩個調色板是否相同。
QPalette通過使用隱式共享進行了優化,因此將QPalette對象作為參數傳遞是非常有效的。
警告:有些樣式不會對所有繪圖使用調色板,例如,如果它們使用本機主題引擎。這對于Windows XP、Windows Vista和macOS樣式都是如此。
QPalette palette;// 設置背景色和前景色palette.setColor(QPalette::Button, QColor(Qt::red));palette.setColor(QPalette::ButtonText, QColor(Qt::red));
QPalette類主要的顏色角色介紹:
枚舉 | 值 | 描述 |
---|---|---|
QPalette::Window | 10 | 一般的背景色。 |
QPalette::Background | Window | 這個值已經過時了。使用Window代替。 |
QPalette::WindowText | 0 | 一般的前景色。 |
QPalette::Foreground | WindowText | 這個值已經過時了。使用WindowText代替。 |
QPalette::Base | 9 | 主要用作文本輸入小部件的背景色,但也可以用于其他繪畫-例如組合框下拉列表和工具欄手柄的背景。它通常是白色或其他淺色的。 |
QPalette::AlternateBase | 16 | 在行顏色交替的視圖中用作備用背景色(參見QAbstractItemView::setAlternatingRowColors())。 |
QPalette::ToolTipBase | 18 | 用作QToolTip和QWhatsThis的背景色。工具提示使用QPalette的Inactive顏色組,因為工具提示不是活動窗口。 |
QPalette::ToolTipText | 19 | 用作QToolTip和QWhatsThis的前景色。工具提示使用QPalette的Inactive顏色組,因為工具提示不是活動窗口。 |
QPalette::Text | 6 | 與基礎一起使用的前景色。這通常與WindowText相同,在這種情況下,它必須提供與Window和Base的良好對比。 |
QPalette::Button | 1 | 一般按鈕的背景顏色。這個背景可以不同于Window,因為有些樣式需要不同的按鈕背景顏色。 |
QPalette::ButtonText | 8 | 與按鈕顏色一起使用的前景色。 |
QPalette::BrightText | 7 | 一種與WindowText非常不同的文本顏色,并與深色形成鮮明對比。通常用于需要繪制text或WindowText對比度較差的文本,例如按下的按鈕。請注意,文本顏色可以用于文字以外的東西;文本顏色通常用于文本,但對線條、圖標等使用文本顏色角色也很常見。 |
結論
如果一個人秒回了你,說明這個人在玩手機
。