数字选择器NumberPicker使用教程

数字选择器NumberPicker是Android3.0之后引入的一个控件，比较常用，比如说手机常用的闹钟，可以选择小时和分钟，如果你需要兼容3.0之前版本，GitHub上有开源的项目，具体的下载地址https://github.com/SimonVT/android-numberpicker。

基本用法

先上布局文件：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="fill_parent"android:layout_height="wrap_content"android:orientation="vertical"tools:context="com.avatarmind.numberpickerdemo.MainActivity"><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_horizontal"android:layout_marginTop="30dp"><NumberPickerandroid:id="@+id/hourpicker"android:layout_width="wrap_content"android:layout_height="wrap_content" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:text="时" /><NumberPickerandroid:id="@+id/minuteicker"android:layout_width="wrap_content"android:layout_height="wrap_content" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:text="分" /></LinearLayout></LinearLayout>

贴出完整的主程序代码：


public class MainActivity extends AppCompatActivity implements NumberPicker.OnValueChangeListener, NumberPicker.OnScrollListener, NumberPicker.Formatter {private static final String TAG = "MainActivity";@BindView(R.id.hourpicker)NumberPicker hourPicker;@BindView(R.id.minuteicker)NumberPicker minutePicker;@BindView(R.id.valuepicker)NumberPicker valuePicker;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ButterKnife.bind(this);init();}private void init() {hourPicker.setFormatter(this);hourPicker.setOnValueChangedListener(this);hourPicker.setOnScrollListener(this);hourPicker.setMaxValue(24);hourPicker.setMinValue(0);hourPicker.setValue(9);minutePicker.setFormatter(this);minutePicker.setOnValueChangedListener(this);minutePicker.setOnScrollListener(this);minutePicker.setMaxValue(60);minutePicker.setMinValue(1);minutePicker.setValue(49);//设置为对当前值不可编辑hourPicker.setDescendantFocusability(DatePicker.FOCUS_BLOCK_DESCENDANTS);minutePicker.setDescendantFocusability(TimePicker.FOCUS_BLOCK_DESCENDANTS);//这里设置为不循环显示，默认值为truehourPicker.setWrapSelectorWheel(false);minutePicker.setWrapSelectorWheel(false);}@Overridepublic String format(int value) {Log.i(TAG, "format: value");String tmpStr = String.valueOf(value);if (value < 10) {tmpStr = "0" + tmpStr;}return tmpStr;}@Overridepublic void onScrollStateChange(NumberPicker view, int scrollState) {switch (scrollState) {case NumberPicker.OnScrollListener.SCROLL_STATE_FLING:Log.i(TAG, "onScrollStateChange: 后续滑动(飞呀飞，根本停下来)");break;case NumberPicker.OnScrollListener.SCROLL_STATE_IDLE:Log.i(TAG, "onScrollStateChange: 不滑动");break;case NumberPicker.OnScrollListener.SCROLL_STATE_TOUCH_SCROLL:Log.i(TAG, "onScrollStateChange: 滑动中");break;}}@Overridepublic void onValueChange(NumberPicker picker, int oldVal, int newVal) {Log.i(TAG, "onValueChange: 原来的值 " + oldVal + "--新值: "+ newVal);}}

基本效果如下：

上述代码中，大家重点关注MainActivity实现的3个接口。
1.NumberPicker.OnValueChangeListener
2. NumberPicker.OnScrollListener
1. NumberPicker.Formatter

数字选择是可以滑动，所以需要定义一个OnValueChangeListener事件，OnScrollListener滑动事件，Formatter事件:

Formatter事件：

 @Overridepublic String format(int value) {Log.i(TAG, "format: value");String tmpStr = String.valueOf(value);if (value < 10) {tmpStr = "0" + tmpStr;}return tmpStr;}

OnValueChangeListener事件:

