Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to create a custom keyboard on android

    • 0
    • 3
    • 1
    • 1
    • 1
    • 0
    • 0
    • 0
    • 12.9k
    Comment on it

    If you are interested in making your own Soft Keyboard in android, then this tutorial will be helpful for you. Below are few steps to learn how to create your own Soft Keyboard that can serve as your own default keyboard.

    Step1: To enter a text Input Editor Method(IEM) is used in android. BIND_INPUT_METHOD permission into application tag is used to connect our service with the IME.

    AndroidManifest.xml

    <service
         android:name=".CustomSoftKeyboard"
         android:label="CustomSoftKeyboard"
         android:permission="android.permission.BIND_INPUT_METHOD">
    
         <intent-filter>
             <action android:name="android.view.InputMethod" />
         </intent-filter>
    
         <meta-data
             android:name="android.view.im"
             android:resource="@xml/method" />
    
    </service>
    

    Step2: This file having information about input type and its subtypes, reference of this file is in meta-data tag in manifest file.

    method.xml

    <?xml version="1.0" encoding="utf-8"?>
    <input-method xmlns:android="http://schemas.android.com/apk/res/android">
        <subtype
            android:label="subtype_en_US"
            android:imeSubtypeLocale="en_US"
            android:imeSubtypeMode="keyboard" />
    </input-method>
    

    Step3: This step is for the layout of our keyboard, inputmethodservice.KeyboardView is used for the layout in our custom keyboard.

    keyboard.xml

    <?xml version="1.0" encoding="utf-8"?>
    <android.inputmethodservice.KeyboardView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/keyboard"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:keyPreviewLayout ="@layout/custom_button"/>
    

    custom_button.xml is for keyboard button background, textcolor, and size.

    <?xml version="1.0" encoding="utf-8"?>
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:background="@android:color/white"
        android:textColor="@android:color/black"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textSize="20sp">
    </TextView>
    

    Step4: Details, positioning and functioning of custom keyboard are specified in qwerty_keyboard.xml

    android:keyLabel:- To display text on keys.

    android:codes:- unicode values of keys.

    android:keyEdgeFlags:- This attribute may be true or false, mostly used in leftmost and rightmost keys of row.

    android:keyWidth:- Keywidth for equally distribution of row between keys, defined in percentage value.

    android:isRepeatable:- For repeated use of key ex:- delete and spacebar.

    qwerty_keyboard.xml

    <?xml version="1.0" encoding="utf-8"?>
    <Keyboard
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:keyWidth="10%p"
        android:horizontalGap="0px"
        android:verticalGap="0px"
        android:keyHeight="60dp">
    
        <Row>
            <Key android:codes="49" android:keyLabel="1" android:keyEdgeFlags="left"/>
            <Key android:codes="50" android:keyLabel="2"/>
            <Key android:codes="51" android:keyLabel="3"/>
            <Key android:codes="52" android:keyLabel="4"/>
            <Key android:codes="53" android:keyLabel="5"/>
            <Key android:codes="54" android:keyLabel="6"/>
            <Key android:codes="55" android:keyLabel="7"/>
            <Key android:codes="56" android:keyLabel="8"/>
            <Key android:codes="57" android:keyLabel="9"/>
            <Key android:codes="48" android:keyLabel="0" android:keyEdgeFlags="right"/>
        </Row>
    
        <Row>
            <Key android:codes="113" android:keyLabel="q" android:keyEdgeFlags="left"/>
            <Key android:codes="119" android:keyLabel="w"/>
            <Key android:codes="101" android:keyLabel="e"/>
            <Key android:codes="114" android:keyLabel="r"/>
            <Key android:codes="116" android:keyLabel="t"/>
            <Key android:codes="121" android:keyLabel="y"/>
            <Key android:codes="117" android:keyLabel="u"/>
            <Key android:codes="105" android:keyLabel="i"/>
            <Key android:codes="111" android:keyLabel="o"/>
            <Key android:codes="112" android:keyLabel="p" android:keyEdgeFlags="right"/>
        </Row>
    
        <Row>
            <Key android:codes="35" android:keyLabel="\#" android:keyEdgeFlags="left"/>
            <Key android:codes="97" android:keyLabel="a"/>
            <Key android:codes="115" android:keyLabel="s"/>
            <Key android:codes="100" android:keyLabel="d"/>
            <Key android:codes="102" android:keyLabel="f"/>
            <Key android:codes="103" android:keyLabel="g"/>
            <Key android:codes="104" android:keyLabel="h"/>
            <Key android:codes="106" android:keyLabel="j"/>
            <Key android:codes="107" android:keyLabel="k"/>
            <Key android:codes="108" android:keyLabel="l"/>
            <Key android:codes="64" android:keyLabel="\@" android:keyEdgeFlags="right"/>
        </Row>
    
        <Row>
            <Key android:codes="46" android:keyLabel="." android:keyEdgeFlags="left"/>
            <Key android:codes="122" android:keyLabel="z"/>
            <Key android:codes="120" android:keyLabel="x"/>
            <Key android:codes="99" android:keyLabel="c"/>
            <Key android:codes="118" android:keyLabel="v"/>
            <Key android:codes="98" android:keyLabel="b"/>
            <Key android:codes="110" android:keyLabel="n"/>
            <Key android:codes="109" android:keyLabel="m"/>
            <Key android:codes="44" android:keyLabel="," />
            <Key android:codes="58" android:keyLabel=":" android:keyEdgeFlags="right"/>
        </Row>
    
        <Row android:rowEdgeFlags="bottom">
            <Key android:codes="-1" android:keyLabel="CAPS" android:keyWidth="20%p" android:keyEdgeFlags="left"/>
            <Key android:codes="32" android:keyLabel="SPACE" android:keyWidth="40%p" android:isRepeatable="true"/>
            <Key android:codes="-5" android:keyLabel="DEL" android:keyWidth="20%p" android:isRepeatable="true"/>
            <Key android:codes="-4" android:keyLabel="DONE" android:keyWidth="20%p" android:keyEdgeFlags="right"/>
        </Row>
    
    </Keyboard>
    

    Step5: Create a class CustomSoftKeyboard.java which extends InputMethodService and implements KeyboardView.OnKeyboardActionListener. InputMethodService provides a framework and a standard for input methods. OnKeyboardActionListener inteface is called whenever user click/tab on the soft keys.

    CustomSoftKeyboard.java

    @Override
        public View onCreateInputView() {
            super.onCreateInputView();
            keyboardView = (KeyboardView)getLayoutInflater().inflate(R.layout.keyboard, null);
            keyboard = new Keyboard(this, R.layout.qwerty_keyboard);
            keyboardView.setKeyboard(keyboard);
            keyboardView.setOnKeyboardActionListener(this);
            return keyboardView;
        }
    
        @Override
        public void onPress(int primaryCode) {
    
        }
    
        @Override
        public void onRelease(int primaryCode) {
    
        }
    
        @Override
        public void onKey(int primaryCode, int[] keyCodes) {
            InputConnection inputConnection = getCurrentInputConnection();
            playClick(primaryCode);
    
            switch (primaryCode) {
    
                case Keyboard.KEYCODE_DELETE:
                    inputConnection.deleteSurroundingText(1, 0);
                    break;
    
                case Keyboard.KEYCODE_SHIFT:
                    caps = !caps;
                    keyboard.setShifted(caps);
                    keyboardView.invalidateAllKeys();
                    break;
    
                case Keyboard.KEYCODE_DONE:
                    inputConnection.sendKeyEvent(new KeyEvent(KeyEvent.ACTION_DOWN, KeyEvent.KEYCODE_ENTER));
                    break;
    
                default:
                    char code = (char) primaryCode;
                    if (Character.isLetter(code) && caps) {
                        code = Character.toUpperCase(code);
                    }
                    inputConnection.commitText(String.valueOf(code), 1);
            }
        }
    
        @Override
        public void onText(CharSequence text) {
    
        }
    
        @Override
        public void swipeLeft() {
    
        }
    
        @Override
        public void swipeRight() {
    
        }
    
        @Override
        public void swipeDown() {
    
        }
    
        @Override
        public void swipeUp() {
    
        }
    
        // AudioManager class is used to play the sound when user pressed the keys.
        private void playClick(int keyCode) {
            AudioManager am = (AudioManager) getSystemService(AUDIO_SERVICE);
    
            switch (keyCode) {
    
                case 32:
                    am.playSoundEffect(AudioManager.FX_KEYPRESS_SPACEBAR);
                    break;
    
                case Keyboard.KEYCODE_DONE:
    
                case 10:
                    am.playSoundEffect(AudioManager.FX_KEYPRESS_RETURN);
                    break;
    
                case Keyboard.KEYCODE_DELETE:
                    am.playSoundEffect(AudioManager.FX_KEYPRESS_DELETE);
                    break;
    
                default:
                    am.playSoundEffect(AudioManager.FX_KEYPRESS_STANDARD);
            }
        }
    

 1 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: