×
Namespaces

Variants
Actions
Revision as of 04:17, 11 October 2012 by hamishwillee (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Implementing a split screen for software keyboard

From Nokia Developer Wiki
Jump to: navigation, search

This code example shows how to implement SW keyboard on Symbian^3 and Symbian Anna devices in split screen mode. Without the changes given here the keyboard will open but the UI of the app is hidden; with the changes the underlying app remains visible.

Note.pngNote: This issue which caused this problem has been fixed in Nokia Belle, but is still relevant for Symbian^3 and Symbian Anna.

Article Metadata
Code ExampleTested with
Devices(s): Nokia E7-00, Nokia N8-00
Compatibility
Platform(s): Symbian^3, Symbian Anna. Not Nokia Belle
Symbian
Symbian Anna
Symbian^3
Article
Keywords: EAknEditorFlagEnablePartialScreen
Created: kratsan (30 May 2011)
Last edited: hamishwillee (11 Oct 2012)

Split screen portrait.png Split screen landscape.png Download the sources here: media:splitscreenquick.zip.

Contents

Project file

Add following libs to your project file under the Symbian section.

symbian {
TARGET.UID3 = 0xE025202D
 
# FOR ENABLING SPLIT SCREEN VIRTUAL KEYBOARD
LIBS += -lcone -lws32 -lavkon -leikctl -leikcoctl -luiklaf -lform -lfepbase
}

Symbian native code

Implement a Qt slot that sets the appropriate flag to the text editor so that the SW keyboard is shown with the real UI controls. Remember to call this slot right after the SW keyboard is shown.

// Required includes and the flag
#ifdef Q_OS_SYMBIAN
#include <aknedsts.h>
#include <coeaui.h>
#include <coemain.h>
#include <w32std.h>
#define EAknEditorFlagEnablePartialScreen 0x200000
#endif
 
// Qt slot that sets the approriate flag to the text editor.
void SWKeyboardHandler::enableSplitSreen()
{
// The text editor must be open before setting the partial screen flag.
 
#ifdef Q_OS_SYMBIAN
MCoeFepAwareTextEditor *fte = CCoeEnv::Static()->AppUi()->InputCapabilities().FepAwareTextEditor();
 
// FepAwareTextEditor() returns 0 if no text editor is present
if (fte)
{
CAknEdwinState *state = STATIC_CAST(CAknEdwinState*, fte->Extension1()->State(KNullUid));
state->SetFlags(state->Flags() | EAknEditorFlagEnablePartialScreen);
}
#endif
}

main.cpp

Connect the signal from QML to enableSplitscreen slot.

// Setup the app to call the code code on up when SW keyboard is shown
QmlApplicationViewer viewer;
viewer.setOrientation(QmlApplicationViewer::ScreenOrientationAuto);
viewer.setMainQmlFile(QLatin1String("qml/splitscreenquick/main.qml"));
 
// Contains a slot to set the enable partial screen flag to
// the text editor.
SWKeyboardHandler kbHandler;
 
// The object that contains the QML root element is retrieved
// from Declarative view.
QObject *rootQml = qobject_cast<QObject*>(viewer.rootObject());
QObject::connect(rootQml, SIGNAL(swKeyboardOpened()),
&kbHandler, SLOT(enableSplitSreen()));

Qt Quick UI

In the QML tell the Qt code to enable the split screen SW keyboard right after the SW keyboard is opened. The following QML code implements a UI that has nice text edit with scrolling capability, scaling for portrait and landscape. The TextEdit is placed on the upper half of the UI so that the SW keyboard won't get on top of the control.

import QtQuick 1.0
 
Rectangle {
id: main
 
// Interface for the Qt code.
signal swKeyboardOpened()
 
width: 360; height: 360
color: "gray"
 
// Nice border for the text edit.
Rectangle {
anchors {
top: parent.top
bottom: parent.verticalCenter
left: parent.left
right: parent.right
margins: 30
}
 
border.color: "black"
border.width: 2
color: "white"
radius: 8
clip: true
 
// Provides scrollability for the text edit.
Flickable {
id: flickable
 
anchors {
fill: parent
margins: 10
}
 
contentHeight: textEdit.height
 
// Used to scroll the flickable so that the cursor
// is visible.
function ensureVisible(r)
{
if (contentX >= r.x)
contentX = r.x;
else if (contentX+width <= r.x+r.width)
contentX = r.x+r.width-width;
if (contentY >= r.y)
contentY = r.y;
else if (contentY+height <= r.y+r.height)
contentY = r.y+r.height-height;
}
 
// Used to catch mouse clicks that hits to the rectangle
// but not to the text edit, which is quite small at the
// start of the application.
MouseArea {
width: flickable.width; height: flickable.height
 
onClicked: {
textEdit.focus = true;
textEdit.openSoftwareInputPanel();
}
}
 
TextEdit {
id: textEdit
 
width: flickable.width
wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
focus: true
 
text: "Edit me!"
color: "black"
 
// When the text edit gets the focus, signal is emitted
// to the Qt side, where we will set the special flag to
// open the SW keyboard in split view mode.
onFocusChanged: {
if(focus == true) {
main.swKeyboardOpened();
}
}
 
// Whenever the cursor is moved scroll the flickable so that
// the cursor is actually visible.
onCursorRectangleChanged: {
flickable.ensureVisible(cursorRectangle)
}
}
}
}
}

Postconditions

The snippet demonstrated how to implement the platform SW keyboard on a split screen mode in a Qt Quick UI.

This page was last modified on 11 October 2012, at 04:17.
84 page views in the last 30 days.
×