Qt設計師(Qt Designer)是使用Qt部件(Widgets)設計和使用圖形用戶界面(GUI)的工具。它允許我們以所見即所得的方式構建和定制自己的窗口(Windows)或對話框(Dialogs)並提供了不同的方法來測試它們。
使用Qt的信號-槽機制,可以無縫地將Qt設計師創建的部件或窗體與手工編寫的代碼整合在一起,這使得我們可以輕松地為圖形元素定義行為。Qt設計師設置的所有屬性均可以在代碼中動態地修改。Furthermore, features like widget promotion and custom plugins allow you to use your own components with Qt Designer.
注意:除了部件(widgets),你還可以選擇使用Qt Quick來設計用戶界面,它是編寫許多應用的快捷途徑。由於它是基於OpenGL 圖形加速技術,它充分支持了可定制外觀,觸摸反應元件,平滑地動畫過渡。
初識Qt設計師
打開Qt設計師
安裝完Qt后,可以像打開其他程序一樣打開Qt設計師,也可以從Qt Creator中打開Qt設計師。Qt Creator自動將所有的.ui文件放在它集成的Qt設計師中以設計模式打開。一般意義下,集成的Qt設計師包含全部獨立Qt設計師的功能,關於它們之間的差異,請參考Qt手冊。
如果窗體太大不適合在Qt Creator中以設計模式打開,可以使用獨立Qt設計師打開。
用戶界面
獨立Qt設計師界面可以被設置為多窗口界面或docked window mode,集成Qt設計師只有多窗口界面可供使用
在多窗口模式下,可以調節各個工具窗口以適應你的工作風格,主窗口包含了菜單欄、工具欄以及一個包含了所有可用的部件的部件盒子
(懶得翻譯,都是廢話)
Qt Designer's Main Window
The menu bar provides all the standard actions for managing forms, using the clipboard, and accessing application-specific help. The current editing mode, the tool windows, and the forms in use can also be accessed via the menu bar.
The tool bar displays common actions that are used when editing a form. These are also available via the main menu.
The widget box provides common widgets and layouts that are used to design components. These are grouped into categories that reflect their uses or features.
Qt Designer's Widget Box
The widget box provides a selection of standard Qt widgets, layouts, and other objects that can be used to create user interfaces on forms. Each of the categories in the widget box contain widgets with similar uses or related features.
You can display all of the available objects in a category by clicking on the handle next to the category label. When in Widget Editing Mode, you can add objects to a form by dragging the appropriate items from the widget box onto the form, and dropping them in the required locations.
Qt Designer provides a scratch pad feature that allows you to collect frequently used objects in a separate category. The scratch pad category can be filled with any widget currently displayed in a form by dragging them from the form and dropping them onto the widget box. These widgets can be used in the same way as any other widgets, but they can also contain child widgets. Open a context menu over a widget to change its name or remove it from the scratch pad.
通過菜單欄、工具欄以及部件盒子可以使用Qt設計師的大部分功能,少部分功能需要通過上下文菜單才能使用,在大多數平台上,點擊鼠標右鍵可以打開上下文菜單。
Qt中布局(layout)的概念
布局是用來安排和管理用戶界面中的元素。Qt提供了一組類來自動掌控界面布局--QHBoxLayout, QVBoxLayout, QGridLayout, and QFormLayout。這些類解決了自動完成部件布局的難題,使得用戶界面具有可預見性。幸運地是,不需要對這些類有很詳細的了解,直接使用即可。
每個Qt部件有推薦的大小,可通過sizeHint()得到,這些布局管理者會嘗試將這些部件設置為推薦大小。某些情形下,沒有必要使用其他的大小。例如,根據字體的類型和大小,QLineEdit 的高度就是固定值。還有一些情形下,需要對部件的大小進行調整,而每個部件的大小都有最大值和最小值--minimumSize 和 maximumSize。
下圖展示了柵格中各個部件的位置(3x3),
上圖中 QPushButton對象是嵌套的。
下面的例子展示了Qt layout根據需要自動調節部件大小的能力
Qt設計師Tab順序編輯模式
Qt允許用戶使用Tab鍵或Shift+Tab快捷鍵在不同的輸入部件之間切換,部件默認的Tab順序就是部件被構造的先后順序,當然也可以自己編輯Tab順序,使得應用程序更方便使用。
進入Tab順序編輯模式后,通過點擊輸入控件上顯示的序號,可以更改Tab順序,直至滿意為止。
Qt設計師Buddy編輯模式
Qt一個非常有用的特性是允許Buddy部件,即將一個QLabel部件與一個輸入部件設為buddy關系,這樣用戶通過按下QLabel部件的快捷鍵就可以將輸入光標設置在與它有buddy關系的輸入部件。
Qt設計師中布局(layout)部件的使用
將多個對象放置在布局部件中,當窗體大小改變后,布局部件會自動調節它內部的對象大小。另外,不能單獨調整布局部件內部對象的位置和大小,可以向布局部件中添加或刪除空格(spacers)來調整其中部件的位置。
設置頂層級別的部件部件
頂層級別的部件部件可以保證窗體中部件的大小隨着窗體大小的改變而改變。
水平布局和垂直布局
簡單設置各個部件之間的水平關系和垂直關系
柵格(grid)布局
(待補充)
Form布局
將部件放在兩列中,左邊一列放置QLabel對象,右邊一列放置輸入控件
Splitter布局
Splitter布局和其他布局部件一樣,不同的是Splitter布局運行用戶調整其中的空格大小,已調整部件的位置
Qt設計師中容器(container)的使用