CODEWITHSUNDEEP
androidandroid-number-picker
comalex3
comalex3

Reputation: 2606

How to decrease padding in NumberPicker

How to decrease padding in NumberPicker

enter image description here

I want something like it:

enter image description here

Upvotes: 26

Views: 13442

Answers (6)

Zubair Akber
Zubair Akber

Reputation: 2828

A simple solution is to decrease the height of the NumberPicker that will result in decrease of internal spacing between the numbers as well, in my case I have set it to 120dp and that just does the job

android:layout_height="120dp"

Here is the complete code for my NumberPicker

<NumberPicker
    android:id="@+id/numberPicker"
    android:layout_width="wrap_content"
    android:layout_height="120dp"
    android:layout_marginEnd="16dp"
    android:theme="@style/myNumberPicker" />

For styling I have used the following theme in my style file

<!-- Custom style for Number Picker -->
<style name="myNumberPicker" parent="Theme.MyApplication">
    <item name="android:textSize">26sp</item>
    <item name="android:textColorPrimary">@color/textColorBlue</item>
    <item name="colorControlNormal">@android:color/transparent</item>
    <item name="android:fontFamily">@font/montserrat_semi_bold</item>
</style>

Upvotes: 1

Bakhshi
Bakhshi

Reputation: 1339

This is probably a bit late but you can set the explicit height on the NumberPicker it then follows the given height and adjusts the space between the items.

Upvotes: 4

Sanjeet A
Sanjeet A

Reputation: 5227

As Grebulon pointed its very simple to customize the picker if you are using the libray by simon TV .

These are the code and the results-

<net.simonvt.numberpicker.NumberPicker
        android:id="@+id/numberPicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:internalMaxHeight="100dp"
        app:selectionDividersDistance="30dp"/>

I was forked it once to increase the number of selector wheels. Here is the output of above code.

Upvotes: 1

Konstantin Loginov
Konstantin Loginov

Reputation: 16010

It's surprisingly easy to archive:

enter image description here
(scaleX and scaleY equals 2.5)

enter image description here
(without scaleX and scaleY)

    String[] values = {"Public", "Shared", "Private",....};

    NumberPicker np=
            (NumberPicker) findViewById(R.id.numberPicker);
    np.setMaxValue(values.length-1);
    np.setMinValue(0);
    np.setDisplayedValues(values);

And simply set small layout_height and scaleX, scaleX:

<NumberPicker
    android:id="@+id/numberPicker"
    android:layout_width="wrap_content"
    android:layout_height="50dp"
    android:scaleX="2.5"
    android:scaleY="2.5"/>

I do agree, that standard NumberPicker is hardly customizable, though.

I hope, it helps

Upvotes: 12

pRaNaY
pRaNaY

Reputation: 25320

Try to customize your NumberPicker Theme like below:

    <style name="Widget.Holo.NumberPicker" parent="Widget.NumberPicker">
  <!-- Customize your theme here -->
  <item name="android:selectionDivider">@android:drawable/numberpicker_selection_divider</item>
  <item name="android:selectionDividerHeight">2dp</item>
  <item name="android:selectionDividersDistance">25dp</item>
  <item name="android:internalMinWidth">50dp</item>
  <item name="android:internalMaxHeight">100dp</item>

</style>

Hope it's help your.

Upvotes: 0

grebulon
grebulon

Reputation: 7982

Unfortunately, number picker is not style-able.

I advise on using a library such as the one by SimonTV

Upvotes: 4

Related Questions