Android Development (55 Blogs) Become a Certified Professional

Android Widgets: Custom Spinner in Android

Last updated on May 22,2019 144.2K Views

Lets Take a spin on Custom Spinner in Android

In this topic of “How to Create Android Widgets” we will learn how to create a custom spinner in android. Spinners is one of the widgets in Android which allows the user to pick one item from a list of items. The items in the Spinner come from the Adapter associated.

If you are not clear with the basic concepts of Android, you can pursue this Android online training to understand each & every nuance of the technology.

Spinners provide a quick way to select one value from a set. In the default state, a spinner shows its currently selected value. Touching the spinner displays a drop-down menu with all other available values, from which the user can select a new one.

Example :  Displaying the list of days of the week and  on selecting an item it will display that item in a Toast.

1)      Declare the spinner Globally  i.e  outside the onCreate method

// Declare the variable outside onCreate
Spinner spin;

2)      Within the onCreate method : 

  • Typecasting spinner
  • Creating Data Pump
  • Declaring an ArrayAdapter
// Typecasting the variable here
spin = (Spinner) findViewById(;

// Array of Months acting as a data pump
String[] objects = { "January", "Feburary", "March", "April", "May",
"June", "July", "August", "September", "October", "November","December" };

// Declaring an Adapter and initializing it to the data pump
ArrayAdapter adapter = new ArrayAdapter(
getApplicationContext(),android.R.layout.simple_list_item_1 ,objects);

// Setting Adapter to the Spinner

// Setting OnItemClickListener to the Spinner

3) Outside the onCreate method : The callback methods that are necessary to be implemented with OnItemSelectedListener.

There are two callback methods :

  1. onItemSelected
  2. onNothingSelected
// Defining the Callback methods here
public void onItemSelected(AdapterView parent, View view, int pos,
long id) {
spin.getItemAtPosition(pos).toString(), Toast.LENGTH_LONG)

// Defining the Callback methods here
public void onNothingSelected(AdapterView arg0) {
// TODO Auto-generated method stub


2     3    4

Now you know how to implement Spinner , which is a widget in Android.

Now we will Create a Custom Spinner in Android:

So why wait, Lets see how to Implement a Custom Spinner that will display an image followed by some text as elements of the Spinner.

Take a look on what we are tending to create :

5        6

This is more like a “real and practical” Spinner.

 Steps to Create a Custom Spinner:

1)      Before  onCreate method  :

  • Declare an Array of the items that has to be displayed in the Spinner
  • Declare an Array with the resource id’s of the corresponding images that has to be displayed with the items.
// Declaring the String Array with the Text Data for the Spinners
String[] Languages = { "Select a Language", "C# Language", "HTML Language",
"XML Language", "PHP Language" };
// Declaring the Integer Array with resourse Id's of Images for the Spinners
Integer[] images = { 0, R.drawable.image_1, R.drawable.image_2,
R.drawable.image_3, R.drawable.image_4 };

2)      Inside onCreate method :

  • Typecasting spinner
  • Creating Data Pump
  • Declaring and assigning a Custom Adapter
// Declaring and typecasting a Spinner
Spinner mySpinner = (Spinner) findViewById(;

// Setting a Custom Adapter to the Spinner
mySpinner.setAdapter(new MyAdapter(MainActivity.this, R.layout.custom,

3)      After onCreate method:

  • Defining Custom Adapter i.e  MyAdapter
// Creating an Adapter Class
public class MyAdapter extends ArrayAdapter {

public MyAdapter(Context context, int textViewResourceId,
String[] objects) {
super(context, textViewResourceId, objects);

public View getCustomView(int position, View convertView,
ViewGroup parent) {

// Inflating the layout for the custom Spinner
LayoutInflater inflater = getLayoutInflater();
View layout = inflater.inflate(R.layout.custom, parent, false);

// Declaring and Typecasting the textview in the inflated layout
TextView tvLanguage = (TextView) layout

// Setting the text using the array

// Setting the color of the text
tvLanguage.setTextColor(Color.rgb(75, 180, 225));

// Declaring and Typecasting the imageView in the inflated layout
ImageView img = (ImageView) layout.findViewById(;

// Setting an image using the id's in the array

// Setting Special atrributes for 1st element
if (position == 0) {
// Removing the image view
// Setting the size of the text
// Setting the text Color


return layout;

// It gets a View that displays in the drop down popup the data at the specified position
public View getDropDownView(int position, View convertView,
ViewGroup parent) {
return getCustomView(position, convertView, parent);

// It gets a View that displays the data at the specified position
public View getView(int position, View convertView, ViewGroup parent) {
return getCustomView(position, convertView, parent);

4)      Create a XML file named as activity_mail.xml

  • It includes a Spinner
<LinearLayout xmlns:android="" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent">
    <Spinner android:drawSelectorOnTop="true" android:id="@+id/spinner1" android:layout_width="match_parent" android:layout_height="wrap_content" android:prompt="@string/select">


5)  Create a XML file named as custom.xml :

It includes

  • One Image View
  • One Text View
<LinearLayout xmlns:android="" android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="3dip">
    <ImageView android:id="@+id/imgLanguage" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_launcher">
    <TextView android:id="@+id/tvLanguage" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="10dp" android:layout_marginTop="8dp" android:text="Text Here">


[buttonleads form_title=”Download Code” redirect_url= course_id=318 button_text=”Download Code”]

Have a doubt in the discussed concepts? Please mention it in the comments section and we will get back to you.

Stay tuned for more tutorials to learn how to create Android widgets!

Related Posts:

How to create Android Widgets:Custom Toast

How to create Android Widgets: RatingBar in Android

Top 5 Android Interview Questions for freshers


Browse Categories

webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP

Subscribe to our Newsletter, and get personalized recommendations.