Cross-Training in Silverlight & Flex – Platform Overview

October 26th, 2010

More Cross-Training in SIlverlight & Flex

Shout it

This is the second article in which I will compare the technical details between Silverlight and Flex. Before I jump into the nitty-gritty of the two, I thought I would give a general overview of the platforms that are Silverlight and Flex/Flash/Air. Understand these terms and the tools up front will make it much easier to cross-train on the two technologies.

The Silverlight Platform

Microsoft created Silverlight as a small platform for developing Rich Internet Applications (RIAs) on the desktop, browser and mobile phone. Although it was inspired by the .Net platform and the Windows Presentation Foundation (WPF), Silverlight stands alone. In other words, users do not need to download the entire .Net runtime to execute Silverlight applications. They only need the small (about 4 MB) Silverlight player. 

As Flex is a framework that sits on top of the Flash platform, Silverlight is both – a runtime and an SDK. Silverlight applications can be developed to run “out of browser” on the desktop (similar to Adobe Air) or in-browser (similar to Flash Player). When run out of the browser (OOB), the application has access to extra APIs for file access and other system-level functions. Silverlight is also the primary application development platform for the Windows Phone 7.

Developer Story

Much like Flex, Silverlight employs a declarative UI mechanism (XAML) for defining the view of an application. Unlike Flex, Silverlight developers have the choice of many languages to integrate in their “code-behind” such as C#, Visual Basic.Net, F#, IronRuby and IronPython. The majority of Silverlight developers use C#.

IDEs

Most Silverlight applications are developed using a version of Visual Studio, which is an IDE similar to Flash Builder.  Visual Studio comes in many flavors. Visual Web Developer Express is free and great for getting started. Most likely, as you get more involved with Silverlight, you will need to migrate to a paid version (Professional, Premium, Ultimate or Test). Although highly recommended, you do not need to use Visual Studio to develop Silverlight applications – the free SDK and command-line compilers are enough to build applications with. The open-source MonoDevelop is also an option for developing Silverlight applications. It is worth noting that Visual Studio is only available for Windows. Mac developers have the tools to develop Silverlight applications using Eclipse but this rarely happens.

SDKs and Toolkits

Unlike Flex, the Silverlight SDK is not open-source but it is free. It includes the minimum tools necessary to build Silverlight applications. Very often, build servers and CI servers use the SDK alone, to avoid purchasing a license to Visual Studio on the server. Although the SDK is not open-source, the Silverlight Toolkit (produced by Microsoft) is. The Silverlight Toolkit is an optional set of libraries that includes many add-ons such as rich controls, extended skinning and an in-browser test suite (Silverlight Unit Tester).

Design

Visual Studio has an integrated graphical designer, but it is limited. Most people use Expression Blend to design, style and skin the UI. Expression Blend supports the import of assets from Photoshop and Illustrator. Expression Blend works on existing Visual Studio projects in parallel. This aids in a very tight integration between the designer and the developer. Flex cannot support this workflow very well. Even with the new version of Catalyst, projects are exported between the designer and developer – as opposed to the parallel workflow that Blend enables. Expression Blend only works in Windows.

Operating System Support

Silverlight does not have the same operating system penetration as Flex/Flash. Microsoft has fully committed to Windows and OSX for the browser and OOB capabilities. Silverlight does not, however, work in Linux. A separate project, dubbed Moonlight, aims to run Silverlight applications in Linux. This project is headed by the Mono team and it is perpetually behind the latest release of the Silverlight platform. Silverlight also runs as the primary application platform for the Windows Phone 7 and is being developed for Symbian, but it does not run on Android, WebOS, or iOS at this time. (possibly, in the future?)

Getting Started

The easiest way to get started with Silverlight is at Silverlight.net. From there, you can download all of the tools necessary to write applications in SIlverlight (Visual Web Developer, Expression Blend trial, Silverlight toolkit, etc)

 

The Flex/Flash/Air Platform

In my opinion, the branding of Flex/Flash/Air can be confusing. I will attempt to make it simple. Flash is the platform.  Flex is the framework. Air is Flex/Flash on the desktop (and devices outside the browser). In other words, Flash is the platform we all know and love. It has existed for a long time (since at least 1996) and has a rich history. Flash, by itself, is not very good at writing Rich Internet Applications (RIAs) – it is very good at vector animation. Flex was introduced as an SDK to sit on top of Flash to enable application development. Air was introduced to allow Flex applications to run on the desktop.

If you were to compare the Adobe technology to Silverlight, Flex/Flash is to Silverlight as Air is to Silverlight Out-of-Browser.

Developer Story

Much like Silverlight, Flex employs a declarative UI mechanism (MXML) for defining the view of an application. Unlike Silverlight, Flex developers only have one language choice available to them – ActionScript. ActionScript is an ECMAScript-like language, similar to Javascript but with optional static typing, classes and interfaces. Developers can also enable legacy C and C++ code to run in the “ActionScript Virtual Machine” by using a currently in-development technology called Adobe Alchemy.

IDEs

