Change the Text Size in an Android Spinner

Why Using android:textSize on Spinner Does Not Work

The article Load Values into an Android Spinner showed how a Spinner is set up. It was stated in the article that the Spinner definition in the layout file does not define the View that the data being displayed uses. That is assigned when the Adapter that links the data to the Spinner is created. The previous article used the existing Android simple_spinner_item as the View for the data items. This means trying to change the size of the text being displayed with android:textSize or android:textAppearance attributes on the Spinner definition is a no go. This definition in a layout file will not show the text any bigger than default:

[code lang=”xml”]<Spinner android:id="@+id/contextChooser"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:prompt="@string/context_choice"
android:textSize="22sp"/>[/code]

Maybe a Custom Layout?

One solution is to pass in a custom layout instead of using an Android default layout. For example create a new Android XML file in the res/layout folder called my_spinner.xml and add the code for a TextView (for tips on copy from the code boxes see Copying Code from the Articles):

[code lang=”xml”]<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:singleLine="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="22sp"/>[/code]

Pass the new layout to the ArrayAdapter creation (the id has to be text1 for the Adapter to use the View):

[code lang=”Java”]ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this, R.array.context_names, R.layout.my_spinner);[/code]

Bigger Text in an Android SpinnerThe text in the Spinner is now larger, but the default styling has been lost. This could be solved by assigning colors to the TextView, however, this would remove the Spinner styling from any theme that is being used on the device. Fortunately by using the Android feature that allows for the styling on Views to inherit from existing styles it is possible to get the Spinner back to the default theme but with the text size increase.

Extend the Default Theme

To achieve this first create a new XML file in the res/values folder, give it a name, here it is called my_style.xml, the name is not important as long as a file of the same name does not exist. In the file a style element is defined, here named MySpinnerLook. The style will inherit from an existing Android style. These can be viewed in the file styles.xml for the given platform, located in platforms/android-X/data/res/values where the android-sdk folder resides, with X being the API level of the platform being used. In styles.xml is found the Widget.TextView.SpinnerItem style. This is assigned to the parent attribute of the MySpinnerLook style (prefixing with @android:style/ or just @android:). The TextSize attribute is moved from the TextView layout file into this new style file. The my_style.xml file will have this code:

[code lang=”xml”]<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MySpinnerLook" parent="@android:TextAppearance.Widget.TextView.SpinnerItem">
<item name="android:textSize">22sp</item>
</style>
</resources>[/code]

With the my_spinner.xml file no longer having the TextSize attribute the link to the new style file is with a style attribute pointing to MySpinnerLook like this:

[code lang=”xml”]<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:singleLine="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@style/MySpinnerLook"/>[/code]

In summary to change the text size for a Spinner either:

  • Create a custom TextView layout.
  • Change the text size with the android:textSize attribute.
  • Change the text color with android:textColor.

Or:

  • Create a custom style.
  • Use android:TextAppearance.Widget.TextView.SpinnerItem as the parent style.
  • Change the text size with the android:textSize attribute.

An Android Spinner with Bigger Text

Hello Holo

When Google released Android 3.0 (API Level 11) it heralded change of default theme, the new Holo theme was introduced. In Holo the Spinner style is Holo.Widget.TextView.SpinnerItem. However in our example above we are saying that the parent is Widget.TextView.SpinnerItem. The link to our new style has been broken, but not for long. For devices running API 11 or later we can create a res/values-v11 folder, copy my_style.xml into this folder then change the parent attribute to point to the new Holo theme:

[code lang=”xml”]<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MySpinnerLook" parent="@android:TextAppearance.Holo.Widget.TextView.SpinnerItem">
<item name="android:textSize">22sp</item>
</style>
</resources>[/code]

Load Values into an Android Spinner

Android Spinner DemoThis article takes a look at adding string items to the Android Spinner. The Spinner View is useful when you want the user to pick an item from a predetermined list but do not want to take up a lot of screen space, for example by using several radio buttons. Programmers moving to Android from other environments will notice a difference in terminology. The Android Spinner behaves in a similar fashion to what some may call a drop down list, whilst a spinner on other platforms is closer to the Android NumberPicker as seen when setting an alarm on an Android device. The NumberPicker is not directly available to use from the SDK, although open source versions are available, see https://github.com/mrn/numberpicker.

Programmers coding with the Android SDK soon come across a familiar pattern when designing the user interface. There are Views that go on the screens, the data that needs to be displayed in those Views and the code that links the two together. For some Views and types of data the code that links them together is provided by an Adapter. In this example the data is an array of strings, the View is obviously the Spinner, and an ArrayAdapter is the link. The array of strings is defined in a values file in the res/values folder. The Spinner is added to a layout file in the res/layout folder. Both could be done in code but it is recommended for ease of maintenance that strings and layouts be defined separately. The following tutorial adds a Spinner to a screen in a new Eclipse project. Continue reading