Spinner in Android – Implementation and Overview

Spinner in Android – Implementation and Overview

Spinner is a view that is used to provide the user with a dropdown holding list of elements. The user can then pick values from the set. By default, it will show a selected value from the list of items pre defined.

The confusion lot of people have while using the Spinners is why is it called as a spinner in the first place!!?

The answer is that, when the actual spinner was introduced, it was merely a incrementer decrementer like below.

Actual Spinner (Source:Wikipedia)
Actual Spinner (Source:Wikipedia)

This evolved but the name did not!! The one that we use today looks like this

Image result for spinner in android
Spinners in Android (Source:stackoverflow)

This is highly useful for lot of functionalities. We will see how the declaration and subsequent usages are below.

 

Spinner – Declaration

<Spinner
    android:id="@+id/spinner"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    />

This is required to create a simple drop down. The Layout will not show anything in the drop down because, we haven’t set list of items to be shown by it.

How do we set these values!

If you have read my posts here (ListView) and here (CardView ) you would have guessed it by now.

We will be needing an Adapter! We will have to use SpinnerAdapter such as ArrayAdapter.We will be adding values using this adapter to our spinners.

Spinner – Adding to the list

Let the source of data be anything (Database/Firebase or from a SharedPreference) always create a list with it.

We will be creating the activity called SpinnerActivity.java like below.

public class SpinnerActivity extends Activity implements AdapterView.OnItemSelectedListener {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.spinner);
        // Spinner Drop down elements
        List<String> listArray = new ArrayList<String>();
        listArray.add("Test1");
        listArray.add("Test2 ");
        listArray.add("Test3");



        Spinner spinner = (Spinner) findViewById(R.id.spinner); // Our element id we gave in the first step

        // Creating adapter for spinner
        ArrayAdapter<String> dataAdapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item, listArray); //simple_spinner_item denotes the layout when the drop down occurs


        dataAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);// Drop down layout style - list view with radio button


        spinner.setAdapter(dataAdapter);


        spinner.setOnItemSelectedListener(this);
    }

    @Override
    public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
        //Default Methods
        //Perform some activity when the specific item is clicked
    }

    @Override
    public void onNothingSelected(AdapterView<?> parent) {

    }
}

We have created a drop down aka our spinnar using the above code. Putting all of this together we get the below output screens.

Spinner - Dropdown bar
Dropdown bar

Final Result:

Spinner - Complete Dropdown list
Complete Dropdown list

 

This is a fairly simple way to create your spinners, you can take a look at this material design project for inspiration.

 

“Learn and Be Curious”

Leave a Comment