于 Qt Widgets 于,我们经常使用许多布局管理器来管理界面 widgets 。

于 Qt Quick 实际上,有两个相关的管理和布局库,所谓集 Item Positioner ,所谓集 Item Layout 。 Item Layout 包含 RowLayout 、 ColumnLayout 、 GridLayout。与 Qt Widgets 中的布局管理器更相近,只是这里不打算介绍它们。本文的重点是 Item Positioner 。 Qt Quick 提供这么几种常常使用的 Positioners :

  • anchors ,锚布局
  • Row ,行布局
  • Column ,列布局
  • Grid ,表格布局
  • Flow ,流式布局

咱们一个一个来看。

请给我的决赛文章《Qt Quick 图像处理实例之美图秀秀(附源代码下载)》投票,谢谢。

版权全部 foruok 。转载请注明出处:http://blog.csdn.net/foruok 。

anchors(锚)布局

在《Qt on Android: Qt Quick 简单教程》一文中我们已经介绍过锚布局了。为了自成篇幅,这里再反复一下。只是演示样例会更新哦。

anchors 提供了一种方式,让你能够通过指定一个元素与其他元素的关系来确定元素在界面中的位置。

你能够想象一下,每一个 item 都有 7 条不可见的锚线:左(left)、水平中心(horizontalCenter)、上(top)、下(bottom)、右(right)、垂直中心(verticalCenter)、基线(baseline)。

看图 1 就明确了:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9ydW9r/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />

图 1 锚线

在图 1 中。没有标注基线。基线是用于定位文本的,你能够想象一行文字端坐基线的情景。对于没有文本的图元。baseline 和 top 一致。

使用 anchors 布局时,除了对齐锚线,还能够在指定上(topMargin)、下(bottomMargin)、左(leftMargin)、右(rightMargin)四个边的留白。看图 2 就明确了:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9ydW9r/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />

图 2 留白

除了图 1 和图 2 介绍的属性。 anchors 另一些属性。 centerIn 表示将一个 item 居中放置到另一个 item 内, fill 表示充满某个 item ……很多其他请參考 Item 类的文档。

好了。基础知识介绍完毕,看一个大而全的样例。文件名称是 anchors_layout.qml 。内容例如以下:

import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} //color pickers look at parent's top
ColorPicker {
id: topColor1;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.top: parent.top;
anchors.topMargin: 4;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: topColor2;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.left: topColor1.right;
anchors.leftMargin: 4;
anchors.top: topColor1.top;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: topColor3;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.right: parent.right;
anchors.rightMargin: 4;
anchors.top: parent.top;
anchors.topMargin: 4;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: topColor4;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.right: topColor3.left;
anchors.rightMargin: 4;
anchors.top: topColor3.top;
onColorPicked: setTextColor(clr);
} //color pickers sit on parent's bottom
ColorPicker {
id: bottomColor1;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: bottomColor2;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.left: bottomColor1.right;
anchors.leftMargin: 4;
anchors.bottom: bottomColor1.bottom;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: bottomColor3;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.right: parent.right;
anchors.rightMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
onColorPicked: setTextColor(clr);
} ColorPicker {
id: bottomColor4;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.right: bottomColor3.left;
anchors.rightMargin: 4;
anchors.bottom: bottomColor3.bottom;
onColorPicked: setTextColor(clr);
} //align to parent's left && vertical center
ColorPicker {
id: leftVCenterColor;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.verticalCenter: parent.verticalCenter;
onColorPicked: setTextColor(clr);
} //align to parent's right && vertical center
ColorPicker {
id: rightVCenterColor;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.right: parent.right;
anchors.rightMargin: 4;
anchors.verticalCenter: parent.verticalCenter;
onColorPicked: setTextColor(clr);
} //align to parent's top && horizontal center
ColorPicker {
id: topHCenterColor;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.top: parent.top;
anchors.topMargin: 4;
anchors.horizontalCenter: parent.horizontalCenter;
onColorPicked: setTextColor(clr);
} //align to parent's bottom && horizontal center
ColorPicker {
id: bottomHCenterColor;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
anchors.horizontalCenter: parent.horizontalCenter;
onColorPicked: setTextColor(clr);
}
}

演示样例代码中用到的 ColorPicker 是我们在《Qt Quick 组件与对象动态创建具体解释》中自己定义的组件,假设忘了请回头看看,要确保 ColorPicker.qml 与 anchors_layout.qml 在一个目录内。 ColorPicker 定义了 colorPicked 信号,參数为 clr 。类型是 color 。我在演示样例代码中为每一个 ColorPicker 对象创建了 onColorPicked 信号处理器,调用 setTextColor() 函数改变界面中间的文本的颜色。

