How can I style android spinner prompt

Question

I have developed one example.

Here I have to style a spinner prompt. Please help me. How can I style it?

This is my string.xml code:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="hello">Hello World, CustomizedListView!</string>
<string name="app_name">CustomizedListView</string>
<string name="status_prompt">Choose a Status</string>
</resources>

This code is used on my main.xml:

<Spinner android:id="@+id/spinner1" 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_x="106dp"
    android:layout_y="100dp"
    android:prompt="@string/status_prompt" 
    android:background="@drawable/btn_dropdown"/>

Here I wish to change the background color and textSize, textStyle on below image. How can I change this.

EDIT: I have added the below code in styles.xml

<style name="spinner_style">                        
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#040404</item>
<item name="android:typeface">monospace</item>
<item name="android:background">#FFFFFF</item>
</style>

also added below line on the main.xml for spinner:

  style="@style/spinner_style"   

But it also did not work for me. How can I style the spinner prompt message.

EDIT:

This is my java code for ArrayAdaper:

 ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
            android.R.layout.simple_spinner_item, list);
    //set the view for the Drop down list
    adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
    //set the ArrayAdapter to the spinner
    spinner.setAdapter(adapter);
    adapter.notifyDataSetChanged();
    //attach the listener to the spinner
    spinner.setOnItemSelectedListener(new MyOnItemSelectedListener());

    }

How can I set the prompt style here.

Answer 1

In order to change the prompt, you need to use a similar method to what @aswin-kumar suggested, but with a separate style for the first element of the drop down:

First, extend ArrayAdapter and call it CustomArrayAdapter: package com.example.project;

package com.example.project;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.List;


// I extend this using ArrayAdapter<String>, but you can use anything as the type
// parameter, or parameterize it as necessary.
public class CustomArrayAdapter extends ArrayAdapter<String> {

    private String title;

    public CustomArrayAdapter(Context aContext, int aTextViewResource, List<String> aOptions, String title) {
        super(aContext, aTextViewResource, aOptions);
        this.title = title;
    }

    @Override
    public View getDropDownView(int aPosition, View aConvertView, ViewGroup aParent) {

        LinearLayout v = null;

        if (aPosition == 0) {
            LayoutInflater inflater = (LayoutInflater)getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = (LinearLayout) inflater.inflate(R.layout.dropdown_header, aParent, false);
            TextView tv = (TextView) v.findViewById(R.id.dropdown_item);
            tv.setText(getItem(aPosition));
        } else {
            LayoutInflater inflater = (LayoutInflater)getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = (LinearLayout) inflater.inflate(R.layout.dropdown_item, aParent, false);
            TextView tv = (TextView) v.findViewById(R.id.dropdown_item);
            tv.setText(getItem(aPosition));
            tv.setHeight((int) (tv.getTextSize() * 2));
        }


        return v;
    }

    @Override
    public int getCount() {
        return super.getCount() + 1;
    }

    @Override
    public String getItem(int position) {
        if (position == 0) {
            return title;
        }
        return super.getItem(position - 1);
    }

    @Override
    public boolean isEnabled(int position) {
        return position != 0;
    }
}

Now, use the following layout for your dropdown_header.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/dropdown_item"
        android:textColor="@android:color/black"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="16dp"
        android:paddingBottom="16dp"
        android:paddingLeft="16dp"
        android:gravity="left|center_vertical"
        android:textSize="9pt" />

    <!-- This adds a black separator line between the title and the items. You can remove
         if you want -->
    <LinearLayout
        android:id="@+id/separator"
        android:layout_height="4dp"
        android:layout_width="match_parent"
        android:background="@android:color/black"
        android:orientation="vertical"/>
    </LinearLayout>

The form view layout file (form_view_layout.xml):

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/spinner_dialog_root"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textSize="9pt" />

The spinner layout file (spinner_layout.xml):

 <Spinner
android:id="@+id/spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="@android:color/transparent"/>

Now, attach the new adapter to your Spinner:

CustomArrayAdapter adapter = new CustomArrayAdapter(aActivity, R.layout.form_view_layout, aModel.getEnumerableOptions(), aModel.getTitle());
View parentView = aActivity.getLayoutInflater().inflate(R.layout.spinner_layout, aParent, false);

spinner = (Spinner) parentView.findViewById(R.id.spinner);
spinner.setAdapter(adapter);

Finally, add the strings you want to display to your spinner adapter, adapter, and style the appropriate files, and you should be good to go.

Answer 2

You need to create your own Adapter for the spinner which extends from ArrayAdapter. The getView() function is called when the layout system indicates that the view you've shown in pic needs to be drawn. You can override this and add textSize, textStyle, etc.

Update: a rough code sample would be:

private class MySpinnerAdapter extends ArrayAdapter<String> {
        public MySpinnerAdapter(Context context, int resource,
                int textViewResourceId, List<String> objects) {
            super(context, resource, textViewResourceId, objects);
        }

    public View getView(int position, View convertView,
            ViewGroup parent) {
        View v = super.getView(position, convertView, parent);
        // apply the style and sizes etc to the Text view from this view v
        // like ((TextView)v).setTextSize(...) etc
        return v;
    }

    public View getDropDownView(int position, View convertView,
            ViewGroup parent) {
        // this is for each of the drop down resource that is created. 
            // you can style these things too
        }
}

Use this as the Adapter for your spinner:

mySpinner.setAdapter(new MySpinnerAdapter(ActivityName.this,
                    R.layout.spinner_item,
                    R.id.spinner_item_TextView, 
                    listOfItemsInSpinner));