Logo Icon Logo
A Crowd-sourced Cookbook on Writing Great Android® Apps
GitHub logo Twitter logo OReilly Book Cover Art
Changing the Enter Key to "Next" on the Soft KeyboardBack to Android Cookbook Home | Up to Chapter: Graphical User Interface

Author: Jonathan Fuerth ('jfuerth')
In Published Edition? Yes
FormatLanguage: WikiFormat

Changing the Enter Key to "Next" on the Soft Keyboard

Problem

Several apps, including the Web Browser and the Contacts app, replace the "Enter" key on the on-screen keyboard with a "Next" key that gives focus to the next data entry view. How do you add this kind of polish to your own apps?

Solution

Set the appropriate Input Method Editor (IME) attribute on the views in question.

Discussion

Here is a simple layout with three text fields (EditText views) and a submit button:

Note the enter key in the bottom right. Pressing it causes the currently-focused text field to expand vertically to accommodate another line of text. Not what you normally want!

Here is the code for that layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
<EditText
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 1" />
<EditText  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 2" />
<EditText  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 3" />
<Button
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal" 
    android:text="Submit" />
</LinearLayout>

Here's a better version of the same UI, with a Next key where Enter used to be:

Besides being more convenient for users, this also prevents people from entering multiple lines of text into a field that was only intended to hold a single line.

Here's how to tell Android to display a Next button on your keyboard. Note the android:imeOptions attributes on each of the three EditText views:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
<EditText
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 1"
    android:imeOptions="actionNext" />
<EditText  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 2"
    android:imeOptions="actionNext" />
<EditText  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="Field 3"
    android:imeOptions="actionDone" />
<Button
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal" 
    android:text="Submit" />
</LinearLayout>

Finally, notice the actionDone on the third text field: the button that follows is not focusable in touch mode, and if it was, it wouldn't display a keyboard anyway. As you might guess, actionDone puts a Done button where the enter key normally goes. Pressing the Done button simply hides the keyboard.

There are a number of refinements you can make to the appearance of the software keyboard, including hints about the input type, suggested capitalization, and even select-all-on-focus behaviour. They are all worth investigating. Every little touch can make your app more of a pleasure to use.

See Also

The Android API documentation from TextView, especially the section on ImeOptions.