Hi devs,
During development of my app (see my signature), I researched a bit and finally found a quite nice way to implement a custom keyboard which is only shown in your app easily.
Much of this is taken from Maarten Pennings' awesome guide here, thanks to him and feel free to read it as well.
So I thought I'd extend his work with this guide which also takes a look at why you'd want to use one or the other keyboard. Enjoy! :victory:
Congrats, you have finished adding a CustomKeyboard and can now test and further improve it :good:
Read on if you want to theme it further (let's face it, the default theme is still from the first versions of android).
During development of my app (see my signature), I researched a bit and finally found a quite nice way to implement a custom keyboard which is only shown in your app easily.
Much of this is taken from Maarten Pennings' awesome guide here, thanks to him and feel free to read it as well.
So I thought I'd extend his work with this guide which also takes a look at why you'd want to use one or the other keyboard. Enjoy! :victory:
Limits of the Android IME
Any kind of text input (password, number, address, etc.) is usually handled very nicely using the android:inputType attribute (or the corresponding setter in java) on the EditText field.
But as soon as you have to deny some characters, for instance you want the user to insert a file name, it gets more complicated since there is no inputType for that.
The way to achieve that would be to implement your own KeyListener like this:
The problem is that the keys are still present and therefore distracting and irritating to the user, because nothing happens on click.Java:import android.text.method.NumberKeyListener; //... // set a new KeyListener onto your desired EditText, overriding the default one: EditText edit = findViewById(R.id.edittext); edit.setKeyListener(new NumberKeyListener(){ @Override public int getInputType() { // should be the same as android:inputType, for all numbers including decimal and negative: return (InputType.TYPE_CLASS_NUMBER | InputType.TYPE_NUMBER_FLAG_DECIMAL | InputType.TYPE_NUMBER_FLAG_SIGNED); } @Override protected char[] getAcceptedChars() { // declare your desired chars here, ONLY those will be accepted! // for instance numbers: char [] res = {'1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '+', '-', '*', '/', '(', ')', '.', ',', ' ', '^', '!', // alphabet: 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z' }; return res; } });
And also, there might be a much easier and better accessible layout for your set of keys. In the following I will tell you how to integrate such a custom layout using the KeyboardView class, but first let's take a look at the advantages of both keyboards:
Android IME or KeyboardView???
The answer to this question is tightly depending on the task you want the user to fulfil, and also on how much freedom you want to give him. The high customizablility and its theming options are a strong point for the KeyboardView, but be warned that since this View was added in API level 3 (and never updated I think) there are a couple of bugs which you have to workaround.
A standard keyboard is more familiar to the user and is often also a third-party keyboard and therefore more customizable. But this also has its downsides since there is no guarantee that the IME will display the characters you need.
Note that you will not be able to get a working cursor image easily with the KeyboardView (though the cursor works as it should, just the blue arrow below it won't be displayed).
For simple tasks where just a few buttons will be useless, such as when asking for a filename the normal IME is recommended. But for various operations you'll find the KeyboardView to be much cleaner.
If you decided to try the KeyboardView, here's how it works:
Adding a CustomKeyboard
NOTE: I will only cover how to implement such a Keyboard, if you want to know how it works in detail check out the third chapter in Maarten Pennings' guide.
First, since it is a view, you will need to manually insert the following to the xml layout file of all activities where you want to use it:
Put it in a relative layout container, though it should also work in other ones. Most important is that it is the topmost container in the view hierarchy.Code:<android.inputmethodservice.KeyboardView android:id="@+id/keyboardview" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:focusable="true" android:focusableInTouchMode="true" android:visibility="gone" />
Second, you need an xml file where all the keys and their layout are stored for the KeyboardView to inflate. For a start, you can take the one Maarten Pennings has posted or download mine here: View attachment keyboard_layout.txt (xda doesn't support .xml files, so just rename it to keyboard_layout.xml!)
Move that file to your res/xml/ folder, you can create other layouts for landscape using res/xml-land/
You have to play around with that file a bit to get your desired layout, here are some tips:
As I said, you will need some patience doing this since there is neither help nor documentation on the xml namespaces.
- Start by designing it on paper, then write it as a comment (ASCII-Art?) so you have it properly lined up and always at your hand while coding
- Including gaps of half a key or so to separate different areas works nicely
- Highlight important keys either with a different android:keyBackground or by making them larger than the others.
- Leave the android:horizontalGap attribute untouched on Keyboard level, this will probably break the key lineup
- Calculate the key width like so: width = 100/(keysPerRow + numberOfGaps)
- Set the android:keyHeight on Keyboard level to something that rows*keyHeight is about 40%-50%.
- For every key label which is longer a single character, use the corresponding ASCII-integer as key code (android:codes), otherwise pick a negative number or one that's higher than 256
- Use android:isRepeatable="true" for keys to press and hold for multiple clicks like the delete key
- If you want to display a popup keyboard on hold, you should rather make a popup window yourself or use a dialog rather than using the android
opupKeyboard attribute.
- For inserting more than one char on click, use the android:keyOutputText on key level or override the specific keycode in the onKey() method in CustomKeyboard.java
Third, there are a couple of icons required for some keys like the delete key. You can either use the ones provided in the guide, but I suggest downloading the original holo android icons from the different drawable folders here.
Take the sym_keyboard_... files that you think you'll need and place them in the respective res/drawable-ydpi folder. Set the android:keyIcon attribute to @drawable/sym_keyboard_... for those special keys.
Fourth, we need a java class to process the clicks and provide the methods for showing and hiding the keyboard. Luckily, you take mine here: View attachment CustomKeyboard.txt (again, rename it to CustomKeyboard.java)
Copy that file into your src/com/package/name and change the package to your app.
This class is heavily based of the one Maarten Pennings has come up with, but with an actually working cursor, so that you can tap or drag to move the cursor. I included haptic feedback (set it using enableHapticFeedback(true)) and an easy way to add chooser dialogs if you want to have multiple insertions in one key (see the onClick(...) method); This looks like this:
If you are using any special keys or dialogs as popups, you will need to edit the onKey() or the onClick() method like I did.
Fifth, in your onCreate() method after setContentView(...) you just need to register every EditText that you want to use the keyboard on like so:
Java:// initialize the instance variable customKeyboard customKeyboard = new CustomKeyboard(this, R.id.keyboardview, R.xml.keyboard_layout); // register the edittext customKeyboard.registerEditText(R.id.edittext);
For a hiding keyboard if you press the Back key, add the following to your activity:
Java:@Override public void onBackPressed() { if(customKeyboard!=null && customKeyboard.isCustomKeyboardVisible() ) customKeyboard.hideCustomKeyboard(); else super.onBackPressed(); }
Congrats, you have finished adding a CustomKeyboard and can now test and further improve it :good:
Read on if you want to theme it further (let's face it, the default theme is still from the first versions of android).
Last edited:
