Sunday, 5 May 2013

How to show only month and year fields in android Date-picker?

5 comments
Android default DatePicker show day/month/year fields but you have to customize this DatePicker as your requirements. Suppose that you want to show only month and year fields in android datepicker. To do this, you have to customize the Dialog DatePicker source code but it is not an easy task. In this tutorial I will show you a tricky way to solve this problem. Lets see how to show only month and year field in android DatePicker as a dialog.  

Step to show only month and year fields in android date-picker:

Some days ago I got this same problem and here I am trying to explain this in a sequential manner. I want to show a dialog datepicker when user click on an EditText. So if user click on EditText, A dialog datepicker will be invocked and it will show only month and year fields. To do this, at first we have to create a xml layout to hold the EditText fields. So create an android project and name it DatePickerExample. In the main.xml file just try to write this simple code. 
main.xml File: 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <EditText
        android:id="@+id/et_datePicker"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="Select A Date"
        android:inputType="date" />
</RelativeLayout>

The MainActivity Class: 

Now the time to write the code in main activity class. 
MainActivity.java: 

package com.example.datepicker;
import java.lang.reflect.Field;
import java.util.Calendar;
import android.app.Activity;
import android.app.DatePickerDialog;
import android.app.Dialog;
import android.app.DatePickerDialog.OnDateSetListener;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.DatePicker;
import android.widget.EditText;

public class MainActivity extends Activity {
static final int DATE_DIALOG_ID = 1;
private int mYear;
private int mMonth;
private int mDay;
private EditText etPickADate;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
etPickADate = (EditText) findViewById(R.id.et_datePicker);
etPickADate.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View arg0) {
showDialog(DATE_DIALOG_ID);
}
});

final Calendar c = Calendar.getInstance();
mYear = c.get(Calendar.YEAR);
mMonth = c.get(Calendar.MONTH);
}

DatePickerDialog.OnDateSetListener mDateSetListner = new OnDateSetListener() {

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

mYear = year;
mMonth = monthOfYear;
mDay = dayOfMonth;
updateDate();
}
};

@Override
protected Dialog onCreateDialog(int id) {
switch (id) {
case DATE_DIALOG_ID:
/*
* return new DatePickerDialog(this, mDateSetListner, mYear, mMonth,
* mDay);
*/
DatePickerDialog datePickerDialog = this.customDatePicker();
return datePickerDialog;
}
return null;
}

protected void updateDate() {
int localMonth = (mMonth + 1);
String monthString = localMonth < 10 ? "0" + localMonth : Integer
.toString(localMonth);
String localYear = Integer.toString(mYear).substring(2);
etPickADate.setText(new StringBuilder()
// Month is 0 based so add 1
.append(monthString).append("/").append(localYear).append(" "));
showDialog(DATE_DIALOG_ID);
}

private DatePickerDialog customDatePicker() {
DatePickerDialog dpd = new DatePickerDialog(this, mDateSetListner,
mYear, mMonth, mDay);
try {

Field[] datePickerDialogFields = dpd.getClass().getDeclaredFields();
for (Field datePickerDialogField : datePickerDialogFields) {
if (datePickerDialogField.getName().equals("mDatePicker")) {
datePickerDialogField.setAccessible(true);
DatePicker datePicker = (DatePicker) datePickerDialogField
.get(dpd);
Field datePickerFields[] = datePickerDialogField.getType()
.getDeclaredFields();
for (Field datePickerField : datePickerFields) {
if ("mDayPicker".equals(datePickerField.getName())
|| "mDaySpinner".equals(datePickerField
.getName())) {
datePickerField.setAccessible(true);
Object dayPicker = new Object();
dayPicker = datePickerField.get(datePicker);
((View) dayPicker).setVisibility(View.GONE);
}
}
}

}
} catch (Exception ex) {
}
return dpd;
}
}

Run this code and it will show only month and year field as a dialog window. It will be look like the image below.

When you click on Done text, it will put the selected month and year field in the EditText. Hope this will works fine and show the only month and year field in android datepicker. If you will find any problem with this solution, you can share your question by commenting. Also you can download the source code from here. Show only month and year field datepicker 

5 comments:

  1. This comment has been removed by the author.

    ReplyDelete
  2. insert the below line also, otherwise IllegalArgumentException shown

    mDay = c.get(Calendar.DAY_OF_MONTH);

    ReplyDelete
  3. How can you remove or change the title of the date picker dialog? It still shows full date

    ReplyDelete
  4. This code does not work in ICS :(

    ReplyDelete
  5. A lot of spam in the comments. Thanks for the code.

    ReplyDelete

//infolinks add placement