how to change numberpicker to show plus and minus buttons

Question

I have a numberpicker -

 <NumberPicker
                android:id="@+id/shopping_cart_holder_quantity_picker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:fontFamily="@font/noto_sans"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.5"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

I am trying to implement a numberpicker like the following picture -

Yeah, this is in iOS. I was wondering how can I implement the same thing in Android.

Answer 1

You can achieve this effect by simply using a android library. I would suggest this one.

Just add following lines to your gradle file:

compile 'com.github.travijuu:numberpicker:1.0.7'

Then you can implement the number picker in your .xml file like this:

<com.travijuu.numberpicker.library.NumberPicker
    android:id="@+id/number_picker"
    android:layout_width="130dp"
    android:layout_height="40dp"
    numberpicker:min="0"
    numberpicker:max="10"
    numberpicker:value="-5"
    numberpicker:unit="1"
    numberpicker:focusable="false"
    numberpicker:custom_layout="@layout/number_picker_custom_layout" />

You can customize your picker like this:

    NumberPicker numberPicker = (NumberPicker) findViewById(R.id.number_picker);
    numberPicker.setMax(15);
    numberPicker.setMin(5);
    numberPicker.setUnit(2);
    numberPicker.setValue(10);