Question

I try to create a Spinner for choosing a color. The color should display in the Spinner-header. Here is a screenshot:

But as you can see, the color don’t fill my 9-patch Spinner background (header). Here is the 9-patch background:

But I don’t understand why…
I implemented a custom ArrayAdapter, here is the code:

spinner = (Spinner) findViewById(R.id.spinner);
ArrayAdapter<String> adapter = new MyArrayAdapter(this, R.layout.spinner_row, R.id.textView1, items);
spinner.setAdapter(adapter);

private class MyArrayAdapter extends ArrayAdapter<String>{

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

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

    @Override
    public View getDropDownView(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.spinner_row, parent, false);
        View v = (View) row.findViewById(R.id.spinnerFrame);
        v.setBackgroundColor(getColor(position));
        return row;
    }

    public View getCustomViewSmall(int position, View convertView, ViewGroup parent) {
        LayoutInflater inflater = getLayoutInflater();
        View row = inflater.inflate(R.layout.spinner_row_small, parent, false);     
        row.setBackgroundColor(getColor(position));    
        return row;
    }

    private int getColor(int pos) {
        switch(pos) { 
        case 0:
            return colors[0]; // Blue
        case 1:
            return colors[1];  // Purple
        case 2:
            return colors[2];  // Orange
        case 3:
            return colors[3];  // Yellow
        case 4:
            return colors[4];  // Cyan
        }
        return colors[5];
    }
}

And here is the code of the layout:
The spinner_row_small.xml (that is the layout for the header):

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/spinnerFrameSmall"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center" >

<TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

</FrameLayout>

The spinner_row.xml (the layout for the rows):

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/FrameLayout1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="center"
android:background="@color/white" >

<FrameLayout
    android:id="@+id/spinnerFrame"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:layout_marginBottom="1dp"
    android:layout_marginTop="1dp" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />
</FrameLayout>
</FrameLayout>

And the main.xml:

        <Spinner
            android:id="@+id/spinner"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/textview"
            android:spinnerMode="dropdown"      
            android:popupBackground="@drawable/spinner_background"        
            android:layout_marginBottom="30dp" />

I would be very pleased if anybody can help my.
Best regards!

Answer 1

I don’t see anything wrong in your code but problem with nine patch image is that, only marked space will get enlarged and you will only get the marked space of image in real use. That is why you are getting space on all sides(which is left unmarked). I think nine patch images are useful for simple backgrounds without much color complexity.