qml之text

在这里插入图片描述
显示字体

Text {text: "The quick brown fox"color: "#303030"font.family: "Ubuntu"font.pixelSize: 28x:200y:200}

在这里插入图片描述

    Text {width:84elide: Text.ElideMiddle     y:text1.y+text1.height+20text: "一个很长很长的句子 !!!!!!!!!!"style: Text.SunkenstyleColor: '#000000'//font.pixelSize: 28color: "#ffffff"//wrapMode: Text.WrapAtWordBoundaryOrAnywhere}

在这里插入图片描述

import QtQuick 2.12
import QtQuick.Window 2.12Window {width: 640height: 480visible: truetitle: qsTr("Image")Image {id: image1source: "../images/pinwheel.png"}Image {x:image1.x+image1.width+12width: image1.width/2source: "../images/pinwheel.png"//fillMode: Image.Stretch}Image {y:image1.y+image1.height+12width: image1.width/2source: "../images/pinwheel.png"fillMode: Image.PreserveAspectFit//clip:false}
}

在这里插入图片描述
点击图像消失出现

import QtQuick 2.12
import QtQuick.Window 2.12Window {width: 640height: 480visible: truetitle: qsTr("MouseArea")Rectangle {id: rect1x: 12; y: 12width: 76; height: 96color: "lightsteelblue"MouseArea{width: parent.widthheight: parent.heightonClicked: rect2.visible=!rect2.visible}}Rectangle {id: rect2x: 112; y: 12width: 76; height: 96border.color: "lightsteelblue"border.width: 4radius: 8}}

chapter2-8transformations
在这里插入图片描述

import QtQuick 2.12
import QtQuick.Window 2.12Window {width: 450height: 300visible: truetitle: qsTr("Transformations")MouseArea{anchors.fill: parentonClicked: {qq1.x=50;qq2.rotation=0;qq3.rotation=0;qq3.scale=1.0;}}ClickableImage{id:qq1x:50;y:68source: "../images/qq.png"onClicked: {x+=10;}}ClickableImage{id:qq2x:150;y:68source: "../images/qq.png"onClicked: {rotation+=10;}}ClickableImage{id:qq3x:250;y:68source: "../images/qq.png"onClicked: {rotation+=10;scale+=0.1;}}}

在这里插入图片描述

import QtQuick 2.12
import QtQuick.Window 2.12//DarkSquare{
//    id:root
//    width: 120;height: 240//    Column{
//        anchors.centerIn: parent
//        spacing: 40//        RedSquare{}
//        GreenSquare{width: 96}
//        BlueSquare{}
//    }
//}//BrightSquare{
//    id:root
//    width: 400;height: 120//    Row{
//        anchors.centerIn: parent
//        spacing: 10//        RedSquare{}
//        GreenSquare{width: 96}
//        BlueSquare{}
//    }
//}//BrightSquare{
//    id:root
//    width: 400;height: 160//    Grid{
//        anchors.centerIn: parent
//        spacing: 20
//        rows:2
//        columns:3
//        RedSquare{}
//        GreenSquare{}
//        BlueSquare{}
//        RedSquare{}
//        GreenSquare{}
//        BlueSquare{}
//    }
//}//BrightSquare{
//    id:root
//    width: 400;height: 160//    Flow{
//        anchors.fill: parent
//        anchors.margins: 20
//        spacing: 20
//        RedSquare{}
//        GreenSquare{}
//        BlueSquare{}
//        RedSquare{}
//        GreenSquare{}
//        BlueSquare{}
//    }
//}DarkSquare{id:rootwidth: 252;height: 252property var colorArray:["#00bde3", "#67c111", "#ea7025"]Grid{//columns默认值为4anchors.centerIn:  parentanchors.margins: 8spacing: 4//columns: 5Repeater{model:16Rectangle{id:rect//required property int indexproperty int colorIndex: Math.floor(Math.random()*3)color:root.colorArray[colorIndex]width: 56;height:56Text {anchors.centerIn: parenttext:"Cell"+/*parent.index*/rect.Positioner.indexcolor:'white'}}}}
}