Wednesday, May 25, 2016

Android DatePicker Example


Recently, i got a requirement to have multiple datepickers in a single form.
So i decided to create a customview for android datepicker


Here is the code for CustomView extended from EditText


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
package com.pratap.calendarview.views;


import android.app.DatePickerDialog;
import android.content.Context;
import android.content.DialogInterface;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.View;
import android.widget.DatePicker;
import android.widget.EditText;

import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;
import java.util.GregorianCalendar;

/**
* Date picker widget.
*
* @author bgamard
*/
public class DatePickerView extends EditText implements DatePickerDialog.OnDateSetListener {

private Date date;

// private Date previousSelectedDate;

public DatePickerView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}

public DatePickerView(Context context, AttributeSet attrs) {
super(context, attrs);
setAttributes();
}

public DatePickerView(Context context) {
super(context);
setAttributes();
}

private void setAttributes() {

setHint("Select Date");
setGravity(Gravity.LEFT | Gravity.CENTER);
setFocusable(false);
// setTextSize(18);
// setPadding(10, 10, 10, 10);

setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Calendar calendar = Calendar.getInstance();
if (date != null) {
calendar.setTime(date);
}
DatePickerDialog datePicker = new DatePickerDialog(
DatePickerView.this.getContext(), DatePickerView.this,
calendar.get(Calendar.YEAR),
calendar.get(Calendar.MONTH),
calendar.get(Calendar.DAY_OF_MONTH));
datePicker.setCancelable(false);

// datePicker.setCanceledOnTouchOutside(true);
datePicker.setButton(DialogInterface.BUTTON_NEGATIVE, "CANCEL", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
if (which == DialogInterface.BUTTON_NEGATIVE) {
dialog.dismiss();

}
}
});


datePicker.show();
}
});
}

@Override
public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {


Date date = new GregorianCalendar(year, monthOfYear, dayOfMonth).getTime();

setDate(date);
}

public void setDate(Date date) {
if (date != null) {
this.date = date;
SimpleDateFormat newformat = new SimpleDateFormat("yyyy-MM-dd");
String formattedDate = newformat.format(date);
setText(formattedDate);
} else {

setText("");
}
}

public Date getDate() {
return date;
}

public Calendar getModifiedDate() {
Calendar calendar = Calendar.getInstance();
if (date != null) {
calendar.setTime(date);
}
return calendar;
}
}



Use it xml Layout like below


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:title="Add New Event"
android:titleTextColor="#FFF"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

<LinearLayout
android:id="@+id/formLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/toolbar"
android:layout_margin="16dp"
android:layout_weight="1"
android:orientation="vertical">

<EditText
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fontFamily="sans-serif"
android:hint="Enter Title"
android:textSize="18sp" />

<com.pratap.calendarview.views.DatePickerView
android:id="@+id/startDate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="start Date"
android:fontFamily="sans-serif"
android:textSize="18sp" />


<com.pratap.calendarview.views.DatePickerView
android:id="@+id/endDate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="end Date"
android:fontFamily="sans-serif"
android:textSize="18sp" />


</LinearLayout>


<Button
android:id="@+id/btnSave"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/formLayout"
android:backgroundTint="@color/colorPrimary"
android:text="Save"
android:textColor="#FFF" />

</LinearLayout>




Screenshots:


No comments:

Post a Comment