Prior to developing Android apps, I used a lot of drop-down lists when building user interfaces. Drop-downs provide a way to limit the user’s choices to a list selection, without eating up all the screen real estate that a traditional list view would consume.

When I built my first Android app, I was shocked to discover there wasn’t a drop-down list widget. A quick Google search corrected my vernacular. For whatever reason, the architects of the Android SDK chose to rename what I knew as a drop-down list to a spinner. Whew.

However, my relief didn’t last long. The first time I added a drop-down, I mean spinner, to one of my layouts, I was horrified at the eyesore that appeared on my emulator (Figure A).

Figure A

As a result I decided to go the list view route — but that was five years ago. So several weeks ago when I caught myself implementing a list view when what really made the most sense was a spinner, I decided to see how far things have come. The answer was a long way.

The tutorial that follows is a very simple re-introduction to Android’s spinner widget. Feel free to follow along or import the entire project directly into Eclipse.

1. Create a new project in Eclipse targeting Android 4.0 (ICS) or better.

2. In the /res/layout folder, modify the activity_main.xml file to include a spinner widget wrapped by a linear layout.

activity_main.xml

3. Modify MainActivity.java in the /src folder. The code is very typical of working with Android widgets. Find the resource, assign it some value, and wire up a listener for responding to changes.

package com.authorwjf.spinnerdemo;

import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;
import android.app.Activity;

public class MainActivity extends Activity implements OnItemSelectedListener {

private String[] colors = {"Red", "Orange", "Yellow", "Green", "Blue", "Indigo", "Violet"};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_spinner_item, colors);
Spinner spinner = (Spinner) findViewById(R.id.spinner_widget);
adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
spinner.setAdapter(adapter);
spinner.setOnItemSelectedListener(this);
}

@Override
public void onItemSelected(AdapterView parent, View view, int pos, long id) {
Toast.makeText(this, "Selection: "+colors[pos], Toast.LENGTH_SHORT).show();
}

@Override
public void onNothingSelected(AdapterView parent) {
Toast.makeText(this, "Selections cleared.", Toast.LENGTH_SHORT).show();
}

}

Here is a look at the latest and vastly improved out-of-the box user experience provided by the spinner widget (Figure B).

Figure B

A question I often get asked by developers new to the platform is: When should one use a list activity for a selection, and when is a spinner the appropriate choice? As a rule of thumb I like to think in terms of navigation. If selecting an item will force the user to a new activity or fragment, then generally I go with a list activity; if not, I think a spinner is a better choice — the caveat being if you can get away with only supporting Honeycomb or better. If you must support older versions of Android, then I say do what you must to avoid the offensive original spinner user experience.