Qt 是 QML 提供的一个全局对象,提供了非常多实用的方法和枚举值,这里我们使用 rgba() 函数来生成颜色值。

Math 对象是 JavaScript 语言那仅仅对象,它的 random() 方法放回 0 到 1 之间的随机值。

图 3 是运行 qmlscene anchors_layout.qml 后的效果图:

图 3 锚布局演示样例效果

锚布局是最灵活的一种 Qt Quick 布局方式,使用它你能够任意摆布界面上那些可见元素。只是,假设你的界面元素非常多,它也将是代码量最大的一种布局方式。

接下来我们看看那些传统的布局方式吧。假设你使用过 Qt Widgets ,相信会非常快明确。

行布局

anchors 实际上是 Item 的一个属性集。而 Row 则是一个单独的 Item ,专门用来管理其他 Item 的。后面介绍的几种布局,也是相似的。

Row 沿着一行安置它的孩子们。在你须要水平放置一系列的 Item 时。它比锚布局更加方便。一旦你把一个 Item 交给 Row 来管理。那就不要再使用 Item 的 x 、 y 、 anchors 等属性了。 Row 会安排得妥妥的。

在一个 Row 内的 item ,能够使用 Positioner 附加属性来获知自己在 Row 中的很多其他位置信息。 Positioner 有 index 、 isFirstItem 、 isLastItem 三个属性。

看我们的演示样例 row_layout.qml :

import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Row {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
spacing: 4; ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
}
}

运行命令 qmlscene row_layout.qml ,效果如图 4 所看到的:

图 4 行布局效果图

由于 Row 本身是一个 Item ,所以你能够使用锚布局来定位一个 Row 。演示样例中这么做了,把 Row 放在界面的左下角。

Row 有一个 spacing 属性,用来指定它管理的 Item 之间的间隔。

另一个 layoutDirection 属性,能够指定布局方向,取值为 Qt.LeftToRight 时从左到右放置 Item 。这是默认行为。取值为 Qt.RightToLeft 时从右向左放置 Item 。

还有其他的一些属性,请參看 Qt SDK 。

列布局

Column 与 Row 相似,只是是在垂直方向上安排它的子 Items 。

在你须要垂直放置一系列的 Item 时,它比锚布局更加方便。

Column 本身也是一个 Item ,能够使用 anchors 布局来决定它在父 Item 中的位置。 Column 的 spacing 属性描写叙述子 Item 之间的间隔。

看演示样例 column_layout.qml :

import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Column {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
spacing: 4; ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
}
}

代码与 row_layout.qml 相似,不用解释了。图 5 是运行 qmlscene column_layout.qml 后的效果:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9ydW9r/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />

图 5 列布局效果图

与 Row 相似, Column 内的子 Item 也能够使用 Positioner 附加属性。

表格布局

Grid 在一个网格上安置它的子 Items 。它会创建一个拥有非常多单元格的网格。足够容纳它全部的子 Items 。 Grid 会从左到右、从上到下把它的子 items 一个一个塞到单元格里。

item 默认会被放在一个单元格左上角。(0,0) 位置。

你能够通过 rows 和 columns 属性设定表格的行、列数。假设你不设置,默认仅仅有四列。而行数则会依据实际的 item 数量自己主动计算。 rowSpacing 和 columnSpacing 指定行、列间距,单位是像素。

Grid 的 flow 属性描写叙述表格的流模式,能够取值 Grid.LeftToRight ,这是默认模式。从左到右一个挨一个放置 item ,一行放满再放下一行;取值为 Grid.TopToBottom 时,从上到下一个挨一个放置 item ,一列放满再放下一列。

horizontalItemAlignment 和 verticalItemAlignment 指定单元格对齐方式。默认的单元格对齐方式和 layoutDirection 以及 flow 有关。

先看个简单的样例, grid_layout.qml :

import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Grid {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
rows: 3;
columns: 3;
rowSpacing: 4;
columnSpacing: 4; ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
}
}

为了看出 flow 取值不同一时候的效果,我特意将行列数都设置为 3 ,创建了 7 个 ColorPicker 实例。图 6 是效果:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZm9ydW9r/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />

图 6 表格布局。从左到右的效果

假设设置 Grid 的 flow 属性为 Grid.TopToBottom (加一行代码 "flow: Grid.TopToBottom;"),能够看到图 7 的效果:

图 7 表格布局,从上到下的效果

调整 Grid 的其他属性会带来什么样的变化呢?请你试试吧。

流布局

Flow 事实上和 Grid 相似,不同之处是它没有显式的行、列数,它会计算自身尺寸和子 item 尺寸来依据须要折行。它的 flow 属性。默认取值 Flow.LeftToRight 。从左到右安排 item ,直到 Flow 本身的宽度被超出时折行。当 flow 取值 Flow.TopToBottom 时,从上到下安排 item ,直到 Flow 本身的高度被超出时開始在下一列上安排 item 。

spacing 属性描写叙述 item 之间的间隔。

看个演示样例, flow_layout.qml :

import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.horizontalCenter: parent.horizontalCenter;
anchors.top: parent.top;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Flow {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
width: 280;
height: 130;
spacing: 4; ColorPicker {
width: 80;
height: 20;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
width: 100;
height: 40;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
width: 80;
height: 25;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
width: 35;
height: 35;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
width: 20;
height: 80;
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
}
}

我改变了 ColorPicker 实例的大小。以便观察 Flow 布局的特点:依据自身宽高是否被 item 超出而自己主动折行。图 8 是 flow 为 LeftToRight (代码中未设置 flow 属性。默认值是 LeftToRight)时的效果:

图 8 流布局,从左到右效果

改动下代码,在 Flow 对象生命内加入 "flow: Flow.TopToBottom;" 这行代码,再次运行 qmlscene flow_layout.qml 。效果如图 9 所看到的:

图 9 流布局,从上到下效果

如你所见,效果大大不同。

事实上能够把流布局想象成英文文字排版系统。一个 item 相应一个单词,横版模式时,从左到右,一行一行安排单词的位置,当接近一行的宽度时,假设下一个单词摆上去就会超出行宽,那就把这个单词放到下一行上,继续排排排……。竖版模式也是相似的……或许你看过竖版书,非常easy理解这件事情。

常见布局介绍完了,在学习 Qt Widgets 的布局管理器时,我们知道布局能够嵌套,比方我常常拿 QVBoxLayout 和 QHBoxLayout 嵌套来完毕一些界面的布局。

那 Qt Quick 中的布局能否够嵌套呢?

嵌套布局

    Qt Quick 中布局是能够嵌套的。比方 Row 和 Column 能够相互嵌套来实现 Grid 布局的效果。

    看下 nested_layout.qml :
import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Row {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
spacing: 4; Column {
spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
} Column {
spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
} Column {
spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
}
}
}

我在一个 Row 内嵌套了 3 个 Column ,实现了 2x3 的表格布局。运行 qmlscene nested_layout.qml ,能够看到图 10 :

                图 10 Row 与 Column 嵌套
    嵌套时。比方放在 Row 内的 Column ,事实上对于 Row 来讲和其他非布局类的 item 一样,没什么差别。
    我们改动一下上面的代码,嵌套两个 Column 。让其他两个 ColorPicker 实例与 Column 处在同一层级。代码例如以下:
import QtQuick 2.0
import QtQuick.Controls 1.1 Rectangle {
width: 360;
height: 240;
color: "#EEEEEE";
id: rootItem; Text {
id: centerText;
text: "A Single Text.";
anchors.centerIn: parent;
font.pixelSize: 24;
font.bold: true;
} function setTextColor(clr){
centerText.color = clr;
} Row {
anchors.left: parent.left;
anchors.leftMargin: 4;
anchors.bottom: parent.bottom;
anchors.bottomMargin: 4;
spacing: 4; Column {
spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
} Column {
spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
} //Column {
// spacing: 4;
ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
} ColorPicker {
color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0);
onColorPicked: setTextColor(clr);
}
//}
}
}

注意代码中我仅仅是把最后一个 Column 对象声明给凝视掉了,图 11 是运行效果:

                图 11 嵌套布局
    可能你想到了。锚布局无法和其他布局嵌套……你能够试一下。
    好啦。嵌套布局就介绍到这里,感兴趣的话请自行实验其他布局之间的嵌套效果。
    版权全部 foruok 。转载请注明出处:http://blog.csdn.net/foruok 。

回想一下:

版权声明:本文foruok原创文章,博客,未经同意不得转载。

Qt Quick 布局演示的更多相关文章

  1. Qt Quick 布局介绍

    在 Qt Quick 中有两套与布局管理相关的类库,一套叫作 Item Positioner(定位器),一套叫作 Item Layout(布局). 定位器包括 Row(行定位器).Column(列定位 ...

  2. Qt Quick实现的涂鸦程序

    之前一直以为 Qt Quick 里 Canvas 才干够自绘.后来发觉不是,原来还有好几种方式都能够画图! 能够使用原始的 OpenGL(Qt Quick 使用 OpenGL 渲染).能够构造QSGN ...

  3. Qt Quick 事件处理之信号与槽

    前面两篇文章<QML 语言基础>和<Qt Quick 简单教程>中我们介绍了 QML 语言的基本的语法和 Qt Quick 的常见元素,亲们,通过这两篇文章,您应该已经能够完毕 ...

  4. Qt Quick之StackView具体解释(1)

    Qt Quick中有个StackView.我在<Qt Quick核心编程>一书中没有讲到.近期有人问起,趁机学习了一下,把它的基本使用方法记录下来. 我准备分两次来讲.第一次讲主要的使用方 ...

  5. Qt Quick 图像处理实例之美图秀秀(附源代码下载)

    在<Qt Quick 之 QML 与 C++ 混合编程具体解释>一文中我们解说了 QML 与 C++ 混合编程的方方面面的内容,这次我们通过一个图像处理应用.再来看一下 QML 与 C++ ...

  6. Qt Quick综合实例之文件查看器

    假设你基于Qt SDK 5.3.1来创建一个Qt Quick App项目,项目模板为你准备的main.qml文档的根元素是ApplicationWindow或Window.这次我们就以Applicat ...

  7. Qt Quick 之 QML 与 C++ 混合编程具体解释

    Qt Quick 技术的引入.使得你能够高速构建 UI ,具有动画.各种绚丽效果的 UI 都不在话下.但它不是万能的.也有非常多局限性,原来 Qt 的一些技术,比方低阶的网络编程如 QTcpSocke ...

  8. Qt Quick 之 PathView 具体解释

    PathView ,顾名思义,沿着特定的路径显示 Model 内的数据. Model 能够是 QML 内建的 ListModel . XmlListModel ,也能够是在 C++ 中实现的 QAbs ...

  9. Qt Quick 事件处理之信号与槽(foruok的博客)

    前面两篇文章<QML 语言基础>和<Qt Quick 简单教程>中我们介绍了 QML 语言的基本语法和 Qt Quick 的常见元素,亲们,通过这两篇文章,您应该已经可以完成简 ...

随机推荐

  1. JavaScript模式读书笔记 文章3章 文字和构造

    1.对象字面量     -1.Javascript中所创建的自己定义对象在任务时候都是可变的.能够从一个空对象開始,依据须要添加函数.对象字面量模式能够使我们在创建对象的时候向其加入函数.       ...

  2. Android SQLite 数据库 增删改查操作

    Android SQLite 数据库 增删改查操作 转载▼ 一.使用嵌入式关系型SQLite数据库存储数据 在Android平台上,集成了一个嵌入式关系型数据库--SQLite,SQLite3支持NU ...

  3. top 查看资源使用

    top:动态观察程序的变化 ? [root@linux ~]# top [-d] | top [-bnp] 参数: -d :后面可以接秒数,就是整个程序画面更新的秒数.预设是 5 秒: -b :以批次 ...

  4. 高性能 Socket 组件 HP-Socket v3.2.1-RC2 公布

    HP-Socket 是一套通用的高性能 TCP/UDP Socket 组件,包括服务端组件.client组件和 Agent 组件,广泛适用于各种不同应用场景的 TCP/UDP 通信系统,提供 C/C+ ...

  5. 【Linux探索之旅】第二部分第四课:文件操纵,鼓掌之中

    内容简介 1.第二部分第四课:文件操纵,鼓掌之中 2.第二部分第五课预告:用户和权限 文件操纵,鼓掌之中 既然上一课我们学习了Linux中的文件组织方式,那么现在就该是玩弄,啊不,是操纵它们的时候了. ...

  6. ASP.NET 运行

    ASP.NET 运行 对于ASP.NET开发,排在前五的话题离不开请求生命周期.像什么Cache.身份认证.Role管理.Routing映射,微软到底在请求过程中干了哪些隐秘的事,现在是时候揭晓了.抛 ...

  7. java编程接口(6) ------ 图标

    本文提出了自己的学习笔记,欢迎转载,但请注明出处:http://blog.csdn.net/jesson20121020 能够在JLable或者不论什么从AbstractButton继承的组件使用Ic ...

  8. 从头开始建网站(三)DNS

    前面介绍了站点搭建所须要的两大要素:域名和server,这次要说的是域名解析,也就是把域名和server进行绑定的过程. 我们在訪问网络时,网址会被发送到DNSserver,然后由DNSserver返 ...

  9. JSON.stringify 语法解释

    行为:此函数的作用主要是串行化对象. 或许有些人是过敏的字系列.我非常理解easy.是对象的类型转换成字符串类型(或者更确切的说是json类型的).就这么简单.打个例如说,你有一个类,那么你能够通过这 ...

  10. Apple Watch 1.0 开发介绍 1.2 简介 配置Xcode工程

    WatchKit app需要一个现有的iOS app.在iOS app工程中,添加一个新的WatchKit app target,它包含了WatchKit app和WatchKit extension ...