Spinner in Android

Hope you all have heard about drop down menu. Spinner is a widget in android which behaves in a similar manner.

In this simple tutorial I’ve discussed about how to implement a Spinner in android.

Let’s first look at the XML layout file:

<?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/spnrmonths"
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:prompt="@string/title" 
 />
</LinearLayout>

In the above xml file, android:prompt=”@string/title” attribute of the Spinner is used to display the title when the Spinner is selected. The title string is stored in the strings.xml file in res/values/ folder.

The strings.xml file is shown below:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="hello">Hello World, MySpinnerActivity!</string>
 <string name="app_name">MySpinner</string>
<string-array name="months">
<item >January</item>
 <item >February</item>
 <item >March</item>
 <item >April</item>
 <item >May</item>
 <item >June</item>
 <item >July</item>
 <item >August</item>
 <item >September</item>
 <item >October</item>
 <item >November</item>
 <item >December</item>
    </string-array>
 <string name="title">Choose a Month</string>
</resources>

Here, the <string-array> element named “months” defines the list of strings (here, name of all the months in a year) which will be displayed as a list when we click the Spinner widget.

Now, this data is provided to the Spinner through an ArrayAdapter as coded below.

ArrayAdapter<CharSequence> adapter=ArrayAdapter.createFromResource(getApplicationContext(), R.array.months, android.R.layout.simple_spinner_item);
 adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);

Now, we need to create a reference to the widget, Spinner and set the adapter.

final Spinner myspinner=(Spinner)findViewById(R.id.spnrmonths);
myspinner.setAdapter(adapter);

Next, let’s display a Toast when an item in the list displayed is selected.

How is this done? Just have a look at the code below.

myspinner.setOnItemSelectedListener(new OnItemSelectedListener() {
public void onItemSelected(AdapterView<?> arg0, View arg1,int arg2, long arg3) {
 // TODO Auto-generated method stub
 Toast.makeText(getApplicationContext(), "You selected "+(CharSequence) arg0.getItemAtPosition(arg2), Toast.LENGTH_SHORT).show();
  }
public void onNothingSelected(AdapterView<?> arg0) {
 // TODO Auto-generated method stub

 }
 });

Now, let’s look at the whole code:

package com.deepthi.myspinner;
import android.app.Activity;
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;
public class MySpinnerActivity extends Activity {
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 final Spinner myspinner=(Spinner)findViewById(R.id.spnrmonths);
 ArrayAdapter<CharSequence> adapter=ArrayAdapter.createFromResource(getApplicationContext(), R.array.months, android.R.layout.simple_spinner_item);
 adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
 myspinner.setAdapter(adapter);
 myspinner.setOnItemSelectedListener(new OnItemSelectedListener() {
public void onItemSelected(AdapterView<?> arg0, View arg1,int arg2, long arg3) {
 // TODO Auto-generated method stub
 Toast.makeText(getApplicationContext(), "You selected "+(CharSequence) arg0.getItemAtPosition(arg2), Toast.LENGTH_SHORT).show();
  }
public void onNothingSelected(AdapterView<?> arg0) {
 // TODO Auto-generated method stub
  }
 });
 }
}

This is how the Output looks:

Initially:

When Spinner is clicked:

When an Item is selected from the list:

That’s all. Hope this article was useful.:)

 

Advertisements

, , , , ,

  1. #1 by venky on March 27, 2012 - 1:11 pm

    thank for giving tutorial
    u r doing great

    could u please tell me how to change soft keyboard ?

  2. #3 by venky on March 29, 2012 - 12:39 pm

    hi deepthi….
    thank u for gave links

    any information on soft keyboard please post it

    • #4 by Deepthi G on March 29, 2012 - 12:59 pm

      Hey it’s my pleasure to help you, Venky..:) And I’ll surely post if I get much knowledge to do so… 🙂

  3. #5 by venky on March 29, 2012 - 8:14 pm

    thank u but post very soon

    • #6 by Deepthi G on March 30, 2012 - 10:23 am

      Hey Venky,
      Sure… I’ll do.. 🙂 Do Send me a mail regarding what you are looking for exactly.. 🙂

  4. #7 by venky on March 30, 2012 - 11:59 am

    Give a name like select friends ,when selected friends pressed show a list of firends and select one item from the list should show friend name in edittext.
    this data work on softkeyboard only

  5. #8 by Krishan on March 30, 2012 - 5:13 pm

    Deepthi,
    Are u a developer or hobbyist?

    – Krishan

    • #9 by Deepthi G on March 30, 2012 - 7:35 pm

      Hi Krishan,
      I’m a newbie in android,you can say,in the learning process. 🙂 Trying to share the knowledge that I gained in the journey. 🙂

      Deepthi .G

  6. #10 by karan balkar (@karanbalkar) on October 16, 2012 - 12:17 pm

    Hi Deepthi,

    I’m Karan from Mumbai. You are doing a great job by sharing your knowledge about Android with people. I happen to visit your website recently and found all the articles to be really informative and knowledgeable. I too started by own website a few weeks back : http://karanbalkar.com/ where I talk about Android and other popular open source technologies. If you don’t mind I would like to add your website to my favorite links and hope we can share our views on Android in the future!

    Thanks and all the best ! 🙂

  7. #11 by mercyveemanhnaveni on October 22, 2012 - 10:49 am

    Hi Deepthi.,

    I have to change the style for spinner prompt.how can i do????

    In your tutorial how can i change the style(TextColor,textSize & BackgroungColor) for Choose a month text.

  8. #12 by Krishna on January 27, 2013 - 11:22 am

    NICE TUTORIAL

    THANKS DEEPTHI

  9. #13 by Descargar Picsart on January 17, 2014 - 2:24 am

    Me encantó tu web. Llegué por casualidad y me ha gustado bastante.

  10. #14 by Arun on May 11, 2014 - 1:36 pm

    how to retrieve a result depending on a selected item in the spinner?

  11. #15 by mesin spinner maksindo on May 23, 2014 - 10:19 am

    magnificent submit, very informative. I wonder why the other experts of this sector don’t understand this.

    You should proceed your writing. I am sure, you’ve a huge readers’
    base already!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: