重點內容
qml裡面布局主要有兩種，錨點布局、grid布局。
錨點布局使用anchors附件屬性將乙個元素的邊定位到另乙個元素的邊，從而確定元素的位置和大小。下面是示例
複製**
1 import qtquick 2.3
2 import qtquick.window 2.0
3 4 window
17 }
18 19 rectangle
27 }
28 29 rectangle
37 }
38 39 rectangle
46 }
47 48 rectangle
56 }
57 58 }
複製**
效果如下圖
grid布局有gridlayout、columnlayout、rowlayout、column、row，其中columnlayout、rowlayout只是gridlayout的一種特例，columnlayout表示只有一列，rowlayout表示只有一行。
gridlayout使用columns、rows屬性將空間分成若干單元格，使用columnspacing、rowspacing確立單元格之間的間隔。而gridlayout內部元素的大小由layout.fillwidth、layout.fillheight以及layout.preferredwidth、layout.preferredheight來確定，如layout.fillwidth:true表示寬度填充整個單元格，layout.preferredwidth則指定乙個建議寬度。layout.row、layout.column確定內部元素處於哪個單元格。注意，不要將內部元素的寬度、高度、x、y與gridlayout進行繫結，容易導致繫結迴圈。
column、row類似於html中的float或是wpf中的stackpanel，會直接將元素乙個個挨在一起，元素間的間隔使用spacing控制
下面是gridlayout布局的乙個示例
複製**
1 import qtquick 2.3
2 import qtquick.window 2.0
3 import qtquick.layouts 1.1
4 5 window
25 26 rectangle
32 33 rectangle
41 42 }
43 }
複製**
效果如下所圖
splitview用於提供帶切分條的布局，下面是示例
複製**
import qtquick 2.3
import qtquick.window 2.0
import qtquick.layouts 1.1
import qtquick.controls 1.2
window
rectangle
rectangle
}複製**
下面是效果圖，注意實際情況可以拖拉切分條
ok，有了以上幾種布局方式，通過一定的組合相信可以應對大部分布局需求了
Qt Quick快速入門01
1.qt quick基本程式結構 下面先來看一段程式 import qtquick 2.2 import qtquick.window 2.1 window text 從上面這段程式可以看出，乙個qml文件由兩個部分組成 1 import語句 import語句在這裡就相當於c 中的include語句...
QtQuick系列教程 6 Qml與C 互動
總目錄傳送 本博文技術等級 qml 作為一種靈活高效的介面開發語言已經越來越得到業界的認可。qml 負責介面，c 負責邏輯，這也是 qt 官方推薦的開發方式。那麼 qml 與 c 的互動必然是需要我們掌握並且精通的。本 chat 將詳細介紹 qml 與 c 的幾種互動方式，以及在專案中的實際應用方法...
在Qt quick專案中組合不同的qml檔案
使用qml定義gui,我們可以將整個gui拆分成不同的部分。乙個main.qml檔案表示整個布局，其他qml檔案定義部分的gui。我建立了乙個assemble工程，main.qml檔案如下 import qtquick 2.1import qtquick.window 2.1import qtqui...