Click here to Skip to main content
15,860,943 members
Articles / Mobile Apps / Android

Android Spinner Tutorial

Rate me:
Please Sign up or sign in to vote.
4.14/5 (5 votes)
1 Nov 2016CPOL4 min read 40.7K   2   1
In this Android Spinner Tutorial, we will learn how to make an Android spinner which will allow us to select an item from a drop down menu in Android.

In this Android Spinner Tutorial, we will learn how to make an Android spinner which will allow us to select an item from a drop down menu in Android. There will be two menus, the first will be filled statically and second dynamically. The first menu will be filled when data is pre-determined in Strings.xml while the second will be filled by creating an array dynamically. On selecting an item from first menu, a toast message will be shown while on selecting second one, there will be no Toast. We will see in Android Spinner Tutorial, why there is no Toast in the second menu.

Let’s start coding our Android Spinner Tutorial:

Creating a New Project

  1. Go to File → New → New Project and enter your Application Name (We have named as Android Spinner Tutorial).
  2. Enter Company Domain, this is used to uniquely identify your App’s package worldwide.
  3. Choose project location and minimum SDK and on the next screen choose Empty Activity, since we would be adding most of the code ourselves. Then click on Next.
  4. Choose an Activity Name. Make sure Generate Layout File check box is selected, otherwise we have to generate it ourselves. Then, click on Finish. We have left Activity Name as MainActivity.
  5. Gradle will configure your project and resolve the dependencies, Once it is complete, proceed to the next steps. Make sure build.grade has the following code especially compile ‘com.android.support:appcompat-v7:23.1.1’:

Layout of Android Spinner Tutorial

Since we are making two menus, out of which first will be copied from strings.xml so make following changes:

strings.xml

XML
<resources>
    <string name="app_name">Android Spinner</string>
    <string name="action_settings">Settings</string>

    <string name="class_prompt">Choose a Class</string>

    <string-array name="student_class">
        <item>First</item>
        <item>Second</item>
        <item>Third</item>
        <item>Fourth</item>
        <item>Fifth</item>
        <item>Sixth</item>
        <item>Seventh</item>
    </string-array>
</resources>

Now, we have to make two Android spinners in layout to show two drop down menus in Android. We will name them as Spinner1 and Spinner2. Also, there will be a button for submit. On clicking this button, a Toast will appear showing the items selecting from Android menu.

content_main.xml

XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:orientation="vertical" >

    <Spinner
        android:id="@+id/spinner1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:spinnerMode="dropdown"
        android:entries="@array/student_class"
        android:prompt="@string/class_prompt" />

    <Spinner
        android:id="@+id/spinner2"
        android:layout_width="match_parent"
        android:spinnerMode="dialog"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/btnSubmit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Submit" />

</LinearLayout>

The above code is pretty much self explanatory. Now let’s start making the most important part, i.e., MainActivity.

Creating Android Adapter

To fill items in Android spinner with a list of choices, we need to create a SpinnerAdapter in MainActivity. A SpinnerAdapter is an extended Adapter that is the bridge between a Spinner and its data. Since choices are already pre-determined for the first menu, so we will just give its reference from strings.xml as done in the following code:

Java
spinner1 = (Spinner) findViewById(R.id.spinner1);  
// When we select this spinner item, a Toast message will be displayed                       
spinner1.setOnItemSelectedListener(this);

When the user selects an item from the drop-down, the Spinner object receives an on-item-selected event. To define the selection event handler for a spinner, we have implemented the AdapterView.OnItemSelectedListener interface and the corresponding onItemSelected() callback method. In the above code of Android spinner tutorial, spinner1.setOnItemSelectedListener will execute method onItemSelected whenever an item is selected from spinner1 menu and a Toast will be displayed. Choices are filled in spinner1 through content_main.xml where we are using android:entries=”@array/student_class”.

Now, we will create a second menu where items will be added during MainActivity itself. For this, we will create a separate function named CustomAddValues.

CustomAddValues

Java
// add items into spinner dynamically
public void CustomAddValues() {

    spinner2 = (Spinner) findViewById(R.id.spinner2);
    List<String> list = new ArrayList<String>();
    list.add("Eleven");
    list.add("Twelve");
    list.add("Thirteen");
    list.add("Fourteen");
    list.add("Fifteen");
    ArrayAdapter<String> dataAdapter = new ArrayAdapter<String>(this,
            android.R.layout.simple_spinner_item, list);
    dataAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    spinner2.setAdapter(dataAdapter);
}

As you could see in the above code, we are filling items in drop down menu Android through ArrayList created dynamically. After this, array is used as list to fill data in drop down menu Android. The createFromResource() method allows you to create an ArrayAdapter from the string array. The third argument for this method is a layout resource that defines how the selected choice appears in the spinner control. In our case, it is array list. The simple_spinner_item layout is provided by the platform and is the default layout you should use unless you’d like to define your own layout for the spinner’s appearance.

We called setDropDownViewResource(int) to specify the layout the adapter should use to display the list of spinner choices (simple_spinner_dropdown_item is another standard layout defined by the platform).

Call setAdapter() to apply the adapter to your Spinner.

