Tuesday, June 23, 2009

How to Change Your Spinner Typeface

Pretty much every widget in Android that contains text has a setTypeface method...except for Spinners. I looked around in vain for an example or tutorial that would demonstrate how to set the typeface for text in a spinner, so I asked for help in a couple of forums. Mark Murphy replied with a proposed solution, and Philip helped explain the answer to me, so for anyone who needs to do this in an Android app and doesn't know how, hope this helps.

First, create a new XML file in your res/layout directory called "my_spinner_style.xml", and put in something like the following content:

android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="9pt"
android:singleLine="True"
android:id="@+id/spinnerTarget"
android:textColor="#000000"
android:gravity="center"/>
Then in your code, use something like this:

Spinner mySpinner = (Spinner) findViewById(R.id.my_spinner);
mySpinnerArrayAdapter = new MyCustomArrayAdapter(this, R.layout.my_spinner_style); mySpinnerArrayAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
Normally you would create a new ArrayAdapter for the second line, but in this case you need to create a custom ArrayAdapter and override the methods that get the TextView from our custom spinner style.

So, you need to put in the code for your custom ArrayAdapter, like so:
private class MyArrayAdapter extends ArrayAdapter {

public MyArrayAdapter(Context context, int textViewResourceId) {
super(context, textViewResourceId);
}

public TextView getView(int position, View convertView, ViewGroup parent) {
TextView v = (TextView) super.getView(position, convertView, parent);
v.setTypeface(myFont);
return v;
}

public TextView getDropDownView(int position, View convertView, ViewGroup parent) {
TextView v = (TextView) super.getView(position, convertView, parent);
v.setTypeface(myFont);
return v;
}

}
The font you want to use needs to reside in the assets/fonts directory, and you access it like so:
Typeface myFont = Typeface.createFromAsset(getAssets(), "fonts/myfont.ttf");
And that's pretty much it. I always appreciate it when I'm having a problem and I Google around and find in someone's blog that they've already dealt with the same issue, so I hope this helps someone.

10 comments:

  1. Thank you, very much! You helped me!

    ReplyDelete
  2. thans.....it helps me a lot..

    ReplyDelete
  3. Hey! this is cool, but the xml it is not completed...and I cant figure out exactly what is expected to be written there...

    Might be something like?

    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="wrap_content"
    android:textSize="9pt"
    android:singleLine="True"
    android:id="@+id/spinnerTarget"
    android:textColor="#000000"
    android:gravity="center">

    /LinearLayout

    ReplyDelete
  4. Ok, it is a TextView...it looks quite obvious now I finally saw it...sorry XD

    ReplyDelete
  5. Thanks for your answer.. I am trying the same with SimpleCursorAdapter.. I haven't got any clue about how to do it.. If you could could you suggest some ideas..


    Thanks

    ReplyDelete
  6. Hey I get boxes when I try to set Gujarati text on Spinner using this method.

    ReplyDelete
  7. Hi this may seem like a stupid question but how do I populate this array now?

    I used to use:

    *ArrayAdapter adapter = ArrayAdapter.createFromResource(this,
    R.array.menuString, R.layout.spinner_style);

    But now that I use:

    MyArrayAdapter mySpinnerArrayAdapter = new MyArrayAdapter(this, R.layout.cust_spinner_style);

    I'm no longer feeding in the R.array.menuString so when I run my code the spinner is empty.

    Thanks for any help

    ReplyDelete