QtQuick用戶交互：鼠標移動、點擊、拖拽和鍵盤輸入
1、事件處理
1）Qt使用信號槽的基礎處理大部分（非所有）的時間相應問題
2）在QML，類似地當有事件發生時，一個與事件相關的信號會被髮出。所以，要處理事件，需要定義一個槽。這個槽僅僅是一個屬性（property）；這個屬性的名字與事件的類型是相關的（鼠標點擊、計時、鍵盤按鍵等等）
2、鼠標區域（Mouse Area）
1）Mouse Area用於定義屏幕的某區域接收鼠標事件，位置與大小，與普通的items是一樣的（可以對Mouse Area使用anchors）
2）兩種方法處理鼠標輸入：處理信號和動態屬性綁定
3、與鼠標事件相關的信號
onClicked、onDoubleClicked、onPressedAndHold、onReleased等等。如：
Rectangle {
...
acceptedButtons: Qt.LeftButton | Qt.RightButton
onClicked: {
if(mouse.button == Qt.RightButton)
parent.color = "blue"
else
parent.color = "red"
}
...
}
4、拖拽元素
通過設置MouseArea的屬性drag，可以讓某個元素被拖拽。如：
Rectangle { id: opacitytest; ... Image { id: pic; MouseArea { anchors.fill: parent drag.target: pic drag.axis: "XAxis" drag.minimumX: 0 drag.maximumX: opacitytest.width - pic.width } } ... }
5、鼠標懸停與屬性 Rectangle { ... color: mouse_area.containsMouse ? "green" : "blue" MouseArea { id: mouse_area anchors.fill: parent hoverEnabled: true } ... }
6、鼠標區域的注意點1）鼠標區域只會相應acceptedButtons所定義的鼠標按鍵，槽不會接收到其他的鼠標按鍵事件；多個鼠標按鍵被按下時，pressedButtons屬性會記錄所有的按鍵，若有acceptedButtons指定的按鈕被按下，沒有指定的按鈕也會被記錄2）當hoverEnabled爲false時，鼠標按下，containsMouse爲true
7、信號VS屬性綁定1）當一個信號隻影響到某個元素時，信號更容易使用2）屬性綁定只能針對有id的元素使用，多個元素可以對同一個鼠標事件做出相應
8、鍵盤輸入1）接收文本輸入：TextInput and TextEdit(different: TextEdit is multi-line)2）在元素之間導航：a）改變元素的焦點；b）導航鍵（arrows keys），tab and backtab3）按鍵輸入：相應任意的按鍵
9、改變焦點1）UIs只有一個TextInput的時候，焦點自動在TextInput上2）若有多個TextInput，需要通過鼠標點擊來改變焦點3）若TextInput沒有文字，鼠標無法點擊，除非他有width屬性或通過anchors佈局過4）通過設置focus屬性來改變焦點
10、焦點導航 TextInput { id: name_field ... focus: true KeyNavigation.tab: address_field } TextInput { id: address_field ... KeyNavigation.backtab: name_field }1）id爲name_field的元素定義了KeyNavigation.tab，當按Tab鍵的時候焦點就移動到了address_field上2）id爲address_field的元素定義了KeyNavigation.backtab，當按shift+Tab鍵的時候焦點移動到了name_field上
11、按鍵導航爲non-text元素使用導航鍵，non-text元素也可以有焦點1）
Rectangle { //設置寬、高、顏色等屬性 Rectangle { id: leftRect color: focus ? "red" : "darkred" KeyNavigation.right: rightRect focus: true } Rectangle { id: rightRect color: focus ? "#00ff00" : "green" KeyNavigation.left: leftRect } }2）圖片旋轉的例子 Rectangle { width: 400; height: 400; color: "black" Image { id: home x: 150; y: 150 source: "images/home01.jpg" transformOrigin: Item.Center } Keys.onLeftPressed: home.rotation = (home.rotation - 10) % 360 Keys.onRightPressed: home.rotation = (home.rotation + 10) % 360 focus: true }This property-transformOrigin-holds the origin point around which scale and rotation transformNine transform origin are available. The default transform origin is Item.CenterThe nine transform origin are TopLeft, Top, TopRight, Left, Center, Right, BottomLeft, Bottom, BottomRight
12、鍵盤按鍵輸入
1）所有可是元素都可以通過Keys的attached屬性進行鍵盤事件處理
2）支持的鍵盤事件包括：A）通用事件（onPressed、onReleased）；B）專用事件（onReturnPressed、onSelectPressed、
onVolumePressed等等，他們都有個類型爲KeyEvent的參數event）
3）處理通用信號時，需要顯示的告知事件被處理了，event.accepted = true；否則這個事件將會傳遞
4）專用事件默認就將事件處理了
Item {//Handle a key event with a generic handler focus: true Keys.onPressed: { if(event.key == Qt.Key_Left){//See Qt::Key for codes console.log("move left") event.accepted = true//Must accept explicity } } } Item {//Handle a key event with a specialized handler focus: true Keys.onLeftPressed://Accepts the event by default console.log("move left") }