ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

Android 时间选择器快速定制指南:用 Android-PickerView 从 0 到 1 调教年月日时分秒

Android 时间选择器快速定制指南:用 Android-PickerView 从 0 到 1 调教年月日时分秒 Android 时间选择器快速定制指南用 Android-PickerView 从 0 到 1 调教年月日时分秒【免费下载链接】Android-PickerViewThis is a picker view for android , support linkage effect, timepicker and optionspicker.时间选择器、省市区三级联动项目地址: https://gitcode.com/gh_mirrors/an/Android-PickerView预约挂号、酒店订房、外卖送餐——凡是和时间打交道的界面都绕不开一个老问题系统自带的 Android 时间选择器能不能按自己的需求控制年月日时分秒单选一个日期还好办可一旦要隐藏秒、替换单位文案、限制可选范围、统一品牌色原生控件就有点力不从心了。系统DatePicker做不到的事交给开源滚轮选择器就好。Android-PickerView 就是干这个的它同时提供时间选择与省市区联动能力社区里用的人多API 走的是链式调用配起来很像搭积木。一句话总结想把年月日时分秒的显示格式捏成自己想要的样子核心就是配置一个TimePickerBuilder剩下的滚轮、联动、弹层逻辑它全包了。本文就从一个真实的预约时间场景出发带你走一遍需求拆解 → API 选型 → 逐步实现 → 避坑收尾的完整链路。读完你就能在自己的项目里复刻一套。动手前先拆需求假设你接到这样一个需求预约页面里用户只能选今天起 30 天内的日期时间只精确到分钟单位文案要显示小时 / 分钟配色要和 App 主色一致。别急着写代码先把需求拆成 4 个可落地的小问题显示哪些单位秒要藏起来年、月、日、时、分都要。单位文案叫什么默认可能是年 月 日 时 分 秒得能换。范围怎么圈只能选今天到 30 天后的区间。长什么样分割线颜色、选中项颜色、行间距都要可调。每个问题都能在 Android-PickerView 里找到对应的配置项下面逐个击破。选对入口为什么是 TimePickerBuilder项目分三个模块各司其职wheelview/滚轮控件本身最底层的轮子pickerview/封装好的选择器时间选择、选项选择都在这app/官方 demo几乎每种玩法都有现成例子。时间选择器的构建入口是TimePickerBuilder它采用链式调用一个方法干一件事返回的还是它自己最后用build()产出TimePickerView。这种写法可读性强参数多也不容易乱。TimePickerView pvTime new TimePickerBuilder(this, new OnTimeSelectListener() { Override public void onTimeSelect(Date date, View v) { btnTime.setText(fmt.format(date)); // 选中后回填到按钮 } }) // ...... 中间全是配置项往下看 .build();build()之后别忘了pvTime.show(v)选择器才会弹出来。回调用第二个参数v能定位到触发它的控件多入口共用一个选择器时很好用。需求一如何隐藏不需要的时间单位控制单位显隐的方法叫setType它接收一个长度固定为 6 的布尔数组顺序依次是年、月、日、时、分、秒。哪个位置填true哪个单位就显示。业务需求setType 数组实际效果只要年月日{true, true, true, false, false, false}默认值年月日 时分{true, true, true, true, true, false}预约常用只要时分秒{false, false, false, true, true, true}打卡、闹钟只要小时{false, false, false, true, false, false}极简场景回到预约场景秒必须藏于是这样写// 顺序年、月、日、时、分、秒 // 前 5 个 true最后 1 个 false把“秒”关掉 .setType(new boolean[]{true, true, true, true, true, false})如果你连年月日都不需要只留时分秒把前三位改成false即可。数组顺序千万不能记错——把秒的位置放错界面上就会出现一个不是你想要的时间列。需求二3 步配置自定义时间单位文案默认的单位文字是年 月 日 时 分 秒用setLabel可以整体替换。它接收 6 个字符串参数顺序同样对应年、月、日、时、分、秒。// 参数顺序年、月、日、时、分、秒 .setLabel(年, 月, 日, 小时, 分钟, )这里有两个小技巧想彻底不显示单位文字对应位置传空字符串就行想换成字母比如setLabel(Y, M, D, h, m, s)英文风格一秒达成。再配合isCenterLabel(false)决定单位文字是每行都带还是只在中间选中行显示。默认是每个 item 都带 label如果你觉得滚动时满屏都是单位太吵把它设为true只留中间一行视觉上会清爽很多。需求三如何限定可选时间范围范围控制由两个方法搭档完成setDate(Calendar)设定默认选中的时间setRangDate(Calendar start, Calendar end)圈定可选的起止区间。Calendar selected Calendar.getInstance(); // 默认选中当前时刻 Calendar start Calendar.getInstance(); start.set(2024, 0, 1); // 2024 年 1 月 1 日 Calendar end Calendar.getInstance(); end.set(2026, 11, 31); // 2026 年 12 月 31 日 .setDate(selected) // 默认选中值 .setRangDate(start, end) // 可选范围注意一个容易忽视的细节不调setRangDate时默认范围是 1900 年到 2100 年对绝大多数业务来说太宽了建议每次都显式圈一下。另外动态范围也很好做——start直接取Calendar.getInstance()end在它基础上add(Calendar.DAY_OF_MONTH, 30)就是今天起 30 天内。需求四自定义时间选择器的外观样式外观相关的配置集中在颜色、字号、间距三类组合起来就能贴合品牌色。.setContentTextSize(18) // 滚轮文字大小默认 18 .setLineSpacingMultiplier(2.0f) // 条目行距倍数范围 1.0f ~ 4.0f .setDividerColor(0xFF24AD9D) // 上下分割线颜色 .setTextColorCenter(0xFF24AD9D) // 中间选中项文字颜色 .setTextColorOut(0xFFa8a8a8) // 分割线以外文字颜色几个容易出效果的补充项setTextXOffset(年, 月, 日, 时, 分, 秒)给每个滚轮单独做 X 轴偏移单位是 px可传负值。demo 里给时分传了40, 0, -40用于对齐视觉中心setItemVisibleCount(5)控制一屏可见条目数建议取 3、5、7、9 这类奇数传偶数会被自动 1isAlphaGradient(true)滚轮上下两端做透明度渐变观感更柔和。如果你连顶栏、按钮都想换掉直接上setLayoutRes自定义布局这块放后面讲。常见坑与避坑指南配置项多坑也多。以下几条是实操中翻车率最高的提前打好预防针Calendar 的月份从 0 开始计。start.set(2024, 1, 23)其实是2 月 23 日不是 1 月。想表示 1 月就写 0这个坑在setDate和setRangDate里都会遇到极易造成范围少一个月的诡异 bug。setType 数组长度必须恰好是 6。少一位直接数组越界崩溃多一位也会出问题。建议在代码里用注释标好年、月、日、时、分、秒六个字。setItemVisibleCount 传偶数会悄悄 1。想要 6 个可见项实际显示 7 个别和设计稿较劲。setLineSpacingMultiplier 只能在 1.0f ~ 4.0f 之间。超出范围可能得到不可预期的间距。自定义布局必须保留 id 为timepicker的容器。Android-PickerView 靠这个 id 找到滚轮区域删了必空指针。可以拿pickerview_custom_time.xml当模板改别从零手写。自定义布局里点确定要手动触发回调。常规写法是pvCustomTime.returnData()再pvCustomTime.dismiss()只dismiss()的话onTimeSelect永远不会执行回填自然不生效。高频参数速查表方法作用备注setType(boolean[6])控制年月日时分秒显隐顺序固定长度必须 6setLabel(y, m, d, h, min, s)修改 6 个单位文案与 setType 顺序一致setDate(Calendar)默认选中时间月份 0-11setRangDate(start, end)可选时间范围不设默认 1900-2100setContentTextSize(int)滚轮文字字号默认 18setDividerColor(int)分割线颜色默认0xFFd5d5d5setTextColorCenter / setTextColorOut选中项 / 外侧文字颜色配合品牌色setLineSpacingMultiplier(float)条目行距倍数限 1.0f ~ 4.0fisCenterLabel(boolean)单位文字是否只在中间行默认 falsesetTextXOffset(...)各滚轮 X 轴偏移可传负数setItemVisibleCount(int)可见条目数偶数自动 1setLunarCalendar(boolean)切换农历显示范围 1900-2100isDialog(boolean)底部 Dialog 弹窗模式配合 getDialog 调整setLayoutRes(res, listener)完全自定义布局需保留 timepicker 容器再进一步还能玩出什么花样到这里年月日时分秒的定制已经全覆盖了。如果你想继续深入仓库里的 demo 就是最好的教材在app模块的MainActivity里initTimePicker()展示了底部 Dialog 弹窗模式initCustomTimePicker()是本文场景的完整版initLunarPicker()演示了农历日历的接入方式想彻底改头换面试试setLayoutRes搭配自定义布局模板把顶栏、按钮、配色全部换成自己的设计需要滚动即反馈的联动效果比如选中日期后实时刷新价格用setTimeSelectChangeListener拿滚动中的实时值。下一步你可以尝试给手头的预约/订房场景加一套农历支持或者把选择器封装成一个通用组件把setType、setLabel、setRangDate暴露成方法参数让产品和设计改需求时你只改一行调用就能交付。祝你的时间选择器既好看又顺手。【免费下载链接】Android-PickerViewThis is a picker view for android , support linkage effect, timepicker and optionspicker.时间选择器、省市区三级联动项目地址: https://gitcode.com/gh_mirrors/an/Android-PickerView创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表