支持的用戶輸入類型

Qt Quick 模塊支持最常見的用戶輸入類型，包括鼠標(biāo)和觸摸事件、文本輸入和按鍵事件，其他模塊為其他類型的用戶輸入提供支持。

本文介紹了如何處理基本的用戶輸入。

鼠標(biāo)和觸摸事件

輸入處理程序讓 QML 應(yīng)用程序處理鼠標(biāo)和觸摸事件。 例如，您可以通過將 TapHandler 添加到 Image 或添加到其中包含 Text 對(duì)象的 Rectangle 來創(chuàng)建按鈕，TapHandler 響應(yīng)輕敲或點(diǎn)擊任何類型的定點(diǎn)設(shè)備。

import QtQuick

Item {
id: root

width: 320
height: 480

Rectangle {
color: "#272822"
width: 320
height: 480
}

Rectangle {
id: rectangle
x: 40
y: 20
width: 120
height: 120
color: "red"

TapHandler {
onTapped: rectangle.width += 10
}
}
}

注意：某些項(xiàng)目類型有自己的內(nèi)置輸入處理。 例如，F(xiàn)lickable 響應(yīng)鼠標(biāo)拖動(dòng)、輕觸和鼠標(biāo)滾輪滾動(dòng)。

鍵盤和按鈕事件

來自設(shè)備、小鍵盤或鍵盤上的按鈕和按鍵都可以使用 Keys 附加屬性進(jìn)行處理，此附加屬性可用于所有 Item 派生類型，并與 Item::focus 屬性一起確定接收鍵事件的類型。 對(duì)于簡(jiǎn)單的鍵處理，您可以在單個(gè) Item 上將焦點(diǎn)設(shè)置為 true 并在那里進(jìn)行所有鍵處理。

import QtQuick

Item {
id: root

width: 320
height: 480

Rectangle {
color: "#272822"
width: 320
height: 480
}

Rectangle {
id: rectangle
x: 40
y: 20
width: 120
height: 120
color: "red"

focus: true
Keys.onUpPressed: rectangle.y -= 10
Keys.onDownPressed: rectangle.y += 10
Keys.onLeftPressed: rectangle.x += 10
Keys.onRightPressed: rectangle.x -= 10
}
}

對(duì)于文本輸入，我們有多種 QML 類型可供選擇。 TextInput 提供無樣式的單行可編輯文本，而 TextField 更適合應(yīng)用程序中的表單字段。 TextEdit 可以處理多行可編輯文本，但 TextArea 是更好的選擇，因?yàn)樗砑恿藰邮健?

以下代碼段演示了如何在您的應(yīng)用程序中使用這些類型：

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

ApplicationWindow {
width: 300
height: 200
visible: true

ColumnLayout {
anchors.fill: parent
TextField {
id: singleline
text: "Initial Text"
Layout.alignment: Qt.AlignHCenter | Qt.AlignTop
Layout.margins: 5
background: Rectangle {
implicitWidth: 200
implicitHeight: 40
border.color: singleline.focus ? "#21be2b" : "lightgray"
color: singleline.focus ? "lightgray" : "transparent"
}
}

TextArea {
id: multiline
placeholderText: "Initial text\n...\n...\n"
Layout.alignment: Qt.AlignLeft
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: 5
background: Rectangle {
implicitWidth: 200
implicitHeight: 100
border.color: multiline.focus ? "#21be2b" : "lightgray"
color: multiline.focus ? "lightgray" : "transparent"
}
}
}
}

Qt商用組件推薦

• QtitanRibbon - Ribbon UI組件：是一款遵循Microsoft Ribbon UI Paradigm for Qt技術(shù)的Ribbon UI組件，QtitanRibbon致力于為Windows、Linux和Mac OS X提供功能完整的Ribbon組件。
• QtitanChart - Qt類圖表組件：是一個(gè)C ++庫，代表一組控件，這些控件使您可以快速地為應(yīng)用程序提供漂亮而豐富的圖表。
• QtitanDataGrid - Qt網(wǎng)格組件：提供了一套完整的標(biāo)準(zhǔn) QTableView 函數(shù)和傳統(tǒng)組件無法實(shí)現(xiàn)的獨(dú)特功能。使您能夠?qū)⒉煌瑏碓吹母黝悢?shù)據(jù)加載到一個(gè)快速、靈活且功能強(qiáng)大的可編輯網(wǎng)格中，支持排序、分組、報(bào)告、創(chuàng)建帶狀列、拖放按鈕和許多其他方便的功能。
• QtitanNavigation：QtitanNavigationDesignUI 組件是一組 GUI 控件，它實(shí)現(xiàn)了菜單、導(dǎo)航框、命令欄等導(dǎo)航界面，并讓您以更少的滾動(dòng)和點(diǎn)擊次數(shù)有效地查看所有實(shí)體（工作區(qū)、網(wǎng)格或其他項(xiàng)目）。
• QtitanDocking：允許您像 Visual Studio 一樣為您的偉大應(yīng)用程序配備可停靠面板和可停靠工具欄。黑色、白色、藍(lán)色調(diào)色板完全支持 Visual Studio 2019 主題！

Qt技術(shù)交流群4：166830288      歡迎一起進(jìn)群討論