Nowadays is possible to build an windows store app that will work cross Windows platform, i mean it would work in Windows 8.1, Windows RT and Windows Phone 8.1.
The support for this developing model was announced by Microsoft sometime ago.
https://dev.windows.com/en-us/develop/building-universal-windows-apps
This development support was made in 3 phases a first phase when it was supported using defines in the code, a second phase with the Shared code and override concepts (https://dev.windows.com/en-us/develop/building-universal-windows-apps).
In my opinion the way Microsoft build this universal development environment was the right one and comparing with the other players i would say that for developer’s this is the better platform.
The universal development model respects the fact that HTML 5 is a first class citizen and with WinJS a way to code natively to all the Microsoft Windows 8.1 platform.
Some months ago i start with a team at Innovagency the promotion of a big Windows 8.1 store app (only desktop and tablet) to Universal APP to bring also the support to the Windows Phone. The original app was developend in HTML 5 and WinJS and this new Universal app will also be developed that way.
When developing a Windows Store Universal app there are a lot of chalenges nowadays and one off them is what native controls exists in the different flavors of the platform. Especially in the case off WinJS controls not all controls had come to Windows 8.1 on the phone.
Microsoft had decided not to implement the following WinJS controls on the Windows Phone.
Source of this table can be found at Microsoft in the following URL:
https://msdn.microsoft.com/en-us/library/windows/apps/dn632432.aspx#unsupported_apis
This means when building Windows Universal APPs this controls will be considered not supported s cross platform since they are not supported by the rendering engine of Windows Phone 8.1
At this time our reader may say but i had listen/read that WINRT is shared along the distributions of Windows 8.1, true but only partial.
One off the controls that is not shared in WinJS is the DatePicker, the main reason for that is that in HTML and Javascript there are many ways to build Date Pickers, but imagine that you are promoting a Windows Store app that was built-in HTML to a Universal APP.
Or let’s imagine that we really need or want to have the Date Picker the same way you are used to in WinJS when building Windows apps. We understand the Microsoft option but this disruption is not uniform with what happen in the XAML development UI model.
In my team case we were promotion a Windows Store APP to Universal APP and we get in trouble since we have a lot of user interface logic based on the DatePicker.
The optimal solotion would be to have the control in both devives ( phone and desktop/tablets) or at least a control that has the same behaviour and methods.
Sebastian Gomez is a developer who had the same problem and had strat to build a first implementation of WinJS datePicker (https://github.com/sebagomez/windows-phone-winjs-datepicker ). The only problem to use this in the context we had present above is that thiss control does not map every methods and properties the original WinJS control have.
Me and my team had extend the explendid work of SebaGomez and anchieve a solution that give us that desired behaviour, we had mantain gomez as the prefix of the namespace as a way to mantain the intelectual property to Gomez.
The instation of the control can be made the same way as a common WinJS control or the original WInJS control of Windows.
First of all you should copy the files Goomez.UI.DatePickerv2.js (implementation of the date picker ) and rx.lite.js (heper class to make easy the implementation of the DatePicker control) to your development enviroment.
In the view where you intend to instatiate the DatePicker:
– in the head make a reference to the files needed respecting the order of the files
– You can instatiate the control using a HTML tag where you declare the type of the control as being our control, like in others WINJS cases
– you can also instatiate the control dynamic form like you would do with any other WinJs control.
As you would do in a normal WinJS control. The usage of this control in the code is the same you are used to in WinJs controls. We had tried to implement every method’s the original WinJS DatePicker has in their interfaces.
I terms of interface the user experience is similar to the native datepicker avaiable in Windows 8.1.
On challenge the ones who will use this control may feel, is how to interact directly with the control deleting or upgrading information, if that is the case always remember that you are dealing with select box, so remember the DOM concepts and will be as easy to use this control as is with the original DatePicker.
You can get our files from the github public repository amarreiros/WinjsDatePicker_Phone, feel free to use the code and collaborate.
You can also get the original DatePicker from SebaGomez GitHub.
A special thanks to Gomez for the initial code and also to my team in Innovagency who had correct some bugs my extension had.
Digital Mind Ignition 