 @Overridepublic void onValueChange(NumberPicker picker, int oldVal, int newVal) {Log.i(TAG, "onValueChange: 原来的值 " + oldVal + "--新值: "+ newVal);}

OnScrollListener滑动事件，滑动事件有三个状态:

SCROLL_STATE_FLING:手离开之后还在滑动SCROLL_STATE_IDLE：不滑动SCROLL_STATE_TOUCH_SCROLL:滑动中

@Overridepublic void onScrollStateChange(NumberPicker view, int scrollState) {switch (scrollState) {case NumberPicker.OnScrollListener.SCROLL_STATE_FLING:Log.i(TAG, "onScrollStateChange: 后续滑动(飞呀飞，根本停下来)");break;case NumberPicker.OnScrollListener.SCROLL_STATE_IDLE:Log.i(TAG, "onScrollStateChange: 不滑动");break;case NumberPicker.OnScrollListener.SCROLL_STATE_TOUCH_SCROLL:Log.i(TAG, "onScrollStateChange: 滑动中");break;}}

　初始化操作：

 private void init() {hourPicker.setFormatter(this);hourPicker.setOnValueChangedListener(this);hourPicker.setOnScrollListener(this);hourPicker.setMaxValue(24);hourPicker.setMinValue(0);hourPicker.setValue(9);minutePicker.setFormatter(this);minutePicker.setOnValueChangedListener(this);minutePicker.setOnScrollListener(this);minutePicker.setMaxValue(60);minutePicker.setMinValue(1);minutePicker.setValue(49);//设置为对当前值不可编辑hourPicker.setDescendantFocusability(DatePicker.FOCUS_BLOCK_DESCENDANTS);minutePicker.setDescendantFocusability(TimePicker.FOCUS_BLOCK_DESCENDANTS);//这里设置为不循环显示，默认值为truehourPicker.setWrapSelectorWheel(false);minutePicker.setWrapSelectorWheel(false);}

由于NumberPicker默认是可以对当前正在显示的数值可编辑，因此可以通过

　hourPicker.setDescendantFocusability(DatePicker.FOCUS_BLOCK_DESCENDANTS);

来设置对当前数值不可编辑。

另外，NumberPicker默认是数字是可以循环滚动的，我们可以通过

hourPicker.setWrapSelectorWheel(false);

来设置其不可以循环滚动。

拓展

首先，NumberPicker也是可以显示文字的，重新定义一个NumberPicker,加载一下:

  private void valueinit() {String[] city = {"立水桥", "霍营", "回龙观", "龙泽", "西二旗", "上地"};valuePicker.setDisplayedValues(city);valuePicker.setMinValue(0);valuePicker.setMaxValue(city.length - 1);valuePicker.setValue(4);//设置为对当前值不可编辑valuePicker.setDescendantFocusability(DatePicker.FOCUS_BLOCK_DESCENDANTS);}

效果如下：

其次，我们可以对NumberPicker分割线的颜色，间距，以及宽度(粗细)进行调整。方法如下：

 /*** 设置picker之间的间距*/private void setPickerMargin(NumberPicker picker) {LinearLayout.LayoutParams p = (LinearLayout.LayoutParams) picker.getLayoutParams();p.setMargins(0, 0, 100, 0);if (Build.VERSION.SDK_INT > Build.VERSION_CODES.JELLY_BEAN_MR1) {p.setMarginStart(0);p.setMarginEnd(100);}}/*** 设置picker分割线的颜色*/private void setDividerColor(NumberPicker picker) {Field field = null;try {field = NumberPicker.class.getDeclaredField("mSelectionDivider");if (field != null) {field.setAccessible(true);field.set(picker, new ColorDrawable(Color.RED));}} catch (NoSuchFieldException e) {e.printStackTrace();} catch (IllegalAccessException e) {e.printStackTrace();}}/*** 设置picker分割线的宽度(分割线的粗细)*/private void setNumberPickerDivider(NumberPicker picker) {Field[] fields = NumberPicker.class.getDeclaredFields();for (Field f : fields) {if (f.getName().equals("mSelectionDividerHeight")) {f.setAccessible(true);try {f.set(picker, 1);} catch (IllegalAccessException e) {e.printStackTrace();}break;}}}

上述3种效果如下图：

最后，我们也可以通过自定义NumberPicker的方式来调整数值字体的颜色以及大小，自定义NumberPicker代码如下

/*** 重写NumberPicker已达到修改显示字体颜色大小*/
public class TextColorNumberPicker extends NumberPicker {public TextColorNumberPicker(Context context) {super(context);}public TextColorNumberPicker(Context context, AttributeSet attrs) {super(context, attrs);}public TextColorNumberPicker(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}@Overridepublic void addView(View child) {super.addView(child);updateView(child);}@Overridepublic void addView(View child, int width, int height) {super.addView(child, width, height);updateView(child);}@Overridepublic void addView(View child, int index, ViewGroup.LayoutParams params) {super.addView(child, index, params);updateView(child);}@Overridepublic void addView(View child, ViewGroup.LayoutParams params) {super.addView(child, params);updateView(child);}public void updateView(View view) {if (view instanceof EditText) {//这里修改显示字体的属性，主要修改颜色和大小((EditText) view).setTextColor(Color.parseColor("#FF0000"));((EditText) view).setTextSize(20);}}
}

效果如下：

好了，上面就是数字选择器NumberPicker的基本使用方法，小伙伴们如果有问题请留言，后续我会借助NumberPicker等来编写一个比较“精致”的时间选择器，敬请关注。

数字选择器NumberPicker使用教程相关推荐

安卓NumberPicker数字选择器用法
前言数字选择器NumberPicker是Android3.0之后出的一个控件,所以如果要兼容3.0之前的版本就需要用到GitHub上的开源项目,下载地址是https://github.com/Sim ...
XLR接头（卡农头）数字音频线制作教程
XLR接头(卡农头)数字音频线制作教程 XLR接头音频线介绍 XLR接头,也称卡农头,是由英文cannon音译过来,卡农头接的是平衡信号,此插头为一种音频插头. 通常用于手持式麦克风和舞台使用的环绕声 ...
java数字音频最强教程之如何检测一段音频中是否有声音
声音检测随着人工智能的发展,机器视觉,机器可视化也变的越来越完善,但是声音这块分析资料却比较少,有时候需要去检测一段视频或者音频中是否有声音.在某些场景中需要判断有声音则抓拍录制,当然这里只是先初步 ...
CREO图文教程：三维设计案例之数字刻度(阵列)图文教程之详细攻略
CREO图文教程:三维设计案例之数字刻度(阵列)图文教程之详细攻略目录三维设计案例之数字刻度(阵列)图文教程 (1).点击草绘 (2).先阵列短针
HTML5中的数字类型的输入框：数字选择器
HTML5中的数字类型的输入框:数字选择器 html5 Input类型有如下几种: color.date.datetime.datetime-local.email month.number.rang ...
三维电子沙盘三维数字虚拟沙盘开发教程第39课交互触摸查询面板的调用
三维电子沙盘三维数字虚拟沙盘开发教程第39课交互触摸查询面板的调用查询面板调用: private void Button_Click_11(object sender, RoutedEvent ...
数字IC设计工具教程——VCS常用命令
数字IC设计工具教程--VCS常用命令文章目录数字IC设计工具教程--VCS常用命令编译开关(静态开关) 仿真开关(动态开关) 后处理打开DVE testbench中后处理系统函覆盖率统计门 ...
原生js日历选择器插件开发实例教程
在web开发过程中经常会碰到需要选择日期的功能,一般的操作都是在文本框点击,然后弹出日历选择框,直接选择日期就可以在文本框显示选择的日期.开发好之后给用户使用是很方便,但如果每一个日历选择器都要临时开 ...
数字笔记-Notion使用教程
Notion使用教程背景最近圈子里聊的比较多,就尝试了一下使用.当然,由于桌面版是全英文(我不知道有没有汉化包,我觉得作为一个开发者,也没有必要使用汉化包),而且官方教程比较少,所以新手使用不太友 ...
java数字时钟代码,[Java教程]Javascript 数字时钟
[Java教程]Javascript 数字时钟 0 2012-10-14 22:00:11 Javascript代码部分: 在body标签中添加以下Html代码: 本文网址:http://www.sh ...

数字选择器NumberPicker使用教程

基本用法

拓展

数字选择器NumberPicker使用教程相关推荐

最新文章

热门文章