（四）鼠标，键盘，定时器

鼠标

import QtQuick 2.0

Rectangle {
    width: 320;
    height: 240;

    MouseArea {
        anchors.fill: parent;
        acceptedButtons: Qt.LeftButton | Qt.RightButton;
        onClicked: {
            if(mouse.button == Qt.RightButton){
                Qt.quit();
            }
            else if(mouse.button == Qt.LeftButton){
                color = Qt.rgba((mouse.x % 255) / 255.0 , (mouse.y % 255) / 255.0, 0.6, 1.0);
            }
        }
        onDoubleClicked: {
            color: "gray";
        }
    }
}

  上面代码实现了鼠标右键点击退出，鼠标左键单击改变颜色，双击颜色变成灰色。
  MouseArea对象可以附加到一个Item上供Item处理鼠标事件，它本身是一个不可见的Item，在其内部，可以直接引用它所附着的对象的属性和方法。可以将MouseArea理解为它所附着的Item的代理。
  作为一个Item，MouseArea也拥有anchors属性，你可以使用它来描述有效的鼠标区域，实例中anchors.fill: parent表示整个举行区域都接受鼠标事件。

键盘

  Keys对象是Qt Quick提供的，专门供Item处理按键事件的对象，它定义了常用的pressed和released信号，信号的参数为event，类型为KeyEvent，包含了按键的详细信息。
  event.accepted = true表示该控件接收了按键事件后，就不继续向下传递了，否则会继续向下传递，这个值默认是false。
  Keys有三个属性：
  1.enable表示该控件是否处理按键事件，默认为true。
  2.forwardTo属性是列表类型，表示传递按键事件给列表内的对象，如果某个对象接受了某个按键(event.accepted = true)，那么位列其后的对象就不会收到该按键事件，我的理解是子对象要支持按键事件必须使用这个属性。
  3.priority属性允许你设置Keys附加属性的优先级，有两种：再Item之前处理按键(默认行为)，在Item之后处理按键。
  最后，如果你想让某个元素处理按键，需要把焦点给它，通过Item的focus属性来控制，设置为true即可。

import QtQuick 2.0
import QtQuick.Controls 1.2
Rectangle {
    width: 320;
    height: 480;
    color: "gray";

    focus:true;
    Keys.enabled: true;
    Keys.onEscapePressed: {
        Qt.quit();
    }
    Keys.forwardTo: [moveText, likeQt];

    Text {
        id: moveText;
        x: 20;
        y: 20;
        width: 200;
        height: 30;
        text: "Moving Text";
        color: "blue";
        font{bold:true;pixelSize: 24;}
        Keys.enabled: true;
        Keys.onPressed: {
            switch(event.key){
            case Qt.Key_Left:
                x -= 10;
                break;
            case Qt.Key_Right:
                x += 10;
                break;
            case Qt.Key_Down:
                y += 10;
                break;
            case Qt.Key_Up:
                y -= 10;
                break;
            case Qt.Key_Space:
                console.log("space");
                break;
            default:
                return;
            }
            event.accepted = true;
        }
    }

    CheckBox {
        id: likeQt;
        text: "Like Qt Quick";
        anchors.left: parent.left;
        anchors.leftMargin: 10;
        anchors.bottom: parent.bottom;
        anchors.bottomMargin: 10;
        z: 1;
    }
}

Qt Quick中有一些元素本身会处理按键，例如CheckBox，它会响应空格键来选中或取消选中状态，我们就不需要额外写键盘处理事件。

定时器

在QML中，Timer元素表示定时器，triggered为其触发的信号。
interval为定时触发间隔
repeat设定定时器是周期性触发还是一次性触发，默认是一次性
runningt为true时定时器就开始工作，默认是false
triggeredOnStart表示定时器是立即触发还是等待设定的时间间隔后再触发
Timer还有start()、stop()、restart()三个方法，他们会影响running的属性。

import QtQuick 2.0
import QtQuick.Controls 1.2

Rectangle {
    width: 320;
    height: 240;
    color: "gray";
    QtObject {
        id: attrs;
        property int counter;
        Component.onCompleted: {
            attrs.counter = 10;
        }
    }

    Text {
        id: countShow;
        anchors.centerIn: parent;
        color: "blue";
        font.pixelSize: 40;
    }

    Timer {
        id: countDown;
        interval: 1000;
        repeat: true;
        triggeredOnStart: true;
        onTriggered: {
            countShow.text = attrs.counter;
            attrs.counter -= 1;
            if(attrs.counter < 0){
                countDown.stop();
                countShow.text = "Clap Now!";
            }
        }
    }

    Button {
        id: startButton;
        anchors.top: countShow.bottom;
        anchors.topMargin: 20;
        anchors.horizontalCenter: countShow.horizontalCenter;
        text: "Start";
        onClicked: {
            attrs.counter = 10;
            countDown.start();
        }
    }
}