[TIMOB-12539] Android: Add calendarViewShown to picker

GitHub Issue	n/a
Type	New Feature
Priority	Medium
Status	Closed
Resolution	Fixed
Resolution Date	2013-09-24T17:58:26.000+0000
Affected Version/s	Release 3.0.0
Fix Version/s	2013 Sprint 20, 2013 Sprint 20 API, Release 3.2.0
Components	Android
Labels	android, datepicker, exalture, module_picker, picker, qe-testadded
Reporter	Sameeh Harfoush
Assignee	Biju pm
Created	2013-01-25T05:34:55.000+0000
Updated	2013-10-23T23:15:21.000+0000

Description

Feature Request

As of API Level 11 there is a picker property called calendarViewShown which will show a calendar as a part of the date picker view as shown in the attached screen shot.

Original Community Request

when using the date picker i get a picker with three columns (day, month and year) but ALSO i am getting a calendar like box on the right containing the number of days. how can i remove the calendar box and keep the picker columns?? i am compiling against android 3.2 SDK

<android xmlns:android="http://schemas.android.com/apk/res/android">
        <tool-api-level>13</tool-api-level>
        <manifest>
            <uses-sdk android:targetSdkVersion="13" android:minSdkVersion="13"/>
            <!--
            <uses-sdk android:minSdkVersion="10"/>
            -->
        </manifest>
    </android>

my code:

var minDate = new Date();
            var curMonth = 0;
            for (var i = 0; i < 12; i++) {
                curMonth = minDate.getMonth();
                curMonth--;
                minDate.setMonth(curMonth);
            }
            var now = new Date();
            this.visitDatePicker = Ti.UI.createPicker({
                type : Ti.UI.PICKER_TYPE_DATE,
                maxDate : now,
                value : now,
                minDate : minDate,
                selectionIndicator : true
            });

posted problem on the forum but didn't get any suggestions yet http://developer.appcelerator.com/question/147296/date-picker-with-box-calendar-like-days-on-the-right

Attachments

File	Date	Size
Screenshot_2013-01-26-11-52-40.png	2013-01-26T10:09:44.000+0000	50044
Screenshot_2013-01-31-10-44-27.png	2013-01-31T08:56:03.000+0000	92289

Comments

Alan Leard 2013-01-26

Please provide a screenshot of what you are seeing. I can only see month, day year.
Sameeh Harfoush 2013-01-26

Attached date picker with days box at the right. thank you
Sameeh Harfoush 2013-01-29

hello Alan, any thought on why i have such a rendering of the date-picker?
Alan Leard 2013-01-29

Please try setting your target and min SDK to 10 and confirm if the calendar still appears.
Sameeh Harfoush 2013-01-29

Ok I will try it, but this will cause the app to use android old UI components right?
Sameeh Harfoush 2013-01-31

on API version 10 the application shows the old UI of date picker and the user manually change the date when clicking in the picker text. any ideas why i am getting a weird picker with API 13?
Alan Leard 2013-02-01

Yes, the calendarViewShown attribute was added in API level 11 but the attribute is not currently available through Titanium. I will move this ticket and make it a feature request for our future SDK release to expose that as a property. Reference: http://developer.android.com/reference/android/widget/DatePicker.html
Sameeh Harfoush 2013-02-01

ok thanks for the followup
Sameeh Harfoush 2013-03-27

hello, Do you have any idea when the fix will be released?
John Scanlon 2013-03-29

Also wondering when this is scheduled for a fix. This is a deal breaker for an app I am currently working on.
Ingo Muschenetz 2013-04-01

Hi All. We will attempt to fix this in 3.2.0
Sameeh Harfoush 2013-04-03

please try to include it with Release 3.1.0 on 16th of April. Regards
Biju pm 2013-05-24

start working
Biju pm 2013-05-24

added a new property calendarViewShown https://github.com/appcelerator/titanium_mobile/pull/4328
Jimmy Forrester-Fellowes 2013-05-28

we have to wait until the end of September for this fix to filter through via v3.2? ...seriously?!
Ingo Muschenetz 2013-05-28

[~jimmyrocket] We only include new features in major releases. If you like, there is a pull request already--you could add it to a custom build of the SDK for your purposes.
Cogent Sean 2013-06-05

[~sameeh.harfoush], [~johnnysc22], [~jimmyrocket] A workaround for those who can't wait til September or don't want to spend time building a custom version of the SDK. Tested and confirmed on Titanium SDK 3.0.2 w/ T-Mobile Samsung Galaxy S2 running CM10.1-20130423-NIGHTLY. datepicker.xml: <Alloy> <View id="datePickerContainer"> <Picker id="datePicker" type="Ti.UI.PICKER_TYPE_DATE" /> </View> </Alloy> datepicker.tss: '#datePickerContainer': { width: 320 }, '#datePicker': { left: 0, width: '205%' } To adjust the width of the date picker, change the width of #datePickerContainer. Leave the #datePicker width set to 205% to ensure that the calendar view is "off right" of #datePickerContainer.

Allen Yeung 2013-06-06

[~bijuexalture], Please add a reproducible test case to this. I tried with the galaxy s3 with the following code snippet with no luck:

    var win = Ti.UI.createWindow({
    	backgroundColor: 'white'
    });
    
    var minDate = new Date();
    var curMonth = 0;
    for (var i = 0; i < 12; i++) {
    	curMonth = minDate.getMonth();
    	curMonth--;
    	minDate.setMonth(curMonth);
    }
    var now = new Date();
    visitDatePicker = Ti.UI.createPicker({
    	type : Ti.UI.PICKER_TYPE_DATE,
    	maxDate : now,
    	value : now,
    	minDate : minDate,
    	selectionIndicator : true
    }); 
    
    var view = Ti.UI.createView({
    	backgroundColor:'blue'
    });
    
    view.add(visitDatePicker);
    win.add(view);
    win.open();

chris desart 2013-07-17

For those who can't wait, a simple workaround is to use showDatePickerDialog() method. In the modal window calendar is not present.

Ygor Lemos 2013-08-27

showDatePickerDialog() is randomly crashing the app with the following:

    08-27 14:24:33.941: A/libc(1022): Fatal signal 11 (SIGSEGV) at 0x0000000c (code=1), thread 1050 (KrollRuntimeThr)

Any news on this ??

Biju pm 2013-09-06

New Test case:

    var win = Ti.UI.createWindow({
        backgroundColor: 'white'
    });
     
    var minDate = new Date();
    var curMonth = 0;
    for (var i = 0; i < 12; i++) {
        curMonth = minDate.getMonth();
        curMonth--;
        minDate.setMonth(curMonth);
    }
    var now = new Date();
    visitDatePicker = Ti.UI.createPicker({
        type : Ti.UI.PICKER_TYPE_DATE,
        maxDate : now,
        value : now,
        minDate : minDate,
        selectionIndicator : true
    }); 
     
    var view = Ti.UI.createView({
        backgroundColor:'blue'
    });
     
    view.add(visitDatePicker);
    
    var btnShow= Titanium.UI.createButton({ title :' show' , left : 5 , top : 50});    
        btnShow.addEventListener('click',function(){
            visitDatePicker.calendarViewShown = true;
        });
    
        var btnHide= Titanium.UI.createButton({ title :' hide',right : 5 , top : 50});    
        btnHide.addEventListener('click',function(){
            visitDatePicker.calendarViewShown = false;
        });
     	view.add(btnShow);
        view.add(btnHide);
    win.add(view);
    win.open();

Note : Default value of calendarViewShown is false

Steps to reproduce:

step 1 : Run the above code step 2 : Click the hide button Actual result getting a calendar like box on the right containing the number of days expected result show a calendar as a part of the date picker ( a picker with three columns (day, month and year) )

Biju pm 2013-09-10

PR:- https://github.com/appcelerator/titanium_mobile/pull/4667
Hieu Pham 2013-09-24

CR + FR
Priya Agarwal 2013-10-09

Verified with environment: Appc-Studio: 3.2.0.201310092427 Sdk:3.2.0.v20131008154043 alloy:1.2.2 npm:1.3.2 titanium:3.2.0 titanium-code-processor:1.0.3 Device:Google Nexus 7(v4.3) Xcode: 5 Calendar being shown on button click on Picker.

JSON Source