6

I've been using PhoneGap for a while mainly focused at iOS and using mostly 100% web code.

I'm about to investigate PhoneGap for another project where there is a desire to leverage the device's native form input components.

An example is the date picker. The spinners in iOS, the 'clicker' in Android, etc.

To what extent does/can PhoneGap access native UI components like that? If I'm targetting iOS4, can I call the native device date picker from my HTML/JS?

(I should add that I know this is not the preferred model...the entire point of PhoneGap is to be able to manage less code across more devices and standardizing on a shared UI is the better bet...but I'm investigating the options requested...)

DA.
  • 39,848
  • 49
  • 150
  • 213
  • Some testing details for the date picker in [Invoke native date picker from web-app on iOS/Android](http://stackoverflow.com/questions/4946919/invoke-native-date-picker-from-web-app-on-ios-android/10857237#10857237). – Arjan Jun 02 '12 at 21:07

3 Answers3

8

Yes you can invoke a native datepicker using phonegap plugins. There are currently two implementations for Android and for iOS:

Android: https://github.com/phonegap/phonegap-plugins/tree/master/Android/DatePicker iOS: https://github.com/phonegap/phonegap-plugins/tree/master/iPhone/DatePicker

dvtoever
  • 3,896
  • 1
  • 28
  • 29
  • Interesting! So, is that calling the native date picker in iOS itself? Or is it emulating a date picker? – DA. Feb 08 '12 at 17:40
  • Yes, the plugin invokes the native iOS datepicker or timepicker. When a date/time is selected, the chosen value is passed back to the phonegap application – dvtoever Feb 09 '12 at 08:45
  • So, that first link points to an android picker that is using an iOS UI. To me, that's indicating that it's NOT a native picker, but rather it's emulating one via javascript. I can't tell if the iOS option works the same way or not. Any thoughts? – DA. Feb 15 '12 at 15:14
  • The first link is a plugin that invokes the native Android datepicker. The second link is another - but similar - plugin that invokes the native iOS datepicker. No emulation whatsoever – dvtoever Feb 16 '12 at 08:26
  • THe description is "Android datepicker that uses the same interface as the existing iPhone". How is the native Android datepicker using the iPhone UI? – DA. Feb 16 '12 at 15:08
  • That *"Android datepicker that uses the same interface as the existing iPhone"* is referring to the *programming* interface, not to the user interface. The Android and iOS plugins (try to) use the same JavaScript code to interact with the native date picker, that's all, @DA. (But: a very nice detail.) – Arjan Jun 02 '12 at 20:58
  • But, as for the common JavaScript interface, be careful @DA.: despite its example, the Android version [does not support `allowOldDates`](https://github.com/phonegap/phonegap-plugins/blob/master/Android/DatePicker/DatePickerPlugin.java#L81-84) and returns dates as Strings formatted as `2012/7/1` instead of a JavaScript Date object like the iOS plugin. (I might submit a pull request for some changes I made in a local Android version, but it seems that dvtoever is actually the co-author of the Android plugin! Any specific reason for the differences that you know of, Daniel?) – Arjan Jun 03 '12 at 16:02
  • (Also, the iOS version supports a combined DateTime picker, and defaults to that. I guess Android doesn't have that.) – Arjan Jun 03 '12 at 16:05
  • Hi Arjan, I created the Android plugin indeed. I only implemented the methods I needed to register and unregister notifications since that was all the functionality I needed. I would encourage a pull request that returns data request and/or other modifications that would align it more with the iOS version. – dvtoever Jun 04 '12 at 06:50
2

No, you cannot invoke native date picker using phonegap. Phonegap is a wrapper around your browser container on mobile device. The Phonegap API has documentation related to what level of device api access is possible (Camera, Location etc)

As pointed in another answer , you can look at mobilescroll (opensource HTML/JS date-picker) http://code.google.com/p/mobiscroll/

Invoke native date picker from web-app on iOS/Android

Community
  • 1
  • 1
Satish
  • 6,457
  • 8
  • 43
  • 63
  • Yes, I'm familiar with the independent JS options for each platform to emulate the native UI. We're hoping to avoid that, as we have a wide range of platforms to support. Knowing that PhoneGap can't do it does help, as it gives us some ammo to pitch for a standard datepicker implementation across all devices. – DA. Jul 11 '11 at 15:51
  • Actually, PhoneGap/Cordova plugins were already available [at the time the above was written](https://github.com/phonegap/phonegap-plugins/commits/master/iPhone/DatePicker/DatePicker.h). – Arjan Jun 02 '12 at 21:11
2

You can access some native controls via the NativeControls plugin, which used to be part of PhoneGap core but they decided to go in a different direction.

ceejayoz
  • 176,543
  • 40
  • 303
  • 368