Qt Keyboard Template

From Texas Instruments Wiki
Jump to: navigation, search


Overview

Many Qt Applications have QLineEdits(black space to type text in). But when running on an embedded device this means that a USB keyboard is needed which takes away the portability of many applications. This wiki will help solve this issue by providing a basic Qt Keyboard Form Class that can be used in all Qt Widget applications.

This wiki explains how to implement the class by walking through the process of adding the basic Qt Keyboard Class to an example application provided, the solution will look like the image below.

KeyboardLineEdit.png


Run Example Application

Download and execute the LineEdit Example source:http://processors.wiki.ti.com/images/e/e0/LineEditExample.tar.gz

LineEditApp.jpeg



Merging the Keyboard Class with Application

There are 3 main things that need to be added in order for the keyboard class to work with a project, the headers for each cpp file that access the keyboard, the Connect/Slots for every QLineEdit, and the handler that allows the Keyboard to popup.

Download the Keyboard class template source code and drop the keyboard folder inside the LineEditExample code. 

Keyboard class template source :  Keyboard_qt5_5.tar.gz

The source code contains 4 files:

  • keyboard.cpp    contains all the handlers for the Keyboard buttons
  • keyboard.h        contains
  • keyboard.ui       the form for the keyboard
  • ui_keyboard.h   the header for the keyboard form


There is one public function that is used for this class besides the constructer and deconstructor. This function is setLineEdit(QLineEdit) and is used to define which lineEdit is currently being edited.

void Keyboard::setLineEdit(QLineEdit * line)
{
     outputLineEdit = line;
}


The directory should now look like this:

./keyboard/ui_keyboard.h
./keyboard/keyboard.cpp
./keyboard/keyboard.h
./keyboard/keyboard.ui
./keyboard
./lineedit.h
./LineEditExample
./LineEditExample.pro
./lineedit.ui
./main.cpp
./lineedit.cpp


To add the Keyboard class to the existing project right click on projects top folder in QtCreator and select Add Existing Files... and select everything under Keyboard folder.

Now there is a few things that need to be changed

Headers

For every cpp file that has a QLineEdit that needs a onboard keyboard the header (In this case only lineedit.h) must have these 3 line added.
In the include section add this.

#include "keyboard/keyboard.h"


Then the Keyboard class needs to added under the "private:" section of the header.

 Keyboard *lineEditkeyboard; 

The last line needed is a handler for when they QLineEdits are pressed, in here is where the keyboard gets displayed. Also in this handler the size of the keyboard can be changed.

Under "private slots:" add

private slots:
     void run_keyboard_lineEdit();
Note: private slots did not exist in lineedit.h yet so we had to create it.

Connecting QLineEdits

Now that the keyboard class is added to the project it needs to connect the QLineEdits to it, this is done in the cpp file that creates the QLineEdits.

To do this, under the constucter there needs to be an initilizer for the keyboard class and then connect the lineEdit events to a keyboard handler.

Instantly after the user interface is setup add a line to create a new keyboard class simlar to this.

lineEditkeyboard = new Keyboard();
Note: This is in the lineedit.cpp file directly after ui->setupUi(this); line


After this line the connection from lineEdits to the keyboard handler can be implemented, it will follow this structure.

connect(***QLineEdit*** ,SIGNAL(selectionChanged()),this,SLOT(*** Keyboard Event Handler ***));


The example should have the three lineEdits connected like this.


LineEdit::LineEdit(QWidget *parent) :
QWidget(parent),
ui(new Ui::LineEdit)
{
     ui->setupUi(this);
     lineEditkeyboard = new Keyboard();
     connect(ui->lineEdit ,SIGNAL(selectionChanged()),this,SLOT(run_keyboard_lineEdit()));
     connect(ui->lineEdit_2,SIGNAL(selectionChanged()),this,SLOT(run_keyboard_lineEdit()));
     connect(ui->lineEdit_3,SIGNAL(selectionChanged()),this,SLOT(run_keyboard_lineEdit()));    
}

Handler

The last bit of code needed is to add the handler, copy and paste this code in the lineedit.cpp file after the LineEdit::~LineEdit() function.

void LineEdit::run_keyboard_lineEdit()
{
    QLineEdit *line = (QLineEdit *)sender();
    lineEditkeyboard->setLineEdit(line);
    lineEditkeyboard->show();
}


Now after clicking on any of the QLineEdits a keyboard will appear. Type in whatever you would like then press enter and it will appear in that QLineEdit afterwards.

Modifying Keyboard Class

Most modification will done at the ./Keyboard/keyboard.ui file. For Example double clicking the file in QtCreator will bring up QtDesigner and from there you can edit the size of the keyboard, change the color of the buttons, change the font size and color, and even change the entire layout.

EditKeyboardUI.jpeg


Solution

Download solution here: LineEditExampleSolution.tar.gz