Archive for the ‘Architecture’ Category

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.

Universal Diagram

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 (

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.

Object name Description
BackButton object and all its members Not needed. Apps that target Windows Phone should listen for the hardware backbutton event. See WinJS.Application.onbackclick
CellSpanningLayout and all its members Use GridLayout or ListLayout instead.
DatePicker object and all its members Use SELECT and OPTION HTML elements.
Hub object and all its members Replace with the Pivot control. See section above.
HubSection object and all its members Replace with the Pivot and PivotItem controls. See previous section.
SwipeBehavior enumeration Replace with phone-appropriate gestures.
Flyout object and all its members Navigate to a new page or use the Windows.UI.Popup context menus.
Menu object and all its members Navigate to a new page or use the Windows.UI.Popup context menus.
MenuCommand objectand all its members Navigate to a new page or use the Windows.UI.Popup context menus.
NavBar object and all its members Replace with AppBar and AppBarCommand controls.
NavBarCommand objectand all its members Replace with AppBar and AppBarCommand controls.
NavBarContainer objectand all its members Replace with AppBar and AppBarCommand controls.
Rating object and all its members Use SELECT and OPTION HTML elements.
SearchBox object and all its members Use INPUT HTML element with the type attribute “text”.
SettingsFlyout object and all its members Navigate to a new page or use the Windows.UI.Popup context menus.
TimePicker object and all its members Use SELECT and OPTION elements.
Tooltip object and all its members Navigate to a new page or use the Windows.UI.Popup context menus.

Source of this table can be found at Microsoft in the following URL:

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 ( ). 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.


Last Month Microsoft Potugal had invite me to make 2 sessions at the Microsoft Tech Refresh an event to show the development community what’s new and what’s caming next you can have a look ate the agenda in the figure


I was responsible for the deliver of the sessions  Web Application Development using WinJs and Universal Apps Development using HTML 5 and WinJS.

Was a good experience once more i had discover that few people had explore and know the really potential to use HTMl and WinJS on the development of Windows store apps. Was a great event and i was blessed with a great audience in my sessions very interested people with the potential to raise a technical discussion taht will lead them to learn more.

Thanks Microsoft Portugal for this amazing opportunity and a special thanks to the technical community taht once more had recieve me very well at the stage.

You can find the resources of this sessions at my slideshare.

Windows 8 Security

Posted: November 17, 2012 in Architecture, Programming, Windows 8

One of the main focus of Windows 8 development is the web development community and the idea that this is a great opportunity to make the evolution from Web development to App development. I also defend that theory and i think that this is a real deal and opportunity, but what i always say at the training sessions is that in app development we must consider a lot of little things that some of Web developments normally don’t do.

In my Windows 8 training sessions for WebDeveloper’s one of the things i keep remembering to my student’s is the security and performance mindset a app developer must have.


Today i found at the MSDN magazine a great article about the security part and that follow the same guideline i defend i would suggest to all the Web developer’s that had start to build Windows 8 app’s or to the core Windows 8 developer’s that are in the HTML 5 + CSS + JS to give a look at this.

Many people had been asking around why the surface and some other tablets that will be powered by Windows 8 have a little percentage of available memory.

As far as i am concern i think this is not a fail but a vision of the new times, Cloud is here do we really need big disk’s if we are almost always conected?

The next question that some people ask me in the developer quorum is “Ok so i guess i can store my data on skydrive azure and that’s all”, that kind of reaction made me think yesterday.

Maybe people hadn’t seen yet how they can connect Windows 8 and Azure and what amazing things can be made for our app in the cloud.

So i would suggest all to read the blog post of Bruno Terkaly on of the Microsoft developer’s evangelist’s

If you are around Porto and go to the Microsoft Portugal WAWZapp event,  Nuno Silva a Microsoft Technical evangelist will also talk about these theme bu not only thinking in Windows 8 but also in the new Windows Phone 8.


Ok so you are a windows 8 App developer you create packages that you install in your or in some machines, and maybe you had already submit to the store your app. But, what’s a Windows 8 package after all, in this post we will try to answer that question and show how everything is processed.

The windows 8 package is presented in the form of a file with the appx extension.

This file behaves as a zip file that contains some files and is descriptions and dependencies.

This file contain’s not only the app code but also a manifest the app resources an AppBlockMap and the libraries used by the application.

The manifest is the part of the app where we describe the capabilities of the app and her platform needs (webcam, Localization etc). The manifest describes also the app dependencies, and enumerate some of the identity of the app like the name and logos.

The AppBlockMap describes how the memory blocks of the application are assigned, the blockmap allow us also to determine what parts of an app have been updated between different versions of the application. This is particular useful to the store to optimize the download of the new version of an application sending only the blocks that are related to the new version.


The appx contains also a certification signature that is given by the Windows Store to certified the application (in an initial stage this signature is given by the visual studio)

After publishing an app to the Windows store, any user who has access to the Windows Store can download and install your application.

When selecting install an app from the Windows Store, the appx package is downloaded to the device and installed automatically along with is dependencies. The installation process intends the creation of a folder where the app will be extracted.

The installation process will also make the necessary installations in the registry and enables the different needs present in the appx Manifest.

One of the questions the author can think right now is about acceptance of the Licence terms or the payment of the application, all this are integrated with the install action of the application in the store.

Nowadays we can found a lot of posts over the internet about new Microsoft windows 8 capabilities or Windows 8 Metro style Apps.  Since i am diving in to this platform since the public announcements of the developer preview, i decided today to take sometime to make a journey with you in a different view of windows 8.

I am talking about windows 8 runtime. This is the first post of our win RT journey.

Win RT is the codename that stands for Windows runtime, and is the software block of the new windows that powers metro style applications.

!important: remember that at the time of this written Windows 8 is at the consumer preview version so that can happen some slightly changes in the final versions.

Presenting WinRT

Presenting WinRT as a concept can be made on 4 different sentences:

  • Is a bunch of Windows Management APIS used to build Metro Style applications;
  • Is the runtime that manages the resources necessary to make a Metro Style APP run;
  • Is the maestro between the different software blocks that connects windows core and metro style apps;
All the sentences above are true and complementary views so if we try to condense all this view in to just one we will found the definition presented by microsoft since the build event
“WINRT is the solid, efficient foundation to build and run metrostyle APPS”
Localize WINRT in Windows 8
After understanding what is and what the mission of WINRT, let’s position Metro APPS in to the Windows 8 Universe and find the action place of WINRT.
                                                                                         (image copyrights to Microsoft)
 As you can see from the figure above and as you maybe already know, windows 8 windows support 2 kinds of different interaction paradigm (and build) apps.
  • Desktop Apps : the usual kind of applications we are used to in a windows operation system
  • Metro Style Apps: apps that follow the patterns of Metro style principles

As you can see from the picture Metro Style Apps are supported by a bunch of APIS named Windows Runtime APIS, this APIs correspond to the programmatic service interface of Windows runtime over the Operating System Kernel (like win32 or .NET libraries) . Basically WinRT sits right on top of Windows as a thin layer, exposing functions of Windows. These functions can be used in Metro style apps from all languages.

The figure above shows the different APIs used by developers to build Windows 8, that provides the abstraction layer over the operating system.

  • User Interface: Abstraction layer related to the handling of controls and other Visual and user interaction objects.
  • Devices: Abstraction layer that gives the developer an abstraction over the different devices that are assembled in the machine where the operating system runs (sensors, GPS and others).
  • Communication & Data: Abstraction layer over the communication between apps and systems.
  • Fundamentals: The core of the windows Runtime this API is an abstraction layer over the basic computation processes and needs of the application like memory management, security and others.

But Windows Runtime is much more than just a bunch of APIS, the most beautiful part is the runtime system and our main goal is to deconstruct and understand how this runtime works, so let’s continue our journey.

Discovering Windows Runtime Architecture

Let’s make take a deep look in to the Windows runtime deconstructing and understanding his architecture.

Windows Core: correspond to the services of Windows;

Windows runtime core: Is a Layer that exposes the Windows services, definition of types exposure of interfaces, is the core of the runtime;

UI, Pickers, Controls; Media; XAML;Storage; Network;.. : Some APIS that live on the top of windows runtime;

Windows Metadata & Namespace: The runtime give us the concept of metadata for types, what allow us to manage and get in a natural way the runtime notions of types.

Web Host: A host for Web applications;

Runtime Broker: is a separate process that handles the security permission of separated processes like sensors or cameras;

Language projection: A mechanism that allows the windows runtime API be exposed in a different way according to the language in usage;

Language support: Is the implementation of the technologies to allow the support of windows runtime over the different languages (WINJS,  CLR )

Thanks to is design and architecture of Windows Runtime it is allowed to create applications over Windows 8 runtime that respect the fundamental software development principles:

  • Major improvement of developer experience and freedom: thanks to the language projection and metadata developers can choose and use different languages without losing functionality and thanks to metadata we have great intellisense.
  • Responsive and fluid user first: One of the principles of windows 8 programing is assyncronism, that option is imposed in some cases by the platform and WINTRT;
  • APP Centric platform: Applications are isolated as they was in the past (with processes boundaries) but are possible the creation of contracts between apps and operating system and the manage of app to app contracts;
  • Versioning: The runtime enables the concept of version in a way that each application as the reference of built and can run in future systems, because runtime knows how to get that information and can adapt to the needs of the application.

That’s all for now, in the next post we will take a look in to Windows metadata and to the way memory managed and objects are supported. Thanks for your attention and stay tuned.

Next posts: