qml 基本元素运用示例

他可以创建很多相似的组件，QML中还有几个例子

Row { Repeater { model: 3 Rectangle {

width: 100; height: 40 border.width: 1 color: \ } } }

68 SystemPalette

具体看效果和文档

Rectangle {

SystemPalette { id: myPalette; colorGroup: SystemPalette.Active } width: 640; height: 480 color: myPalette.window Text {

anchors.fill: parent

text: \; color: myPalette.windowText } }

69. FontLoader

载入一种字体，可以是网络上的，也可以是本地的

Column {

FontLoader { id: fixedFont; name: \ }

FontLoader { id: webFont; source: \ } Text { text: \ font\; font.family: fixedFont.name } Text { text: \ font\; font.family: webFont.name } }

70 LayoutItem 不清楚 71 Scale

对缩放的控制

Rectangle {

width: 100; height: 100 color: \ Rectangle{ x: 50; y: 50;

width: 20; height: 20;

color: \

// 这里是在当前矩形的中间位置沿x轴进行3倍缩放 transform: Scale { origin.x: 10; origin.y: 10; xScale: 3} } }

72 Rotation

Rectangle {

width: 100; height: 100 color: \

// 绕位置25,25 旋转45度

transform: Rotation { origin.x: 25; origin.y: 25; angle: 45} }

73 Translate

Row { Rectangle {

width: 100; height: 100 color: \

// 沿y轴正方向移动20个像素

transform: Translate { y: 20 } }

Rectangle {

width: 100; height: 100 color: \

// 沿y轴负方向移动20个像素 transform: Translate { y: -20 } } }