user2797209
user2797209

Reputation: 31

How To Open Android Keypad to AlphaNumeric with Numbers on Top?

I am trying to find the appropriate input method to get an android application to open up to the keypad which has the numbers at the top and alpha at the bottom. We are entering registration numbers which typically begin with a numeric value but are then followed by an alpha portion so it would be great if it would open to number first.

I have tried android:inputType="Number" and android:inputType="Text"

Upvotes: 3

Views: 3497

Answers (2)

Ivan Kušt
Ivan Kušt

Reputation: 296

Check out this tutorial: http://www.fampennings.nl/maarten/android/09keyboard/index.htm

It shows you step by step, how to create a custom keyboard with the desired layout. It might not be the most elegant solution, but it gives you full control and allows you to create a keyboard that will have the same layout on all devices.

EDIT: Short summary of the tutorial.

  1. Create a new folder named "xml" in your "res" folder.
  2. Create a new .xml file in that folder, name it e.g. "alphanumkbd.xml". That file will contain the layout for the keyboard. You can check Keyboard class documentation for reference.
  3. Paste the following contents in the .xml file (copied from the example):
<?xml version="1.0" encoding="utf-8"?>
<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
      android:keyWidth="12.50%p"
      android:keyHeight="10%p" >
    <Row>
        <Key android:codes="55"    android:keyLabel="7" android:keyEdgeFlags="left" />
        <Key android:codes="56"    android:keyLabel="8" />
        <Key android:codes="57"    android:keyLabel="9" />
        <Key android:codes="65"    android:keyLabel="A" android:horizontalGap="6.25%p" />
        <Key android:codes="66"    android:keyLabel="B" />
        <Key android:codes="-5"    android:keyIcon="@android:drawable/ic_delete" android:isRepeatable="true" android:horizontalGap="6.25%p" />
        <Key android:codes="55006" android:keyLabel="CLR" android:keyEdgeFlags="right"/>
    </Row>
    <Row>
        <Key android:codes="52"    android:keyLabel="4" android:keyEdgeFlags="left"  />
        <Key android:codes="53"    android:keyLabel="5" />
        <Key android:codes="54"    android:keyLabel="6" />
        <Key android:codes="67"    android:keyLabel="C" android:horizontalGap="6.25%p" />
        <Key android:codes="68"    android:keyLabel="D" />
    </Row>
    <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="69"    android:keyLabel="E" android:horizontalGap="6.25%p" />
        <Key android:codes="70"    android:keyLabel="F" />
    </Row>
    <Row>
        <Key android:codes="48"    android:keyLabel="0" android:keyWidth="25%p" android:horizontalGap="6.25%p" android:keyEdgeFlags="left" />
        <Key android:codes="-3"    android:keyLabel="DONE" android:keyWidth="25%p" android:horizontalGap="12.50%p" />
        <Key android:codes="55000" android:keyLabel="PREV" android:horizontalGap="6.25%p" />
        <Key android:codes="55005" android:keyLabel="NEXT" android:keyEdgeFlags="right" />
    </Row>
</Keyboard>
  1. In your activity add an EditText and KeyboardView (again copied from the example):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

    <EditText
        android:id="@+id/edittext0"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:inputType="text" />

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

</RelativeLayout>
  1. In your activity in onCreate() method use the following code to initialize the keyboard:
@Override protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Create the Keyboard
    Keyboard mKeyboard= new Keyboard(MainActivity.this ,R.xml.alphanumkbd);

    // Lookup the KeyboardView

    mKeyboardView = (KeyboardView) findViewById(R.id.keyboardview);
    // Attach the alphanumkbd to the view
    mKeyboardView.setKeyboard(mKeyboard);

    // Do not show the preview balloons
    mKeyboardView.setPreviewEnabled(false);

    // Install the key handler
    mKeyboardView.setOnKeyboardActionListener(mOnKeyboardActionListener);

    // Hide the standard keyboard initially
    getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);

    // Find the EditText
    EditText edittext= (EditText)findViewById(R.id.edittext0);

    //Make the custom keyboard appear
    edittext.setOnFocusChangeListener(new View.OnFocusChangeListener() {
        @Override public void onFocusChange(View v, boolean hasFocus) {
            if( hasFocus ) showCustomKeyboard(v); else hideCustomKeyboard();
        }
    });

    edittext.setOnClickListener(new View.OnClickListener() {
        @Override public void onClick(View v) {
            showCustomKeyboard(v);
        }
    });


    edittext.setOnTouchListener(new View.OnTouchListener() {
        @Override public boolean onTouch(View v, MotionEvent event) {
            EditText edittext = (EditText) v;
            int inType = edittext.getInputType();       // Backup the input type
            edittext.setInputType(InputType.TYPE_NULL); // Disable standard keyboard
            edittext.onTouchEvent(event);               // Call native handler
            edittext.setInputType(inType);              // Restore input type
            return true; // Consume touch event
        }
    });
}

