Change TimePicker text color

I have combined Paul Burke's Answer and Simon's Answer to succesfully edit the text colour of the TimePicker.

Here's how it is accomplished:

TimePicker time_picker; //Instantiated in onCreate()
Resources system;

private void set_timepicker_text_colour(){
    system = Resources.getSystem();
    int hour_numberpicker_id = system.getIdentifier("hour", "id", "android");
    int minute_numberpicker_id = system.getIdentifier("minute", "id", "android");
    int ampm_numberpicker_id = system.getIdentifier("amPm", "id", "android");

    NumberPicker hour_numberpicker = (NumberPicker) time_picker.findViewById(hour_numberpicker_id);
    NumberPicker minute_numberpicker = (NumberPicker) time_picker.findViewById(minute_numberpicker_id);
    NumberPicker ampm_numberpicker = (NumberPicker) time_picker.findViewById(ampm_numberpicker_id);

    set_numberpicker_text_colour(hour_numberpicker);
    set_numberpicker_text_colour(minute_numberpicker);
    set_numberpicker_text_colour(ampm_numberpicker);
}

private void set_numberpicker_text_colour(NumberPicker number_picker){
    final int count = number_picker.getChildCount();
    final int color = getResources().getColor(R.color.text);

    for(int i = 0; i < count; i++){
        View child = number_picker.getChildAt(i);

        try{
            Field wheelpaint_field = number_picker.getClass().getDeclaredField("mSelectorWheelPaint");
            wheelpaint_field.setAccessible(true);

            ((Paint)wheelpaint_field.get(number_picker)).setColor(color);
            ((EditText)child).setTextColor(color);
            number_picker.invalidate();
        }
        catch(NoSuchFieldException e){
            Log.w("setNumberPickerTextColor", e);
        }
        catch(IllegalAccessException e){
            Log.w("setNumberPickerTextColor", e);
        }
        catch(IllegalArgumentException e){
            Log.w("setNumberPickerTextColor", e);
        }
    }
}

Please note that this answer might be outdated by now. I ran into this a while ago with something that might have been buggy (see my question for more details). Otherwise you should probably follow Vikram's answer.


A TimePicker is really just two NumberPickers. Looking into the Widget.NumberPicker style and layout, you'll find the it uses

@style/TextAppearance.Large.Inverse.NumberPickerInputText

Unfortunately, TextAppearance.Large.Inverse.NumberPickerInputText doesn't use one of the attributes that you can set in your theme. So you have two options:

  1. Copy the necessary classes to make your own version of NumberPicker and TimePicker. (You might be able to extract something from libraries like HoloEverywhere)

  2. Use hacks.

If you want to go the second route, you can do this:

private int mNumberPickerInputId = 0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    Resources system = Resources.getSystem();

    // This is the internal id of the EditText used in NumberPicker (hack)
    mNumberPickerInputId = 
        system.getIdentifier("numberpicker_input", "id", "android");

    // just used for full example, use your TimePicker
    TimePicker timePicker = new TimePicker(this);
    setContentView(timePicker);

    final int hourSpinnerId = 
        system.getIdentifier("hour", "id", "android");
    View hourSpinner = timePicker.findViewById(hourSpinnerId);
    if (hourSpinner != null) {
        setNumberPickerTextColor(hourSpinner, Color.BLUE);
    }

    final int minSpinnerId = 
        system.getIdentifier("minute", "id", "android");
    View minSpinner = timePicker.findViewById(minSpinnerId);
    if (minSpinner != null) {
        setNumberPickerTextColor(minSpinner, Color.BLUE);
    }

    final int amPmSpinnerId = 
        system.getIdentifier("amPm", "id", "android");
    View amPmSpinner = timePicker.findViewById(amPmSpinnerId);
    if (amPmSpinner != null) {
        setNumberPickerTextColor(amPmSpinner, Color.BLUE);
    }
}

private void setNumberPickerTextColor(View spinner, int color) {
    TextView input = (TextView) spinner.findViewById(mNumberPickerInputId);
    input.setTextColor(color);
}

EDIT

Upon further investigation, this hack doesn't really work well. It won't allow you to change the color of the NumberPicker above/below values. The color also resets after the use interacts with it. It seems that your only option will be to create your own copies of the necessary classes (option #1 above).


Not sure why you would need to dive into Java Reflection API for this. Its a simple styling matter. The attribute that you need to override is: textColorPrimary.

<style name="AppTheme" parent="@android:style/Theme.Holo.Light">
    ....
    <item name="android:textColorPrimary">#ff0000</item>
</style>

If you're using the TimePicker inside a Dialog, override android:textColorPrimary in the dialog's theme.

That's about it.

Tags:

Xml

Android