Submitting User Choices

On submitting choices from the first and second menu, a Toast message will be displayed showing both choices from both menus. This will be covered under function addListenerOnButton().

Java
// get the selected dropdown list value                                                     
public void addListenerOnButton() {                                                         
                                                                                            
    spinner1 = (Spinner) findViewById(R.id.spinner1);                                       
    spinner2 = (Spinner) findViewById(R.id.spinner2);                                       
    btnSubmit = (Button) findViewById(R.id.btnSubmit);                                      
                                                                                            
    btnSubmit.setOnClickListener(new OnClickListener() {                                    
                                                                                            
        @Override                                                                           
        public void onClick(View v) {                                                       
                                                                                            
            Toast.makeText(MainActivity.this,                                               
                    "OnClickListener : " +                                                  
                            "\nSpinner 1 : "+ String.valueOf(spinner1.getSelectedItem()) +  
                            "\nSpinner 2 : "+ String.valueOf(spinner2.getSelectedItem()),   
                    Toast.LENGTH_SHORT).show();                                             
        }                                                                                            
    });                                                                                     
}

So we have discussed code of MainActivity.java in parts. You can refer below for the full code of MainActivity.java:

MainActivity.java

Java
package com.androidtutorialpoint.androidspinner;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.Spinner;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity 
implements AdapterView.OnItemSelectedListener {

    private Spinner spinner1, spinner2;
    private Button btnSubmit;

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

        // When we select this spinner item, a Toast message will be displayed
        spinner1 = (Spinner) findViewById(R.id.spinner1);
        spinner1.setOnItemSelectedListener(this);

        // Create an ArrayAdapter using the string array and a default spinner layout
        ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,
                R.array.student_class, android.R.layout.simple_spinner_item);
        // Specify the layout to use when the list of choices appears
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        // Apply the adapter to the spinner
        spinner1.setAdapter(adapter);

        CustomAddValues();
        addListenerOnButton();
    }

    // add items into spinner dynamically
    public void CustomAddValues() {

        spinner2 = (Spinner) findViewById(R.id.spinner2);
        List<String> list = new ArrayList<String>();
        list.add("Eleven");
        list.add("Twelve");
        list.add("Thirteen");
        list.add("Fourteen");
        list.add("Fifteen");
        ArrayAdapter<String> dataAdapter = new ArrayAdapter<String>(this,
                android.R.layout.simple_spinner_item, list);
        dataAdapter.setDropDownViewResource
        (android.R.layout.simple_spinner_dropdown_item);
        spinner2.setAdapter(dataAdapter);
    }

    // get the selected dropdown list value
    public void addListenerOnButton() {

        spinner1 = (Spinner) findViewById(R.id.spinner1);
        spinner2 = (Spinner) findViewById(R.id.spinner2);
        btnSubmit = (Button) findViewById(R.id.btnSubmit);

        btnSubmit.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {

                Toast.makeText(MainActivity.this,
                        "OnClickListener : " +
                                "\nSpinner 1 : "+ 
                                String.valueOf(spinner1.getSelectedItem()) +
                                "\nSpinner 2 : "+ 
                                String.valueOf(spinner2.getSelectedItem()),
                        Toast.LENGTH_SHORT).show();
            }
        });
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onItemSelected
    (AdapterView<?> parent, View view, int position, long id) {

        Toast.makeText(parent.getContext(),
                "OnItemSelectedListener : " + 
                parent.getItemAtPosition(position).toString(),
                Toast.LENGTH_SHORT).show();
    }

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

Now run this code. You will be able to see the following screen:

Android Spinner Tutorial

Select the options and Submit. A Toast message will be displayed as shown below:

Android Spinner Tutorial

So our code of Android Spinner Tutorial is complete. You can see a demo of this tutorial in the video given at the start of the tutorial.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
India India
Hello Developer!

As a co-founder, I would like to welcome you to the Android Tutorial Point community!. I hope you get the best possible value at of our platform. Stick with us for a while, and we promise you will become an $$Android Rockstar$$!

Android Tutorial Point is the right platform if you want to learn about android development. We have a broad collection of tutorials on different aspects of Android Development and it is growing rapidly. Here at Android Tutorial Point we thrive to deliver the best tutorials. In this direction, we are trying to create a community that will cater to your needs, whether you are a beginner or a seasoned veteran. For the beginners that are getting started on Android Development
journey, we would suggest you to begin with our Android Basics Tutorial available at http://www.androidtutorialpoint.com/category/basics/ . Here, we feature articles on how to start with Android programming.


All the best from the Android Tutorial Point team. Don't forget to subscribe our blog for latest android tutorials. You can reach out to us at our Facebook page https://www.facebook.com/androidtutorialpoint/ or Add us on Twitter https://twitter.com/androidtutpoint/ . Any ideas or suggestions? Shoot us an email at androidtutorialspoint@gmail.com

Comments and Discussions

 
Generalmultiple spinner Pin
nnimal25-Dec-18 3:48
nnimal25-Dec-18 3:48 
Question;) Pin
gosia0214-Nov-16 9:07
gosia0214-Nov-16 9:07 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.