如何更改Android中的数字选择器样式？

Question

我想使用 NumberPicker 组件小部件，但在默认的 Holo 主题中，我需要将蓝色替换为橙色，因为这是我样式中的默认颜色。 如何替换蓝色和数字的颜色，并保留组件的所有功能？ 谢谢

Answer 1

不幸的是，你无法设计它的样式。

NumberPicker

的样式和样式属性不存在于公共 API 中，因此您无法设置它们并更改默认外观。您只能在浅色和深色主题之间进行选择。

作为解决方案，我建议使用 android-numberpicker 库。该库基本上是从 Android 源代码中提取的 NumberPicker 的端口。但比这更好的是，它还将

NumberPicker

向后移植到 Android 2.x。该库可以轻松设计。

要设置分隔线的样式，请调整

NPWidget.Holo.NumberPicker

样式及其

selectionDivider

和

selectionDividerHeight

属性。
要设置文本样式，请调整

NPWidget.Holo.EditText.NumberPickerInputText

样式。

Answer 2

自定义数字选择器预览：

<NumberPicker
  android:id="@+id/np"
  android:layout_width="40dp"
  android:layout_height="40dp"
  android:layout_centerHorizontal="true"
  android:background="@drawable/drawablenp"
  android:layout_centerVertical="true"/>

在名为“drawablenp.xml”的drawable文件夹中创建背景xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:startColor="#707070"
        android:centerColor="#f8f8f8"
        android:endColor="#707070"
        android:angle="270"/>

</shape>

Answer 3

复制library/res/drawable-*/numberpicker_selection_divider.9.png并命名，例如custom_np_sd.9.png。

通过活动主题覆盖默认的 NumberPicker 样式：

<style name="AppTheme" parent="@style/Holo.Theme">
  <item name="numberPickerStyle">@style/CustomNPStyle</item>
</style>
<style name="CustomNPStyle" parent="@style/Holo.NumberPicker">
  <item name="selectionDivider">@drawable/custom_np_sd</item>
</style>

并应用@style/AppTheme作为活动主题。

Answer 4

我也遇到这个问题了。我真的很想要一个漂亮的

NumberPicker

用户界面。这个问题的所有答案都有效，但非常有限。我几乎创建自己的

RecylerView

来创建我想要的

NumberPicker

。显然我发现了一个非常健壮的整洁的库。这是链接https://github.com/Carbs0126/NumberPickerView

不想在这里回答这个问题。只是想帮助和我有同样问题的人。

Answer 5

我也面临这个问题，我用reflect来改变样式

public class MyNumberPicker extends NumberPicker {
    public MyNumberPicker(Context context) {
        super(context);

        setNumberPickerDivider();
    }

    public MyNumberPicker(Context context, AttributeSet attrs) {
        super(context, attrs);

        setNumberPickerDivider();
    }

    public MyNumberPicker(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        setNumberPickerDivider();
    }

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    public MyNumberPicker(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);

        setNumberPickerDivider();
    }

    @Override
    public void addView(View child) {
        super.addView(child);
        updateView(child);
    }

    @Override
    public void addView(View child, int index, android.view.ViewGroup.LayoutParams params) {
        super.addView(child, index, params);
        updateView(child);
    }

    @Override
    public void addView(View child, android.view.ViewGroup.LayoutParams params) {
        super.addView(child, params);
        updateView(child);
    }

    public void updateView(View view) {
        if (view instanceof EditText) {
            EditText et = (EditText) view;
            et.setTextColor(ContextCompat.getColor(getContext(), R.color.font_content));
            et.setTextSize(16);
        }
    }

    private void setNumberPickerDivider() {

        try {
            {
                Field field = NumberPicker.class.getDeclaredField("mSelectionDivider");
                field.setAccessible(true);
                field.set(this, ContextCompat.getDrawable(getContext(), R.drawable.horizontal_divider));
            }

            {
                Field field = NumberPicker.class.getDeclaredField("mSelectionDividerHeight");
                field.setAccessible(true);
                field.set(this, 1);
            }
        } catch (NoSuchFieldException e) {
            e.printStackTrace();
        } catch (IllegalAccessException e) {
            e.printStackTrace();
        }
    }
}

Answer 6

有一些间接的方法可以修改我几年前使用的 MumberPicker 设计。 NumberPicker 是一个包含主 EditText 字段的 ViewGroup，它是几乎所有设计参数的持有者。然后，这些参数会在初始化阶段复制到 NumberPicker 的其他部分，例如“SelectorWeel”等。 该EditText位于mInputText字段中。该字段是私有的，但您可以拦截它并在 addView 方法中进行一些设计更正：

public class NoFlingNumberPicker extends NumberPicker {
...
protected EditText _mInputText;
...
protected void updateView( View view ) {
        if( view instanceof EditText ) {
            _mInputText = (EditText) view;
            _mInputText.setTextSize( getResources().getDimension( R.dimen.N_P_TextUnit ) );
        }
    }

    @Override
    public void addView( View child ) {
        super.addView( child );
        updateView( child );
    }

    @Override
    public void addView( View child, int index, android.view.ViewGroup.LayoutParams params ) {
        super.addView( child, index, params );
        updateView( child );
    }

    @Override
    public void addView( View child, android.view.ViewGroup.LayoutParams params ) {
        super.addView( child, params );
        updateView( child );
    }
...
}