×
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 04:05.
144 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×