×
Namespaces

Variants
Actions

用QML实现用户定制虚拟键盘

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata

代码示例
文章
cuizhan 在 13 Oct 2011 创建
最后由 hamishwillee 在 20 Sep 2012 编辑

Contents

介绍

本文将介绍如何用QML实现用户定制虚拟键盘,下面我们将以一段代码分步介绍其实现过程。

具体实现

首先我们需要创建一个键盘COMPONENT,在其中设置键盘的外观和样式,具体代码如下:

Component
{
id: redVkb
Rectangle {
id: rec
color: "red"
height: 100
Item {
anchors.centerIn: parent
Button {
id: addA
width: 150
anchors.right: removeA.left
anchors.rightMargin: 12
anchors.verticalCenter: parent.verticalCenter
text: "Add 'A'"
onClicked: inputContext.softwareInputPanelEvent = "A"
}
Button {
id: removeA
width: 150
anchors.verticalCenter: parent.verticalCenter
text: inputContext.targetInputFor(redVkb).backspaceTitle
onClicked: inputContext.softwareInputPanelEvent = "Backspace"
}
}
}
}

在上述代码中,我们创建了一个id为redVkb,拥有两个按键的键盘,接下来我们需要设置TextField的 platformCustomSoftwareInputPanel属性,代码如下:

TextField
{
platformCustomSoftwareInputPanel:redVkb
}

注: redVKB是我们已经定义的键盘COMPONENT的ID, 最后我们需要完成按键事件的响应,具体代码如下:

Connections {
target: inputContext
onSoftwareInputPanelEventChanged: {
if(aTextField.activeFocus) {
if(inputContext.softwareInputPanelEvent == "Backspace") {
if(aTextField.text.length > 0)
aTextField.text = aTextField.text.substring(0, aTextField.text.length - 1)
} else {
aTextField.text = aTextField.text + inputContext.softwareInputPanelEvent
}
}
}
}

当用户按下按键时,onSoftwareInputPanelEventChanged将会被调用,我们在其中实现按键的响应。通过上述三步,我们就完成了一个简单的订制键盘。

代码下载

File:Meego qml component customvkb.zip

相关链接

Meego开发

This page was last modified on 20 September 2012, at 07:05.
141 page views in the last 30 days.
×