Developers tend to use Flash Builder as the IDE for producing Flex applications. Unfortunately, there are not any free versions of Flash Builder (there is a free 60 day trial). Flex developers also have the option to use IDEA Ultimate by JetBrains, which is also a paid product. Unlike SIlverlight, these IDEs work in WIndows, Mac or Linux. Like Silverlight, the SDK is free and does not require an IDE to develop with. Other options are FlashDevelop and Tofino – a Visual Studio plug-in for Flex development.

SDKs and Toolkits

The Silverlight SDK is not open source. The Flex SDK, however, is open source. It is a very simple zip-deployed download that can be copied anywhere you need. This makes integration with build and CI servers a cinch. By default, you use Ant for the build system, but any build manager. Similar to the Silverlight Toolkit, flexlib is a suite of value-added controls that you can bring into your solution.

Design

Since Flex is an Adobe product, the primary design environment is Photoshop (raster art) and Illustrator (vector art). A third tool, Catalyst, is added as a bridge between the art tools and Flash Builder. Catalyst allows you to produce skins and styles using the Flex parts model. In the current release, the workflow is one way – Catalyst exports to a Flash Builder project. In future versions, Flash Builder will be capable of exporting back to Catalyst for a more bi-directional workflow. As far as I know, Catalyst does not support the parallel designer-developer workflow that Expression Blend does. 

Operating System Support

Flex has a rich set of operating system support. Flex already works in Flash (browser) on Windows, OSX, Linux and Android. In the near future, Air applications will also be deployable to iOS, Blackberry, Android, Windows Phone 7 and GoogleTV in addition to Windows, OSX and Linux. The list is so exhaustive, I am probably missing some. In future versions of Flex, Adobe has strategies for managing different form factors. Air 2.5 will include all of the APIs for mobile devices that you would expect (GPS, accelerometer, multi-touch, etc).

Getting Started

The easiest way to get started is to go to the Flex product site and download the 60 day Flash Builder demo. Adobe also has demos of Catalyst, Photoshop and Illustrator.

Cross-Training in Silverlight & Flex

October 24th, 2010

When I joined SRT Solutions a while back, one of the primary reasons for the move was to get exposed to new ideas and technologies. Although my first project at SRT didn’t stray much from my Silverlight expertise – an MVVM-driven WPF application – my second project is taking me in a slightly different direction Read More...

Adventures in Ruby MVVM – Wrapping it up

September 26th, 2010

More Adventures in MVVM Source code for the RubyMVVM playground on BitBucket It has been quite a while since I blogged.  Actually, I was just about to sit down to write this blog post about 7 weeks ago when my wife went into labor.  Soon afterwards, she gave birth to our second child -- a son named Eli Hecker Genisio Read More...

Adventures in Ruby MVVM – Bootstrapping Ruby

July 7th, 2010

More Adventures in MVVM In this post, I want to discuss how I am loading the ViewModels into the View.  When I write my Views, I like to use the tools I have available to me; Visual Studio and/or Expression Blend.  This means that I want a Visual Studio project and I want to be able to use these tools to create new views quickly Read More...

Adventures in Ruby MVVM – A ViewModel Base Class in Ruby

June 19th, 2010

More Adventures in MVVM Disclaimer: When it comes to Ruby, I am still a hack.  That is all. :) In my last post, I talked about how to fire events from Ruby code such that .Net code can subscribe and receive them.  I showed a simple implementation of INotifyPropertyChanged; the interface that is essential to MVVM development in WPF and Silverlight Read More...

Adventures in Ruby MVVM – Firing Events from Ruby

June 14th, 2010

More Adventures in MVVM Disclaimer: When it comes to Ruby, I am a hack.  That is all. My Experiment: Can I move over to Ruby as my primary programming language when developing WPF and Silverlight applications?  I have been playing around with what it would mean to use Ruby to write my ViewModels, which would also make it easier to incorporate models using Ruby Read More...

Adventures in MVVM – ViewModel Location and Creation

June 4th, 2010

More Adventures in MVVM In this post, I am going to explore how I prefer to attach ViewModels to my Views.  I have published the code to my ViewModelSupport project on CodePlex in case you'd like to see how it works along with some examples. Some History My approach to View-First ViewModel creation has evolved over time Read More...

Disabling Navigation Flicks in WPF

June 2nd, 2010

I am currently working on a multi-touch application using WPF.  One thing that has been irritating me with this development is an automatic navigation forward/back command that is bound to forward and backwards flicks.  Many of my touch-based interactions were being thwarted by gestures picked up by WPF as navigation Read More...

Adventures in MVVM – My ViewModel Base – Silverlight Support!

May 14th, 2010

More Adventures in MVVM EDIT: Here is why I love blogging and sharing code so much: Putting your ideas and code out into the public space always manages to add value to the ideas that were originally posted.  Case in point: Tobias Richling commented on this post with a fantastic refinement to the Silverlight dynamic property binding Read More...

Adventures in MVVM – My ViewModel Base

May 8th, 2010

More Adventures in MVVM First, I’d like to say: THIS IS NOT A NEW MVVM FRAMEWORK. I tend to believe that MVVM support code should be specific to the system you are building and the developers working on it.  I have yet to find an MVVM framework that does everything I want it to without doing too much Read More...