`
qq986945193
  • 浏览: 89765 次
  • 性别: Icon_minigender_2
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

【Android】时间选择器,选择日期DatePicker 简单详解demo及教程

 
阅读更多

作者:程序员小冰,GitHub主页:https://github.com/QQ986945193
新浪微博:http://weibo.com/mcxiaobing
首先给大家看一下我们今天这个最终实现的效果图:
这里写图片描述
这个比较简单,具体效果UI图以及时间显示样式,大家可以自己修改。
总体来说,这个效果实现起来还是比较简单的,我相信你能够移植到自己的项目中。
布局比较简单,就有一个button以及textview。所以我就先放java实现代码吧:

package daviddatepickerdemo.qq986945193.com.daviddatepickerdemo;


import java.util.Calendar;

import android.app.Activity;
import android.app.DatePickerDialog;
import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.TextView;
/**
 * @author :程序员小冰
 * @新浪微博 :http://weibo.com/mcxiaobing
 * @GitHub: https://github.com/QQ986945193
 * @CSDN博客: http://blog.csdn.net/qq_21376985
 * @码云OsChina :http://git.oschina.net/MCXIAOBING
 */

/**
 * 时间选择器
 */
public class MainActivity extends Activity {
    int mYear, mMonth, mDay;
    Button btn;
    TextView dateDisplay;
    final int DATE_DIALOG = 1;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btn = (Button) findViewById(R.id.dateChoose);
        dateDisplay = (TextView) findViewById(R.id.dateDisplay);

        btn.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                showDialog(DATE_DIALOG);
            }
        });

        final Calendar ca = Calendar.getInstance();
        mYear = ca.get(Calendar.YEAR);
        mMonth = ca.get(Calendar.MONTH);
        mDay = ca.get(Calendar.DAY_OF_MONTH);
    }

    @Override
    protected Dialog onCreateDialog(int id) {
        switch (id) {
            case DATE_DIALOG:
                return new DatePickerDialog(this, mdateListener, mYear, mMonth, mDay);
        }
        return null;
    }

    /**
     * 设置日期 利用StringBuffer追加
     */
    public void display() {
        dateDisplay.setText(new StringBuffer().append(mMonth + 1).append("-").append(mDay).append("-").append(mYear).append(" "));
    }

    private DatePickerDialog.OnDateSetListener mdateListener = new DatePickerDialog.OnDateSetListener() {

        @Override
        public void onDateSet(DatePicker view, int year, int monthOfYear,
                              int dayOfMonth) {
            mYear = year;
            mMonth = monthOfYear;
            mDay = dayOfMonth;
            display();
        }
    };
}

xml布局文件代码如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/dateDisplay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我是默认时间显示"/>

    <Button
        android:id="@+id/dateChoose"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="选择日期" />
</LinearLayout>

好了,教程到此结束。如果此文章帮到了你,欢迎点赞。
源代码需要的可以去
(AndroidStudio版)github下载地址:
https://github.com/QQ986945193/DavidDatePickerDemo

<script type="text/javascript"> $(function () { $('pre.prettyprint code').each(function () { var lines = $(this).text().split('\n').length; var $numbering = $('<ul/>').addClass('pre-numbering').hide(); $(this).addClass('has-numbering').parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($('<li/>').text(i)); }; $numbering.fadeIn(1700); }); }); </script>
分享到:
评论

相关推荐

    jquery datePicker插件

    jQuery DatePicker 是一个广泛使用的JavaScript日期选择器插件,它源自于jQuery UI库,为网页应用程序提供了优雅的日期输入控件。这个插件使得用户能够方便地选择日期,同时提供了丰富的自定义选项和国际化支持,以...

    My97DatePicker日期时间控件

    《My97 DatePicker日期时间控件详解》 在IT领域,用户界面的交互性和便捷性是衡量一个软件或网站质量的重要标准。My97 DatePicker是一款备受赞誉的JavaScript日期时间控件,它以其人性化的设计和全面的功能,为...

    My97DatePicker和说明文档

    此压缩包包含了My97DatePicker的使用说明文档、源代码以及一个示例页面,让我们一起深入了解一下这个优秀的日期选择器。 一、My97 DatePicker的特点 1. 用户友好:My97 DatePicker提供了一个清晰、直观的用户界面...

    封装的My97DatePicker日历

    My97 DatePicker是一个非常流行的开源项目,由My97 Design开发,它提供了一个用户友好的、具有多种自定义选项的日期选择器,可以方便地集成到各种Web应用程序中。 【描述详解】 "demo,方便大家使用"这部分描述表明...

    jquery Time picker Addon.rar 时间日期demo

    jQuery UI Datepicker是一款强大的日期选择器,而jQuery Timepicker Addon则是其扩展,使得在Datepicker基础上添加了时间选择的功能,极大地提高了用户体验。本文将详细介绍如何在jQuery UI Datepicker中集成...

    My97DatePicker初接触

    以下是一个简单的日期选择器实例,展示了如何设置默认日期、禁选周末及自定义日期格式: ```html &lt;input id="demo" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isDisabledWeekend:true,defaultDate:'%y-%M-%d'})...

    My97DatePicker4.2

    My97 DatePicker是一款广泛应用在Web开发中的JavaScript日期选择器控件,版本4.2是其正式版的其中一版,具体构建日期为2008年12月3日。这款控件以其丰富的功能、良好的用户界面和高度的可定制性赢得了开发者们的青睐...

    时钟插件(My97DatePicker)

    【时钟插件——My97DatePicker详解】 My97 DatePicker是一款广泛应用于Web开发中的JavaScript日期选择插件,由My97.com开发并提供。它以其功能强大、易用性好、兼容性强等特点,深受开发者喜爱。这款插件能够帮助...

    android中DatePicker和TimePicker的使用方法详解

    在Android应用开发中,`DatePicker`和`TimePicker`是两个非常重要的组件,它们用于让用户选择日期和时间。本文将详细介绍如何在Android中使用这两个组件。 首先,我们来看`DatePicker`。`DatePicker`是一个用于显示...

    My97DatePicker

    《My97DatePicker:强大的JavaScript日期选择器组件详解》 在网页开发中,日期选择器是一种常见的用户交互元素,它允许用户方便地选取日期,从而提高数据输入的准确性和效率。今天我们要深入探讨的是"My97...

    jquery grid demo

    1. **日期输入**:为用户提供一个直观的日期选择器,替代传统的文本输入框。 2. **日期范围选择**:可能实现了选择日期范围的功能,如在特定日期范围内筛选数据。 3. **事件绑定**:与 Flexigrid 结合,可以设置日期...

    My97DatePickerBeta——非常好用的日期控件

    《My97 DatePicker:高效实用的日期选择器组件详解》 在网页开发中,日期控件是不可或缺的一部分,它能够帮助用户方便快捷地输入或选择日期。My97 DatePicker 就是一款深受开发者喜爱的日期控件,其稳定性和易用性...

    js 日历控件 My97 DatePicker 功能强大 体积小巧

    在`demo.htm`文件中,通常会包含一个简单的使用示例,展示如何在页面上添加日期选择器,并配置基础属性。开发者可以通过查看和修改这个示例,快速了解和学习控件的使用。 4. **自定义扩展** My97 DatePicker允许...

    My97DatePickerBeta_v48beta

    《My97DatePickerBeta_v48beta:JS日期时间选择器控件详解》 My97 DatePicker 是一款经典的JavaScript日期选择器插件,其Beta_v48beta版本为用户提供了强大的日期选择功能,广泛应用于网页表单,尤其适用于需要用户...

    jquery-easyui-demo.zip

    7. **其他组件**: 还包括日期选择器(DatePicker)、时间选择器(TimePicker)、滑块(Slider)、树形控件(Tree)、进度条(ProgressBar)等,它们都有各自的使用场景和配置选项。 通过分析和运行这些示例,我们...

    初试JqueryEasyUI(附Demo)

    5. **DatePicker**: 日期选择器,为用户提供便捷的日期输入方式。 **四、实战演练** 在初试 Jquery EasyUI 的 Demo 中,你可以通过阅读 `初试JqueryEasyUI.docx` 和 `初试JqueryEasyUI.mht` 文件了解详细步骤和...

    Jquery UI Demo 框架

    - **Datepicker(日期选择器)**:为输入字段添加日历选择功能。 - **Sortable(可排序)**:使列表项可以拖放排序。 - **Resizable(可调整大小)**:允许用户调整元素的尺寸。 - **Buttons(按钮)**:创建各种...

    jquery_easyUI_demo

    最后,"jquery_easyUI_demo"可能还包含了其他组件的示例,如日期选择器(DatePicker)、时间选择器(TimePicker)、滑块(Slider)等,这些都是提升用户体验的实用工具。 总的来说,"jquery_easyUI_demo"是一个全面...

    WPF 工作计划demo

    在工作计划Demo中,XAML文件将用于定义窗口布局、控件和数据绑定,比如任务列表、日期选择器和详细任务视图等。 2. **控件和布局** WPF提供了大量的内置控件,如ListView(用于显示列表数据)、DatePicker(用于...

    Jquery-Demo-UI_API

    5. **Datepicker(日期选择器)**:为输入框添加日期选择功能,支持多种日期格式和日期范围限制。 五、jQuery插件 jQuery社区开发了大量的插件,如: 1. **Bootstrap**:基于jQuery的前端框架,提供响应式布局和...

Global site tag (gtag.js) - Google Analytics