WheelPicker自定义时间选择器控件

本文实例为大家分享了WheelPicker自定义时间选择器控件的具体代码,供大家参考,具体内容如下

先上图:

使用android自带的DatePicker控件虽然也能实现功能,但样式不能改变。想要实现一些 自定义的样式,就要用到WheelPicker了。

要使用WheelPicker,需要先导入WheelPicker的引用:

1. 在project的build.gradle添加如下代码

allprojects {
    repositories {
        jcenter()
        maven { url "https://jitpack.io" }
    }
}

2. 在Module的build.gradle添加依赖

compile 'com.github.open-android:WheelPicker:v1.0.0'

3.复制如下代码到xml中:

<com.itheima.wheelpicker.WheelPicker
    android:id="@+id/wheel_date_picker_month"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="16dp"
    app:wheel_atmospheric="true"
    app:wheel_curved="true"
    app:wheel_cyclic="true"
    app:wheel_selected_item_position="5"
    app:wheel_item_text_color="@color/text_white"
    app:wheel_selected_item_text_color="@color/orange"/>
  • wheel_atmospheric :  条目颜色是否执行衔接处理 效果更好
  • wheel_curved : 是否是弧形状态显示
  • wheel_cyclic : 是否可循环
  • wheel_selected_item_position : 默认选中第几个条目

然后使用即可。

页面代码:

package com.example.castedemo.user;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.widget.DatePicker;

import com.example.castedemo.R;

import java.util.ArrayList;
import java.util.Calendar;
import java.util.List;

import butterknife.BindView;
import butterknife.ButterKnife;

import com.example.castedemo.user.bean.DayBean;
import com.itheima.wheelpicker.WheelPicker;

public class BirthdayActivity extends Activity {
    private static final String TAG = "BirthdayActivity";

    @BindView(R.id.wheel_date_picker_year)
    WheelPicker wheelDatePickerYear;
    @BindView(R.id.wheel_date_picker_month)
    WheelPicker wheelDatePickerMonth;
    @BindView(R.id.wheel_date_picker_day)
    WheelPicker wheelDatePickerDay;
    List<Integer> yearList = new ArrayList<Integer>();
    List<Integer> monthList = new ArrayList<Integer>();
    int[] dayArr = {31,28,31,30,31,30,31,31,30,31,30,31};
    int[] runDayArr = {31,29,31,30,31,30,31,31,30,31,30,31};
    List<DayBean> dayBeans = new ArrayList<DayBean>();
    List<DayBean> runDayBeans = new ArrayList<DayBean>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_birthday);
        ButterKnife.bind(this);
        initWheelDate();
        wheelDatePickerYear.setOnWheelChangeListener(new WheelPicker.OnWheelChangeListener() {
            @Override
            public void onWheelScrolled(int i) {

            }

            @Override
            public void onWheelSelected(int i) {
                updateYearValue(i+1900);
            }

            @Override
            public void onWheelScrollStateChanged(int i) {

            }
        });
        wheelDatePickerMonth.setOnWheelChangeListener(new WheelPicker.OnWheelChangeListener() {
            @Override
            public void onWheelScrolled(int i) {

            }

            @Override
            public void onWheelSelected(int i) {
                int year = wheelDatePickerYear.getCurrentItemPosition()+1900;
                Log.e(TAG,"month i="+i);
                updateDayValue(year,i);
            }

            @Override
            public void onWheelScrollStateChanged(int i) {

            }
        });
    }

    public void initWheelDate() {
        Calendar calendar = Calendar.getInstance();
        Log.e(TAG,"calendar = "+calendar.toString());
        //年
        for(int i=1900;i<2018;i++){
            yearList.add(i);
        }
        wheelDatePickerYear.setData(yearList);
        //月
        for(int i=0;i<12;i++){
            monthList.add(i+1);
        }
        wheelDatePickerMonth.setData(monthList);
        wheelDatePickerYear.setSelectedItemPosition(calendar.get(Calendar.YEAR));
        wheelDatePickerMonth.setSelectedItemPosition(calendar.get(Calendar.MONTH));
        //日
        updateYearValue(wheelDatePickerYear.getCurrentItemPosition()+1900);
        wheelDatePickerDay.setSelectedItemPosition(calendar.get(Calendar.DAY_OF_MONTH)-1);

    }

    /*
    * 根据年份判断每月有几天
    * */
    public void updateYearValue(int year){
        int month = wheelDatePickerMonth.getCurrentItemPosition();
        if(isRunYear(year)){
            for(int i=0;i<12;i++){
                DayBean dayBean = new DayBean();
                dayBean.setMonth(i+1);
                List<Integer> rundayList = new ArrayList<Integer>();
                for(int j=1;j<=runDayArr[i];j++){
                    rundayList.add(j);
                    dayBean.setDay(rundayList);
                }
                runDayBeans.add(dayBean);
//                Log.e(TAG,"rundaybeans="+runDayBeans.get(i).getMonth()+",days="+runDayBeans.get(i).getDay().toArray());
                if(month ==i){
                    wheelDatePickerDay.setData(runDayBeans.get(month).getDay());
                }
            }
        }else{
            for(int i=0;i<12;i++){
                DayBean dayBean = new DayBean();
                dayBean.setMonth(i+1);
                List<Integer> dayList = new ArrayList<Integer>();
                for(int j=1;j<=dayArr[i];j++){
                    dayList.add(j);
                    dayBean.setDay(dayList);
                }
                dayBeans.add(dayBean);
//                Log.e(TAG,"daybeans="+dayBeans.get(i).getMonth()+",day="+dayBeans.get(i).getDay());
                if(month ==i){
                    wheelDatePickerDay.setData(dayBeans.get(month).getDay());
                }
            }
        }
    }

    /*
    * 根据年份和月份判断该月有几天
    * */
    public void updateDayValue(int year,int month){
        if(isRunYear(year)){
            for(int i=0;i<runDayBeans.size();i++){
                if(month == i){
                    wheelDatePickerDay.setData(runDayBeans.get(i).getDay());
                }
            }
        }else{
            for(int i=0;i<dayBeans.size();i++){
                if(month == i){
                    wheelDatePickerDay.setData(dayBeans.get(i).getDay());
                }
            }
        }
    }

    public boolean isRunYear(int year){
        if(year%4==0 && year%100 !=0 ||year%400 ==0){
            System.out.println(year +"是闰年");
            return true;
        } else{
            System.out.println(year +"不是闰年!");
            return false;
        }
    }
}

布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.castedemo.user.BirthdayActivity">
    <TextView
        android:text="填写生日"
        android:gravity="center"
        android:layout_width="match_parent"
        android:layout_height="48dp" />
    <View
        android:layout_above="@+id/ll_birth"
        android:layout_marginBottom="20dp"
        android:background="@color/text_gray"
        android:layout_width="match_parent"
        android:layout_height="0.3dp"/>
    <LinearLayout
        android:id="@+id/ll_birth"
        android:layout_centerInParent="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <com.itheima.wheelpicker.WheelPicker
            android:id="@+id/wheel_date_picker_year"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:wheel_atmospheric="true"
            app:wheel_curved="true"
            app:wheel_cyclic="true"
            app:wheel_selected_item_position="5"
            app:wheel_item_text_color="@color/text_white"
            app:wheel_selected_item_text_color="@color/orange"/>
        <TextView
            android:text="年"
            android:layout_marginLeft="6dp"
            android:layout_gravity="center_vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <com.itheima.wheelpicker.WheelPicker
            android:id="@+id/wheel_date_picker_month"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="16dp"
            app:wheel_atmospheric="true"
            app:wheel_curved="true"
            app:wheel_cyclic="true"
            app:wheel_selected_item_position="5"
            app:wheel_item_text_color="@color/text_white"
            app:wheel_selected_item_text_color="@color/orange"/>
        <TextView
            android:text="月"
            android:layout_marginLeft="6dp"
            android:layout_gravity="center_vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <com.itheima.wheelpicker.WheelPicker
            android:id="@+id/wheel_date_picker_day"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:wheel_atmospheric="true"
            android:layout_marginLeft="16dp"
            app:wheel_curved="true"
            app:wheel_cyclic="true"
            app:wheel_selected_item_position="5"
            app:wheel_item_text_color="@color/text_white"
            app:wheel_selected_item_text_color="@color/orange"/>
        <TextView
            android:text="日"
            android:layout_marginLeft="6dp"
            android:layout_gravity="center_vertical"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
    <View
        android:id="@+id/view_bottom"
        android:layout_below="@+id/ll_birth"
        android:layout_marginTop="20dp"
        android:background="@color/text_gray"
        android:layout_width="match_parent"
        android:layout_height="0.3dp"/>

    <LinearLayout
        android:layout_marginTop="30dp"
        android:layout_below="@+id/view_bottom"
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/btn_cancel"
            android:textColor="@color/text_white"
            android:background="@drawable/border_trans_style"
            android:text="取消"
            android:padding="5dp"
            android:layout_width="60dp"
            android:layout_height="wrap_content" />
        <Button
            android:id="@+id/btn_save"
            android:background="@drawable/border_trans_style"
            android:textColor="@color/text_white"
            android:text="保存"
            android:padding="5dp"
            android:layout_marginLeft="20dp"
            android:layout_width="60dp"
            android:layout_height="wrap_content" />
    </LinearLayout>

</RelativeLayout>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android仿iPhone日期时间选择器详解

    本文实例为大家分享了Android仿iPhone时间选择器的具体代码,供大家参考,具体内容如下 先看效果图 如何使用 import java.text.DateFormat; import java.text.ParseException; import java.text.SimpleDateFormat; import java.util.Calendar; import android.app.Activity; import android.app.AlertDialog; import

  • Android仿IOS10圆盘时间选择器

    介绍 这是一款仿IOS10(就寝功能)的圆盘时间选择器 项目演示 实现思路 以720度为一个周期,0~360°对应0~12小时,360°~720°对应12~24小时 这里以"开始时间设置按钮"为例来谈谈它的滑动实现: 将"开始时间设置按钮"作为点A,表盘中心作为点O,手指触摸点作为点P.通过反正切公式可以计算出∠AOP的大小,然后随着手指的位置不断变化去更新点A的位置(即点A的角度). // 坐标系的直线表达式 // 直线l1的表达式子:过钟表中心点和开始控件中心点

  • Android日期和时间选择器实现代码

    抽出来了一个方法来选择时间(这里自己规定的只能选择当前时间以后的日期),日期选择完毕就会自动弹出时间选择器让选择时间. /** * 选择日期和时间 */ private void selectDataAndTime() { // 获取当前时间 final Calendar calendar = Calendar.getInstance(); /* * toast("当前时间是:" + calendar.get(Calendar.YEAR) + "," + * cal

  • Android Studio时间选择器的创建方法

    本文实例为大家分享了Android九宫格图片展示的具体代码,供大家参考,具体内容如下 效果显示: 1.创建xml页面(我的项目扣下来的,有的地方会报错要改) <TextView android:id="@+id/consultation_tv_birthdate" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_a

  • Android时间选择器、日期选择器实现代码

    本文为大家分享了两款选择器,一款可以针对时间进行选择.一款可以针对日期进行选择,供大家参考,具体内容如下 一.时间选择器 1.1.布局 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.and

  • Android开发中实现IOS风格底部选择器(支持时间 日期 自定义)

    本文Github代码链接 https://github.com/AndroidMsky/AndoirdIOSPicker 先上图吧: 这是笔者最近一个项目一直再用的一个选择器库,自己也在其中做了修改,并决定持续维护下去. 先看使用方法: 日期选择: private void showDateDialog(List<Integer> date) { DatePickerDialog.Builder builder = new DatePickerDialog.Builder(this); bui

  • Android自定义View仿IOS圆盘时间选择器

    通过自定义view实现仿iOS实现滑动两端的点选择时间的效果 效果图 自定义的view代码 public class Ring_Slide2 extends View { private static final double RADIAN = 180 / Math.PI; private int max_progress; // 设置最大进度 private int cur_progress; //设置锚点1当前进度 private int cur_progress2; //设置锚点2进度 p

  • WheelPicker自定义时间选择器控件

    本文实例为大家分享了WheelPicker自定义时间选择器控件的具体代码,供大家参考,具体内容如下 先上图: 使用android自带的DatePicker控件虽然也能实现功能,但样式不能改变.想要实现一些 自定义的样式,就要用到WheelPicker了. 要使用WheelPicker,需要先导入WheelPicker的引用: 1. 在project的build.gradle添加如下代码 allprojects { repositories { jcenter() maven { url "htt

  • layui-laydate时间日历控件使用方法详解

    本文实例为大家分享了laydate时间日历控件的使用方法,供大家参考,具体内容如下 layui下载地址:http://www.layui.com/ 此控件可使用layui或者独立版的layDate,两者初始化有些不同 在 layui 模块中使用layui.code <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>layDate快速使用</title&

  • Android自定义播放器控件VideoView

    介绍 最近要使用播放器做一个简单的视频播放功能,开始学习VideoView,在横竖屏切换的时候碰到了点麻烦,不过在查阅资料后总算是解决了.在写VideoView播放视频时候定义控制的代码全写在Actvity里了,写完一看我靠代码好乱,于是就写了个自定义的播放器控件,支持指定大小,可以横竖屏切换,手动左右滑动快进快退.好了,下面开始. 效果图有点卡,我也不知道为啥..... VideoView介绍 这个是我们实现视频播放最主要的控件,详细的介绍大家百度就去看,这里介绍几个常用的方法. 用于播放视频

  • Flutter 日期时间DatePicker控件及国际化

    最近在学习Flutter,今天正好看到一篇文章收藏下来做个笔记,也分享给大家. 注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 DatePicker Flutter并没有DatePicker这个控件,需要使用showDatePicker方法弹出日期选择控件,基本用法如下: RaisedButton( onPressed: () async { var result = await showDatePic

  • Qt实现自定义验证码输入框控件的方法

    前言 本文实现了自定义的验证码输入框控件.控件包括图标.输入框.获取验证码按钮.验证码获取倒计时标签.支持鼠标点击获取验证码按钮后开始显示倒计时功能,倒计时为0时,才可以在此点击获取验证码按钮.效果如图: 主要的编程思想还是实现自定义控件的封装性和共用性. UI布局: 控件1:QWidget,实现整个控件的封装,这个控件使用水平布局,实现控件的水平摆放,同时,当其中一个控件隐藏时,位置会重新更新,实现在控件的后面只显示获取验证码和倒计时两个控件中的一个. 控件2:QLabel,实现展示盾牌图标.

  • Android开发自定义实时图表控件实现示例

    目录 概述 演示 环境 实现 第一步:新建项目RealTimeChartDemo 第二步:新建RealTimeChart类 第三步:添加自定义变量 第四步:初始化基础参数 第五步:初始化宽高等参数 第六步:定义添加坐标点方法 第七步:定义坐标偏移方法 第八步:定义绘制网格线方法 第九步:定义绘制X轴标签方法 第十步:定义绘制坐标点方法 第十一步:绘制 第十二步:在activity_main.xml中使用控件 第十三步:在MainActivity中模拟添加数据点 概述 有时我们需要实时滚动显示一段

  • Vue自定义日历小控件使用方法详解

    本文实例为大家分享了Vue自定义日历小控件的具体代码,供大家参考,具体内容如下 废话少说,先上效果图: 可以在效果图中看到,选择不同的月份的时候当月天数与星期几都是一一对应,非当月天数则是灰色显示,一目了然. 并且此日历控件支持自动确定当前时间,每次打开默认显示的就是最新的月份,用来做签到打卡的功能比较合适. 由于使用的是原生div进行制作,自定义功能非常强,可以自由的更换样式.背景.颜色.大小等等. 在与数据库的时候可以从数据库获得时间信息并填充到控件中,图中的色块就可以看出. 该控件使用了V

  • WPF自定义选择年月控件详解

    本文实例为大家分享了WPF自定义选择年月控件的具体代码,供大家参考,具体内容如下 封装了一个选择年月的控件,XAML代码: <UserControl x:Class="SunCreate.CombatPlatform.Client.DateMonthPicker" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.micr

  • 日期 时间js控件

    复制代码 代码如下: <script language="JavaScript"> /**//** *本日历选择控件由tiannet根据前人经验完善而得.大部分代码来自meizz的日历控件. *tiannet添加了时间选择功能.select,object标签隐藏功能,还有其它小功能. *使用方法: * (1)只选择日期 <input type="text" name="date" readOnly onClick="s

  • Android中日期与时间设置控件用法实例

    本文实例讲述了Android中日期与时间设置控件用法.分享给大家供大家参考.具体如下: 1.日期设置控件:DatePickerDialog 2.时间设置控件:TimePickerDialog 实例代码: 页面添加两个Button,单击分别显示日期设置控件和时间设置控件,还是有TextView控件,用于显示设置后的系统时间 main.xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout x

随机推荐