Utility methods:

public void hideCustomKeyboard() {
    mKeyboardView.setVisibility(View.GONE);
    mKeyboardView.setEnabled(false);
}

public void showCustomKeyboard( View v ) {
    mKeyboardView.setVisibility(View.VISIBLE);
    mKeyboardView.setEnabled(true);
    if( v!=null ) ((InputMethodManager)getSystemService(Activity.INPUT_METHOD_SERVICE)).hideSoftInputFromWindow(v.getWindowToken(), 0);
}

public boolean isCustomKeyboardVisible() {
    return mKeyboardView.getVisibility() == View.VISIBLE;
}

Variable mOnKeyboardActionListener is the implementation of KeyboardView.OnKeyboardActionListener. You'll need to implement the onKey() method, for example:

public final static int CodeDelete   = -5; // Keyboard.KEYCODE_DELETE
public final static int CodeCancel   = -3; // Keyboard.KEYCODE_CANCEL
public final static int CodeAllLeft  = 55001;
public final static int CodeLeft     = 55002;
public final static int CodeRight    = 55003;
public final static int CodeAllRight = 55004;
public final static int CodeClear    = 55006;

private KeyboardView.OnKeyboardActionListener mOnKeyboardActionListener = new KeyboardView.OnKeyboardActionListener() {
    @Override public void onPress(int primaryCode) {

    }

    @Override public void onRelease(int primaryCode) {

    }

    @Override public void onKey(int primaryCode, int[] keyCodes) {

        // Get the EditText and its Editable
        View focusCurrent = MainActivity.this.getWindow().getCurrentFocus();
        if( focusCurrent==null || focusCurrent.getClass()!=EditText.class ) return;
        EditText edittext = (EditText) focusCurrent;
        Editable editable = edittext.getText();
        int start = edittext.getSelectionStart();
        // Handle key
        if( primaryCode==CodeCancel ) {
            hideCustomKeyboard();
        } else if( primaryCode==CodeDelete ) {
            if( editable!=null && start>0 ) editable.delete(start - 1, start);
        } else if( primaryCode==CodeClear ) {
            if( editable!=null ) editable.clear();
        } else if( primaryCode==CodeLeft ) {
            if( start>0 ) edittext.setSelection(start - 1);
        } else if( primaryCode==CodeRight ) {
            if (start < edittext.length()) edittext.setSelection(start + 1);
        } else if( primaryCode==CodeAllLeft ) {
            edittext.setSelection(0);
        } else if( primaryCode==CodeAllRight ) {
            edittext.setSelection(edittext.length());
        } else {// Insert character
            editable.insert(start, Character.toString((char) primaryCode));
        }
    }

    @Override public void onText(CharSequence text) {

    }

    @Override public void swipeLeft() {

    }

    @Override public void swipeRight() {

    }

    @Override public void swipeDown() {

    }

    @Override public void swipeUp() {

    }
};

As you can notice, the first int argument passed to the onKey() method corresponds to the android:codes value that you specified for the key in the alphanumkbd.xml.

  1. Implement the onBackPressed() method to hide custom keyboard if shown.
@Override public void onBackPressed() {
    if( isCustomKeyboardVisible() ) hideCustomKeyboard(); else this.finish();
}

That's all there is to it, this should give you a working example.

Upvotes: 1

Nitesh
Nitesh

Reputation: 3903

Hey what you are looking is completely device dependent thing. this cant be achieved by code. In some devices it will be like exactly what you want and in other user has to click on the small numbered key from keyboard to toggle between digits and characters.

Upvotes: 0

Related Questions