Android: Add imageButton on top of a custom keyboard

Question

I have succesfully implemented a custom keyboard. It is working as it should. I want add an imageButton on the top of the keyboard as shown in below image so that it always shows above the keyboard whenever keyboard pops up. Can anyone guide me how can I add this image button to my custom keyboard?

Below is the code for the keyboard if anybody would like to see.

Keyboard.xml The layout of the keyboard

<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/preview"
/>

The keyPreviewLayout is the layout of the short-lived pop-up that shows up whenever a key on the keyboard is pressed.

qwerty.xml

<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
    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"/>
<!--And so on for all the keys-->

SimpleIME.java This is the service class for the keyboard

public class SimpleIME extends InputMethodService
        implements KeyboardView.OnKeyboardActionListener {

    private KeyboardView kv;
    private Keyboard keyboard;

    private boolean caps = false;

    @Override
    public View onCreateInputView() {
        kv = (KeyboardView)getLayoutInflater().inflate(R.layout.keyboard, null);
        keyboard = new Keyboard(this, R.xml.qwerty);
        kv.setKeyboard(keyboard);
        kv.setOnKeyboardActionListener(this);
        return kv;
    }

    @Override
    public void onKey(int primaryCode, int[] keyCodes) {
        InputConnection ic = getCurrentInputConnection();
//        playClick(primaryCode);
        switch(primaryCode){
            case Keyboard.KEYCODE_DELETE :
                ic.deleteSurroundingText(1, 0);
                break;
            case Keyboard.KEYCODE_SHIFT:
                caps = !caps;
                keyboard.setShifted(caps);
                kv.invalidateAllKeys();
                break;
            case Keyboard.KEYCODE_DONE:
                ic.sendKeyEvent(new KeyEvent(KeyEvent.ACTION_DOWN, KeyEvent.KEYCODE_ENTER));
                break;
            default:
                char code = (char)primaryCode;
                if(Character.isLetter(code) && caps){
                    code = Character.toUpperCase(code);
                }
                ic.commitText(String.valueOf(code),1);
        }
    }

Place a comment if you vote down.

@ user5596252 Did you find any solution for this, if yes please help me — Ashish Agrawal, Apr 01 '19 at 13:09

Prasad Pawar · Answer 1 · 2015-12-14T07:37:55.293

Sure!

1) change keyboard.xml as below:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >

        <ImageView
            android:id="@+id/ivKeyboard"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:layout_alignParentLeft="true"
            android:padding="10dp"
            android:scaleType="fitEnd"
            android:src="@drawable/keyboard_icon" />

    </RelativeLayout>

    <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/preview"
    />

</LinearLayout>

2) In SimpleIME.java make a few changes:

@Override 
public View onCreateInputView() {

    final View root = getLayoutInflater().inflate(R.layout.idee_keyboard_layout, null);

    ImageView ivKeyboard = (ImageView) root.findViewById(R.id.ivRevertKeyboard);

    ivKeyboard.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            //whatever you want to do...
        }
    });

    kv = (KeyboardView) root.findViewById(R.id.keyboard);

    keyboard = new Keyboard(this, R.xml.qwerty);
    kv.setKeyboard(keyboard);
    kv.setOnKeyboardActionListener(this);
    return root;
}

Done.

I tried with solution but did not work getting below error Process: com.mykeyboard, PID: 16969 java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first. at android.view.ViewGroup.addViewInner(ViewGroup.java:4915) — Ashish Agrawal, Apr 01 '19 at 13:08
@AshishAgrawal Open a new SO question with your code snippet and provide me the link. The issue you are referring to is about something else entirely. — Prasad Pawar, Apr 01 '19 at 13:38

Android: Add imageButton on top of a custom keyboard

1 Answers1