ndtrek07
ndtrek07

Reputation: 499

Android Calendar View for Date Picker

I'm writing my first app, and I have a question about DatePicker.

My app requires the user to input a date. The most user-friendly way would be to popup a calendar-like widget that displays the current month like a calendar grid - something like this:

enter image description here

I want to use that in place of the DatePicker interface - which has Month, Day, and Year fields, each with an up and down button to increment/decrement.

Is this type of functionality built into any Android widget or view, or would I have to design my own custom component to do this? I figured this would already exist, seeing how much this type of UI is used so frequently in non-mobile apps and web pages.

Thanks!

Upvotes: 33

Views: 81630

Answers (8)

Moktahid Al Faisal
Moktahid Al Faisal

Reputation: 910

you can use this lib for date selection

https://github.com/square/android-times-square/

Upvotes: 0

Fedir Tsapana
Fedir Tsapana

Reputation: 1352

Try to use this component: https://github.com/truefedex/android-date-picker enter image description here

If you want to use it like popup write on your onclick:

if (calendarPopup == null) {
  calendarPopup = new PopupWindow(getContext());
  CalendarPickerView calendarView = new CalendarPickerView(getContext());
  CalendarNumbersView calendar = (CalendarNumbersView) calendarView.findViewById(com.phlox.datepick.R.id.calendar);
  calendar.setShowDayNames(false);
  calendarView.setListener(onDateSelectionListener);
  calendarPopup.setContentView(calendarView);
  calendarPopup.setWindowLayoutMode(
        MeasureSpec.makeMeasureSpec(llCalendar.getWidth(), MeasureSpec.EXACTLY),
        ViewGroup.LayoutParams.WRAP_CONTENT);
  calendarPopup.setHeight(1);
  calendarPopup.setWidth(llCalendar.getWidth());
  calendarPopup.setOutsideTouchable(true);
}
calendarPopup.showAsDropDown(llCalendar);

Upvotes: 2

Marcel Bro
Marcel Bro

Reputation: 5025

Now, in 2014, even the native DatePicker (link) contains small Holo looking CalendarView (link) to pick a day in month.

You can choose, if both spinners and CalendarView or just one of them is displayed by setting:

  • android:calendarViewShown
  • android:spinnersShown

I'm not sure if it's just API level 16+ or if it was even in Ice Cream Sandwich, but it's there. This is how it looks by default:

enter image description here


Moreover, on API level 21 and higher there is a new Material themed DatePicker that looks like following:

enter image description here

This is default on API 21+ and there are no spinners anymore, but you can switch back to the Holo one by setting

android:datePickerMode="spinner"

in your XML.

Upvotes: 19

Brais Gabin
Brais Gabin

Reputation: 5935

Since the API 11 there natively: CalendarView

enter image description here

This View is in HoloEverywhere since API 7.

Upvotes: 12

Gaurav Vashisth
Gaurav Vashisth

Reputation: 7737

Found a good implemetation in http://caughtinthemobileweb.wordpress.com/2011/06/20/how-to-implement-calendarview-in-android/


Also Since API level 11 (Android 3.0) there has been the native implementation of the CalendarView http://developer.android.com/reference/android/widget/CalendarView.html

Upvotes: 4

kostmo
kostmo

Reputation: 6340

I have recently written exactly this as a modular app. Here is some sample code, documentation with screenshots, and .apk download.

Upvotes: 4

CommonsWare
CommonsWare

Reputation: 1007554

Is this type of functionality built into any android widget or view, or would I have to design my own custom > component to do this?

There is no component for that in the Android SDK, sorry. The widget you illustrate is too small for a touchscreen. You can implement something larger (see the Calendar app), but you are largely on your own for that.

Upvotes: 11

Related Questions