Saturday, 21 April 2012

Custom Spinners







Refer to the exercise "HelloAndroid with Spinner", it's a basic spinner with default format to display simple text in the spinner. Current exercise is modified to have custom display with icon in the spinner, actually it is Spinner version of another exercise "ListView, with icon".






-------------------------------------------------------------Code------------------------------------------------------------------------



package com.kiran;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.Spinner;
import android.widget.TextView;

public class CustomSpinnerDemoActivity extends Activity {
String[] strings = {"CoderzHeaven","Google",
"Microsoft", "Apple", "Yahoo","Samsung"};

String[] subs = {"Heaven of all working codes ","Google sub",
"Microsoft sub", "Apple sub", "Yahoo sub","Samsung sub"};

int arr_images[] = { R.drawable.coderzheaven,
R.drawable.google, R.drawable.microsoft,
R.drawable.apple, R.drawable.yahoo, R.drawable.samsung};
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        Spinner mySpinner = (Spinner)findViewById(R.id.spinner1);
        mySpinner.setAdapter(new MyAdapter(CustomSpinnerDemoActivity.this, R.layout.row, strings));
    }

    public class MyAdapter extends ArrayAdapter<String>{

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

    @Override
    public View getDropDownView(int position, View convertView,ViewGroup parent) {
    return getCustomView(position, convertView, parent);
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
    return getCustomView(position, convertView, parent);
    }

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

    LayoutInflater inflater=getLayoutInflater();
    View row=inflater.inflate(R.layout.row, parent, false);
    TextView label=(TextView)row.findViewById(R.id.company);
    label.setText(strings[position]);

    TextView sub=(TextView)row.findViewById(R.id.sub);
    sub.setText(subs[position]);

    ImageView icon=(ImageView)row.findViewById(R.id.image);
    icon.setImageResource(arr_images[position]);

    return row;
    }
    }
   }

---------------------------------------------------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" >


    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />


    <Spinner
        android:id="@+id/spinner1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />


</LinearLayout>


-------------------------------------------------------------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" />


    <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: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="Heaven of all working codes" />


</RelativeLayout>