函数
函数格式:
function关键字 函数名(参数名1:参数类型,参数名2:参数类型,...):返回值类型{}
其中:
- 函数名必须以小写字符开头,后面驼峰
- 可以有多个参数或者没有参数
- 参数类型可以不写
- 返回值类型也可以不写
如何调用:通过id点出来
举例:
Rectangle {id: rect//显示指定参数类型和返回值类型function getWidth(num1: int, num2: int): int {return num1 + num2;}//不显示指定function getHeight(num1, num2) {return num1 * num2;}//调用width: rect.getWidth(10, 20)height: rect.getHeight(1, 20)
}
信号
信号格式:
signal关键字 信号名(参数名1:参数类型,参数名2:参数类型...)
其中:
- 信号名仍然要首字母小写,后面驼峰
- 参数可以有多个或没有
- 若有参数则参数类型必须要写
- 同一个作用域内信号名要唯一,不能多个信号重名
举例:
Rectangle {id: rect2width: 100height: 50color: "red"//声明1个信号signal testSignal(num: int)
}
自动绑定信号的槽函数
定义一个信号号,同时可以定义一个自动绑定信号的槽函数
即自己发出信号,自己接收信号然后处理
格式为:
on信号名(参数列表){}
其中:
- 信号名的首字母要变成大写
- 参数的个数可以少于信号的个数,也可以多于信号的参数
- 参数不能加参数类型,只需要参数名
举例:
Rectangle {id: rect2width: 100height: 50color: "red"//声明1个信号signal testSignal(num: int)//on+信号名首字母大写//信号处理函数中打印这个参数onTestSignal: (num) => {print(num);}//槽函数参数可以没有,也可以多与信号// onTestSignal:(num1,num2)=>{// print(num1);// }// onTestSignal:{// //没有参数时,即忽略信号里的参数,不使用// print("----");// }//点击这个矩形,发射信号MouseArea {anchors.fill: parentonClicked: rect2.testSignal(10)}}
属性改变信号处理器
自定义一个属性后,qml会自动生成这个属性改变的处理器(槽函数)
同样是自己发出属性改变信号,自己接受信号处理
格式:
on属性名Changed:{}
其中:
- 属性名要变成大写开头
举例:
Rectangle {id: rect3width: 100height: 50color: "red"//声明属性numproperty int num: 10//自动生成的属性变化处理器onNumChanged: {print("num属性变化了,num:" + rect3.num)}//点击后修改这个属性,对应的处理器就会自己调用MouseArea {anchors.fill: parentonClicked: rect3.num++}
}
connect函数
可以 将自己的信号 连接到 在其他元素中定义的槽函数
即自己发出信号,由其他对象接受信号进行处理
通常会在元素创建完成后Component.onCompleted中,将信号和槽函数进行连接
此方法连接信号和槽,对槽函数的名称没有要求
举例:
Rectangle {id: rect4width: 100height: 50color: "red"//定义信号signal testSignal(w: int)MouseArea {anchors.fill: parentonClicked: rect4.testSignal(rect4.width)}//通常在元素创建完成之后将信号与对应的槽函数进行连接Component.onCompleted: {//信号调用connect方法连接到其他元素中的槽函数rect4.testSignal.connect(rect5.doSomething)}
}
Rectangle {id: rect5width: 100height: 50color: "yellow"//定义槽函数function doSomething(w: int) {print("4号矩形的宽度是:" + w)}
}
Connections元素
可以 将其他元素中的信号 与 自己的槽函数进行连接
Connections元素的写法:
Connections {//需要指定target,即连接谁的信号target: 某个元素的id//可以在Connections同时连接多个信号function on信号名(){}
}
槽函数格式为:
和普通函数一样,只是名称有要求
function关键字 on信号名(参数名1:参数类型,参数名2:参数类型,...):返回值类型
其中:
- 信号名的首字母要变成大写
举例:
Rectangle {id: rect6width: 100height: 50color: "red"signal mySignal1(info: string)signal mySignal2()//点击发射信号MouseArea {anchors.fill: parentonClicked: {rect6.mySignal1("你好")rect6.mySignal2()}}
}
Rectangle {id: rect7width: 100height: 50color: "blue"//连接rect6中的信号Connections {//需要指定target,即连接谁的信号target: rect6//可以在Connections同时连接多个信号//连接rect6中的mySignal1信号function onMySignal1(info: string) {print(info)}//连接rect6中的mySignal1信号function onMySignal2() {print("响应rect2中的mySignal2信号")}}
}
注意connect函数和Connections元素的区别
- 前者是将自己的信号连接其他元素的槽函数
- 后者是将自己的槽函数连接到其他元素中的信号
基本数据类型
其中:
color,font,rect,point如何赋值:
property color c: "#FF112233" //ARGB,前面两位那个是透明度
property point p: Qt.point(50, 100)
property rect r: Qt.rect(50, 50, 100, 100)
property font f: ({family: "微软雅黑"
}) //js对象
property font ff: Qt.font({family: "微软雅黑",bold: true
})
枚举类型注意点:
- 自定义的qml文件的名称需要首字母大写,定义的枚举无法在当前qml文件中使用和访问
- 当前qml文件中只能使用其他qml文件中定义的枚举
- 枚举名需要首字母大写,枚举值也要首字母大写
- 访问格式:qml文件名.枚举类型名.枚举值
举例:
MyItem.qml文件中定义了枚举Week
Item {width: 100height: 100enum Week{Mon=1,Tue=2}
}
在另一个qml文件中使用
Rectangle{width:100 height:100//定义了一个属性,并赋枚举值property int week:MyItem.Week.Mon
}
其他类型
qml自带的或者自己定义的这些元素类型
Rectangle {width: 100height: 100//定义了一个属性,属性的类型是自己定义的元素property MyItem myitem: MyItem {width: 100}//定义了一个属性,属性的类型是qml自带的Buttonproperty Button btn: Button {text: "按钮"}
}
js对象
Rectangle {width: 100height: 100//js里的日期propertyvar datee: new Date()
}