Custom Spinner in Android Redone using BaseAdapter..

By | January 10, 2013

I have already shown another example of creating custom spinner in android in this post.
That was by extending the ArrayAdapter class, Now it’s using the baseAdapter class.

You all knew that a spinner or combobox is an inbuilt widget in android. And Like any other widgets spinners are also customizable.
Here is a simple example to customize a spinner. First we will look at the java code.
The getView method is called for each row in the spinner. So with the help of an Layout Inflater you can inflate any layout for each row.
At extreme you can have each layout for each row.

Check these older posts about spinner.

1. How to get a selected Item from a spinner in ANDROID?

2. How to set an item selected in Spinner in ANDROID?

3. How to create a custom ListView in android?
4. Customizing a spinner in android.

Check out these of ListViews

1. Simplest Lazy Loading ListView Example in Android with data populated from a MySQL database using php.

2. How to add checkboxes and radio buttons to ListView in android? OR How to set single choice items in a ListView in android?

Ok We will start.
These are the layouts.

Activity_main.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/spinner"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:drawSelectorOnTop="true"
        android:prompt="@string/prompt" />

</LinearLayout>

Now this is the layout for each row in the spinner.
row.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="3dip" >

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/company"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dip"
        android:layout_marginTop="2dip"
        android:layout_toRightOf="@+id/image"
        android:padding="3dip"
        android:text="CoderzHeaven"
        android:textColor="@drawable/red"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/sub"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/company"
        android:layout_marginLeft="5dip"
        android:layout_toRightOf="@+id/image"
        android:padding="2dip"
        android:text="Sub "
        android:textColor="@drawable/darkgrey" />

</RelativeLayout>

Now the object which we are placing in each row in the Spinner.
ListObject.java

package com.coderzheaven.customspinner;

public class ListObject {

	String company, sub;
	int image_id;

	public String getCompany() {
		return company;
	}

	public void setCompany(String company) {
		this.company = company;
	}

	public String getSub() {
		return sub;
	}

	public void setSub(String sub) {
		this.sub = sub;
	}

	public int getImage_id() {
		return image_id;
	}

	public void setImage_id(int image_id) {
		this.image_id = image_id;
	}

	public void setAll(int img_id, String title, String sub) {
		setImage_id(img_id);
		setCompany(title);
		setSub(sub);
	}
}

Now the Adapter class that creates each row for the spinner.
MyAdapter.java

package com.coderzheaven.customspinner;

import java.util.ArrayList;
import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class MyAdapter extends BaseAdapter {

	Context c;
	ArrayList<ListObject> objects;

	public MyAdapter(Context context, ArrayList<ListObject> objects) {
		super();
		this.c = context;
		this.objects = objects;
	}

	@Override
	public int getCount() {
		return objects.size();
	}

	@Override
	public Object getItem(int position) {
		return objects.get(position);
	}

	@Override
	public long getItemId(int position) {
		return 0;
	}

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

		ListObject cur_obj = objects.get(position);
		LayoutInflater inflater = ((Activity) c).getLayoutInflater();
		View row = inflater.inflate(R.layout.row, parent, false);
		TextView label = (TextView) row.findViewById(R.id.company);
		label.setText(cur_obj.getCompany());
		TextView sub = (TextView) row.findViewById(R.id.sub);
		sub.setText(cur_obj.getSub());
		ImageView icon = (ImageView) row.findViewById(R.id.image);
		icon.setImageResource(cur_obj.getImage_id());

		return row;
	}
}

Now the activity that ads the spinner and set the values.
MainActivity.java

package com.coderzheaven.customspinner;

import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.widget.Spinner;

public class MainActivity extends Activity {

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

		String[] strings = { "CoderzHeaven", "Google", "Microsoft", "Apple",
				"Yahoo", "Samsung" };
		ArrayList<ListObject> objects = new ArrayList<ListObject>();
		for (int k = 0; k < strings.length; k++) {
			ListObject obj = new ListObject();
			obj.setAll(R.drawable.ic_launcher, strings[k], "Sub title");
			objects.add(obj);
		}

		Spinner mySpinner = (Spinner) findViewById(R.id.spinner);
		mySpinner.setAdapter(new MyAdapter(this, objects));
	}

}

And at last the manifest file. You may not need it .
AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.coderzheaven.customspinner"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="15" />

    <application
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.coderzheaven.customspinner.MainActivity"
            android:label="Custom Spinner" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

2 thoughts on “Custom Spinner in Android Redone using BaseAdapter..

  1. Asim

    if i have two custom spinners can i populate second spinner based on the value in first spinner? where both spinners are using the same custom class

    Reply
    1. James Post author

      sure, no problem add the second spinner elements in the click on the first spinner.

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *