Picker Views Example in Android

This example will show you how you can combine and handle two picker views in a layout.

Algorithm:

1.) Create a new project by File-> New -> Android Project name it PickerViewsExample.

2.) Write following into main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView android:text="@string/date_text"
    android:id="@+id/TextView01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="26px"
    android:typeface="sans"></TextView>
<Button android:text="@string/date_button"
    android:id="@+id/Button01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"></Button>
    
<TextView android:text="@string/time_text"
    android:id="@+id/TextView02"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="26px"
    android:typeface="sans"></TextView>
<Button android:text="@string/time_button"
    android:id="@+id/Button02"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"></Button>
</LinearLayout>
3.) Create and write following into layout/datepickerlayout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
<DatePicker
    android:id="@+id/DatePicker01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"></DatePicker>
</LinearLayout>

4.) Run for output.

Steps:

1.) Create a project named PickerViewsExample and set the information as stated in the image.

Build Target: Android 4.2
Application Name: PickerViewsExample
Package Name: com.example.PickerViewsExample
Activity Name: PickerViewsExample
Min SDK Version: 4.2

2.) Open PickerViewsExample.java file and write following code there:

package com.example.pickerviewexample;
import java.util.Calendar;
import android.app.Activity;
import android.app.DatePickerDialog;
import android.app.Dialog;
import android.app.TimePickerDialog;
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;
import android.widget.TimePicker;
public class PickerViewExample extends Activity {
    
    static final int DATE_DIALOG_ID = 1;
    static final int TIME_DIALOG_ID = 2;
    private TextView dateDisplay;
    private Button pickDate;
    private int year, month, day;
    private TextView timeDisplay;
    private Button pickTime;
    private int hours, min;
    
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        dateDisplay = (TextView)findViewById(R.id.TextView01);
        pickDate = (Button)findViewById(R.id.Button01);
        
        pickDate.setOnClickListener( new OnClickListener() {
            @Override
            public void onClick(View v) {
                showDialog(DATE_DIALOG_ID);
            }
            
        });
        
        final Calendar cal = Calendar.getInstance();
        year = cal.get(Calendar.YEAR);
        month = cal.get(Calendar.MONTH);
        day = cal.get(Calendar.DAY_OF_MONTH);
        
        updateDate();
        
        timeDisplay = (TextView)findViewById(R.id.TextView02);
        pickTime = (Button)findViewById(R.id.Button02);
        
        pickTime.setOnClickListener( new OnClickListener () {
            @Override
            public void onClick(View v) {
                showDialog(TIME_DIALOG_ID);
                
            }
            
        });
        
        hours = cal.get(Calendar.HOUR);
        min = cal.get(Calendar.MINUTE);
        
        updateTime();
    }
    private void updateTime() {
        timeDisplay.setText(new StringBuilder().append(hours).append(':')
                .append(min));
        
    }
    private void updateDate() {
        dateDisplay.setText(new StringBuilder().append(day).append('-')
                .append(month + 1).append('-').append(year));
        
    }
    
    private DatePickerDialog.OnDateSetListener dateListener =
        new DatePickerDialog.OnDateSetListener() {
            @Override
            public void onDateSet(DatePicker view, int yr, int monthOfYear,
                    int dayOfMonth) {
                year = yr;
                month = monthOfYear;
                day = dayOfMonth;
                updateDate();
            }
    };
    
    private TimePickerDialog.OnTimeSetListener timeListener =
        new TimePickerDialog.OnTimeSetListener() {
            @Override
            public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
                hours = hourOfDay;
                min = minute;
                updateTime();
            }
        
    };
    protected Dialog onCreateDialog(int id){
        switch(id) {
        case DATE_DIALOG_ID:
            return new DatePickerDialog(this, dateListener, year, month, day);
        case TIME_DIALOG_ID:
            return new TimePickerDialog(this, timeListener, hours, min, false);
        }
        return null;
        
    }
}

3.) Compile and build the project.

Output

Image

Image

 

If you are looking for zip project please comment …
Hope it will help you…
Thanks…

Advertisements

2 thoughts on “Picker Views Example in Android

  1. I’m not sure where you are getting your information, but good topic. I needs to spend some time learning more or understanding more. Thanks for excellent information I was looking for this information for my mission.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s