Android 酷炫WheelView,日期时间选择控件

开篇

  花了点时间亲手撸了一个酷炫高质量的滚轮控件WheelView开源。扫描文中的二维码下载体验App。希望童鞋们能喜欢!

WheelView

性能盘点:

  • 1、绘制优化(绘制条数 = 显示条数 + 2,不会过多绘制)
  • 2、支持各种数据类型(数据类型实现IWheel接口)
  • 3、支持点击选中
  • 4、封装了多列底部弹窗
  • 5、封装了日期时间选择底部弹出

效果截屏

《Android 酷炫WheelView,日期时间选择控件》 wheel_view
《Android 酷炫WheelView,日期时间选择控件》 column_dialog
《Android 酷炫WheelView,日期时间选择控件》 date_time_dialog

立即体验

扫描以下二维码下载体验App(体验App内嵌版本更新检测功能):

《Android 酷炫WheelView,日期时间选择控件》 扫描下载体验App

WheelViewLibrary传送门:https://github.com/JustinRoom/WheelViewDemo

简析源码

本篇就不做源码分析了

gradle引用

    compile 'jsc.kit.wheel:wheel-view:_latestVersion'

属性

名称类型描述
wheelTextColorcolor选中item字体颜色
wheelTextSizedimension字体大小
wheelShowCountinteger显示item条数,与wheelItemVerticalSpace决定了控件的高度
wheelTotalOffsetXdimensionX轴方向总弯曲度,决定弧形效果
wheelItemVerticalSpacedimension两个item之间的间距,与wheelShowCount决定了控件的高度
wheelRotationXfloat已X轴为轴心旋转角度,决定3D效果
wheelVelocityUnitsinteger自动翻滚速度单位
名称类型描述
wheelMaskLineColorcolor中间选中item的两条分割线颜色
子View类型属性
wheelViewWheelView WheelView所有属性
wheelMaskViewWheelMaskView WheelMaskView所有属性

使用示例

组件使用示例
WheelViewWheelViewFragment
ColumnWheelDialogColumnWheelFragment
DateTimeWheelDialogDateTimeWheelFragment
        <jsc.kit.wheel.base.WheelItemView
            android:id="@+id/wheel_view_left"
            android:layout_width="160dp"
            android:layout_height="wrap_content"
            app:wheelItemVerticalSpace="12dp"
            app:wheelTotalOffsetX="12dp" />

        <jsc.kit.wheel.base.WheelView
            android:id="@+id/wheel_view_left"
            android:layout_width="160dp"
            android:layout_height="wrap_content"
            app:wheelItemVerticalSpace="12dp"
            app:wheelTotalOffsetX="-12dp" />
  • 2、 ColumnWheelDialog
    多列互不关联底部弹窗,最多支持5列。相应的列有数据则显示,无数据则不显示。
    private ColumnWheelDialog showDialog() {
        ColumnWheelDialog<WheelItem, WheelItem, WheelItem, WheelItem, WheelItem> dialog = new ColumnWheelDialog<>(getActivity());
        dialog.show();
        dialog.setTitle("选择菜单");
        dialog.setCancelButton("取消", null);
        dialog.setOKButton("确定", new ColumnWheelDialog.OnClickCallBack<WheelItem, WheelItem, WheelItem, WheelItem, WheelItem>() {
            @Override
            public boolean callBack(View v, @Nullable WheelItem item0, @Nullable WheelItem item1, @Nullable WheelItem item2, @Nullable WheelItem item3, @Nullable WheelItem item4) {
                return false;
            }
        });
                dialog.setItems(
                        initItems("菜单选项一"),
                        initItems("菜单选项二"),
                        initItems("菜单选项三"),
                        initItems("菜单选项四"),
                        initItems("菜单选项五")
                );
                dialog.setSelected(
                        new Random().nextInt(50),
                        new Random().nextInt(50),
                        new Random().nextInt(50),
                        new Random().nextInt(50),
                        new Random().nextInt(50)
                );

    private WheelItem[] initItems(String label) {
        final WheelItem[] items = new WheelItem[50];
        for (int i = 0; i < 50; i++) {
            items[i] = new WheelItem(label + (i < 10 ? "0" + i : "" + i));
        }
        return items;
    }
private DateTimeWheelDialog showDialog(int type) {
        Calendar calendar = Calendar.getInstance();
        calendar.set(Calendar.YEAR, 2015);
        calendar.set(Calendar.MONTH, 0);
        calendar.set(Calendar.DAY_OF_MONTH, 1);
        calendar.set(Calendar.HOUR_OF_DAY, 0);
        calendar.set(Calendar.MINUTE, 0);
        Date startDate = calendar.getTime();
        calendar = Calendar.getInstance();
        calendar.set(Calendar.YEAR, 2020);
        Date endDate = calendar.getTime();

        DateTimeWheelDialog dialog = new DateTimeWheelDialog(getActivity());
        dialog.show();
        dialog.setTitle("选择时间");
        int config = DateTimeWheelDialog.SHOW_YEAR_MONTH_DAY_HOUR_MINUTE;
        switch (type) {
            case 1://只显示年
                config = DateTimeWheelDialog.SHOW_YEAR;
                break;
            case 2://显示年、月
                config = DateTimeWheelDialog.SHOW_YEAR_MONTH;
                break;
            case 3://显示年、月、日
                config = DateTimeWheelDialog.SHOW_YEAR_MONTH_DAY;
                break;
            case 4://显示年、月、日、时
                config = DateTimeWheelDialog.SHOW_YEAR_MONTH_DAY_HOUR;
                break;
            case 5://显示年、月、日、时、分
                config = DateTimeWheelDialog.SHOW_YEAR_MONTH_DAY_HOUR_MINUTE;
                break;
        }
        dialog.configShowUI(config);
        dialog.setCancelButton("取消", null);
        dialog.setOKButton("确定", new DateTimeWheelDialog.OnClickCallBack() {
            @Override
            public boolean callBack(View v, @NonNull Date selectedDate) {
                tvResult.setText(SimpleDateFormat.getInstance().format(selectedDate));
                return false;
            }
        });
        dialog.setDateArea(startDate, endDate, true);
        dialog.updateSelectedDate(new Date());
    }

使用介绍就到这里。
从0撸出这个开源库不容易,希望童鞋们在GitHub上给一颗星星✨支持下。谢谢!如果在使用过程中不懂(或需要改进的地方),可以在评论里给我留言,也可以联系我。
微信:eoy9527QQ:1006368252
平时可能很少登录QQ。

篇尾

有所作为是生活的最高境界。 —— 恩格斯

    原文作者:SwitchLife
    原文地址: https://www.jianshu.com/p/cd29b6c9222e
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