QML语中信号的定义和正确使用
[cpp]查看普通文本
项目{
& ltstrong & gtid:root & lt；/strong & gt；
宽度:units.gu(100)
身高:个位.顾(75)
红灯信号
绿灯信号
黄色信号灯
矩形
id:背景
anchors.fill:父级
颜色:【黑色】
属性int size: width*0.7
我们可以看到，我们已经定义了三个信号。它们是“雷德莱顿”、“格林莱顿”和“耶洛莱顿”。定义这三个信号的目的是在红灯、黄灯、绿灯亮的时候用这些信号发出通知。这样，只要感兴趣的代码就可以拦截它并处理它。这里一定要注意，信号的第一个字母是小写的！
接下来，我们在JS代码中发送这些信号。代码如下:
[cpp]查看普通文本
计时器{
间隔:1000
跑步:真的
重复:正确
属性int计数:0
已触发:{
if(parent . state = = " red _ on " & amp；& ampcount & gt= 5)
{
parent.state = "red_yellow_on "
& ltstrong & gtroot . red lighton()；
root . yellow light on()；& lt/strong & gt；
计数= 0
}
else if(parent . state = = " red _ yellow _ on ")
{
parent.state = "green_on "
& ltstrong & gtroot . green light on()；& lt/strong & gt；
count++
}
else if(parent . state = = " green _ on " & amp；& ampcount & gt= 5 )
{
parent.state = "yellow_on "
& ltstrong & gtroot . yellow light on()；& lt/strong & gt；
count ++
}
else if(parent . state = = " yellow _ on "){
parent.state = "red_on "
red lighton()；
计数= 0
}
否则{
count++
}
}
}
发送信号其实很简单。直接发送，就像调用方法一样
为了在我们的代码部分拦截这个应用程序，我们可以使用以下方法。在“TrafficLight.qml”中，将代码修改如下:
[cpp]查看普通文本
导入QtQuick 2.0
导入Ubuntu。组件0.1
导入“用户界面”
主视图{
//用于功能测试的object name(auto pilot-qt5)
对象名:“主视图”
//注意！applicationName需要与点击清单的“名称”字段相匹配
application name:" com . Ubuntu . developer . Liu-xiaoguo。交通之光"
/*
该属性使应用程序能够改变方向
当设备旋转时。默认值为false。
*/
//automaticOrientation: true
宽度:units.gu(120)
身高:个位.顾(80)
页面{
id:main
anchors.fill:父级
第{
id: myrow
anchors . horizontal center:parent . horizontal center
anchors . vertic center:parent . vertical center
间距:units.gu(5)
我的灯{
id:light
宽度:main.width/5
高度:宽度*3
onRedLightOn: {
console.log("红灯亮")
}
}
连接{
目标:光
onYellowLightOn: {
console.log("黄灯亮起")
}
}
}
函数greenLightOn() {
console.log("绿灯亮了")
}
Component.onCompleted: {
light . green light on . connect(green light on)；
}
}
}
为了说清楚，我写了三个方法。一种是直接将信号的第一个字母大写，同时在其前面加上“on”。第二种方法使用“连接”来连接插槽。第三种方式，我们可以直接将信号连接到JS函数。运行程序时，我们可以在应用程序的输出窗口中看到以下输出:
[cpp]查看普通文本
绿灯亮了
黄灯亮了
红灯亮了
红灯亮了
黄灯亮了
绿灯亮了
黄灯亮了
红灯亮了
红灯亮了
黄灯亮了
事实上，所有控件的属性都可以发送信号。让我们来看看前面完成的“颜色”属性。
[cpp]查看普通文本
set color(const QColor & amp；颜色)
{
if ( color == m_color)
返回；
否则{
m_color =颜色；
update()；//用新颜色重画
emit color changed()；
}
}
由此可以看出，每当属性值发生变化时，就会出现一个叫做“colorChanged”的信号。我们可以在QML拦截这个信号。例如，在我们的代码中，我们可以使用以下代码:
[cpp]查看普通文本
交通信号灯{
身份证:红灯
宽度:背景.大小
高度:背景.尺寸
颜色:【红色】
onColorChanged: {
console.log("颜色改为"+Color ")；
}
}
当我们跑步时，我们可以看到许多颜色变化事件。这是因为颜色在过渡过程中变化很大。类似地，我们也可以捕获任何属性的事件。例如:
[cpp]查看普通文本
交通信号灯{
身份证:红灯
宽度:背景.大小
高度:背景.尺寸
颜色:【红色】
onColorChanged: {
console.log("颜色改为"+Color ")；
}
onWidthChanged: {
console.log("宽度改为"+宽度)；
}
}
这个代码可以捕捉到“宽度”的变化！