androidandroid-studioandroid-number-picker

How to have different color for selected and non-selected value of a number picker in android studio?


I am making a custom number picker. I want the color of selected values to be different from non selected values.

below is my XML:

   <style name="NumberPickerTheme" parent="Theme.AppCompat.Light">
    <item name="colorAccent">@android:color/white</item>
    <!-- Divider Removal. -->
    <item name="colorControlNormal">@android:color/transparent</item>
    <item name="android:textColorPrimary">@color/colorAccent</item>
    <item name="android:background">@android:color/transparent</item>
    <item name="android:textSize">40sp</item>
</style>

enter image description here


Solution

  • I tried many ways to do this on NumberPicker but it always shows one color. But you can use WheelPicker instead of NumberPicker and have selected color change options.

    Add this to your dependencies

    implementation'com.super_rabbit.wheel_picker:NumberPicker:1.0.1'
    

    And this is my code for the selected color change

    public class MainActivity extends AppCompatActivity {
    
        WheelPicker numberPicker;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            numberPicker = findViewById(R.id.numberPicker);
            numberPicker.setMin(0);
            numberPicker.setMax(20);
            numberPicker.setSelectedTextColor(R.color.colorAccent);//Selected color set
            numberPicker.setSelectorRoundedWrapPreferred(true);
        }
    }
    

    result

    You can add more color to your colors.xml and set it to the picker.