Gestion des saisies utilisateur
Types de saisie pris en charge
Le Qt Quick module prend en charge les types d’entrées utilisateur les plus courants, notamment les événements de souris et tactiles, la saisie de texte et les événements de frappe. D’autres modules prennent en charge d’autres types d’entrées utilisateur.
Cet article explique comment gérer les entrées utilisateur de base. Pour plus d’informations sur les entrées audiovisuelles, consultez la Qt Multimedia documentation.
Événements de souris et tactiles
Les gestionnaires d’entrée permettent aux applications QML de gérer les événements de souris et tactiles. Par exemple, vous pouvez créer un bouton en ajoutant un ` TapHandler ` à une image (`Image`) ou à un élément de contrôle (` Rectangle `) contenant un objet ` Text `. Le ` TapHandler ` réagit aux tapotements ou aux clics effectués avec n’importe quel type de dispositif de pointage.
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
}
}
}Remarque : certains types d’éléments disposent de leur propre gestion intégrée des entrées. Par exemple, les objets « Flickable » réagissent au glissement de la souris, aux mouvements rapides du doigt et au défilement à l’aide de la molette de la souris.
Événements liés au clavier et aux boutons
Les pressions sur les boutons et les touches, qu’elles proviennent des boutons d’un périphérique, d’un pavé numérique ou d’un clavier, peuvent toutes être gérées à l’aide de la propriété attachée Keys. Cette propriété attachée est disponible sur tous les types dérivés de Item et fonctionne avec la propriété Item::focus pour déterminer quel type reçoit l’événement de touche. Pour une gestion simple des touches, vous pouvez définir le focus sur « true » pour un seul Item et y effectuer toute la gestion des touches.
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
}
}Pour la saisie de texte, plusieurs types QML s’offrent à vous. ` TextInput ` fournit un champ de texte modifiable sur une seule ligne sans mise en forme, tandis que ` TextField ` est plus adapté aux champs de formulaire dans les applications. ` TextEdit ` permet de gérer du texte modifiable sur plusieurs lignes, mais ` TextArea ` constitue une meilleure alternative car il ajoute une mise en forme.
L'extrait de code suivant montre comment utiliser ces types dans votre application :
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"
}
}
}
}© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.
