Microsoft has of course an answer to Flex - The Silverlight which used to be known as WPF/e for a while. In Microsoft's wording:
"Silverlight is Microsoft’s latest technology to design interactive web client with truly object oriented language C# with full support of VB .NET and other .NET citizens. Microsoft® Silverlight™ is a cross-browser, cross-platform plug-in for delivering the next generation of .NET based media experiences and rich interactive applications for the Web ... Silverlight offers a flexible programming model that supports AJAX, VB, C#, Python, and Ruby, and integrates with existing Web applications. Silverlight supports video to all major browsers running on the Mac OS or Windows.... " (the babble continues promising cure for cancer, food for Sudan and even the impossible - patriotism for the Bangladeshi middle class!)
Back on Earth, we the "Psycho group" at KAZ had a week of free time in between projects. So in the time honored way at KAZ we decided to do a spacer project to try out silverlight in all its Alpha glory and MS’s super hype! We decided to make a webtop with silverlight that would show an abstracted backend filesystem exposed by WCF.
This post is about our pains and joys during the project. Not gifted with great writing skills (apart from the coding kind) I will try putting down disperate items that we learnt or I felt like telling about our project.
First principle
Starting from Silverlight 1.1 the managed code is supported at client side. We decided to be very strict in this project to use only managed code for programming- no JavaScript. Like all principles this soon turned out to be a pain in a not so polite place :)
Installing Silverlight
To develop with Silverlight 1.1 you need Visual Studio 2008 (code name Orcas). While writing this downloadable beta version is available from Microsoft site. You also need Silverlight 1.1 plug-in distribution – alpha is available while writing this. Though not necessary the Silverlight 1.1 SDK is highly recommended. The SDK includes controls, samples, documents which may be useful to start. Please note that the Silverlight plug-in is required on any client from where the site is viewed.
Controls that comes from Boss
None!
Well not exactly true, but close enough. Silverlight 1.1 alpha distribution comes with a very limited set of controls. It has controls like rectangle, ellipse and label, canvas. It does not include button, edit box, scroll bar or any other advanced control. The SDK includes some controls like scrollbars.
Our Architecture
With no major controls available and no infrastructure for a shell, we soon realized that we need a petzold like approach to the project. We actually need to create a windowing system and the bare basics of message management.
Our final designe came out with 3 layers. Top layer is the application layer where user applications run. Middle layer is kernel which controls the events and communication between applications. It also provides a set of API for application developers. The lowest layer is an abstraction layer to communicate with the web server.
The system provides API’s for application developers for the platform while hiding the http calls – making the application development similar to desktop application development. Web call abstraction layer does that for user application.
The Kernel
The controller behind the scene controls form events, focus of controls, controls and windows to common file operations. The kernel has four main parts:
• Messaging System and Focus Manager
• Window Manager
• Process Manager
• File system Driver
• Resource Manager
Messaging System and Focus Manager
An event first comes to this manager and depending on the type routed to controls. If the user clicks on a control the focus manager updates the focus of controls. It keeps track of current on focus control. If it finds a change in focus it send OnLostFocus call to old control and OnSetFocus call to new focused control. With this exception most messages are routed to the focused control on arrival.
Window Manager
The window manager keeps track of each window that is created on the system. At any time window manager provides the list of windows currently available in the system. A utility application like TaskManager or TaskBar can use the list for display and control the windows. In our case the TaskBar buttons are created from the list and user can control minimize or restore operation from the TaskBar application. To keep track of the windows the window manager uses an internal generic Window list. When a new window is created the window is registered with window manager and when a window is disposed the window is unregistered.
Process Manager
The SilverlightDesktop applications that are created by implementing the IApplication interface in the main class are managed by the process manager. The process manager exposes a service to create a new process. It accepts class name as its first parameter and other parameters are passed through a Parameter object that can contain strings. On success the process manager returns a Instance object that can identify the process. Simplified version of Instance class is like this –
public class Instance
{
public int Handle;
public int ParentHandle;
public string Name;
}
The returned interface object can uniquely identify the process and it is required to handle the process.
Designing a new control
ControlBase class can be extended to design a custom control. The control may have a xaml also. The ControlBase getter ResourceName of type string should be overirden to specify the name of the xaml resource in the assembly. It is also possible to set the assembly of the control. The constructor of ControlBase class iterates through each resource and look for the specified resource to get the right xaml resource. Same technique is used in the Silverlight SDK. For example we want to have a icon control that has a image and text. Our xampl file would be similar to this:
<Canvas xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="32"
Height="50" x:Name="_container"
>
<Canvas x:Name="_icon" Width="32" Height="32" Canvas.Left="0" Canvas.Top="0"/>
<TextBlock x:Name="_name" Width="80" Height="15" Canvas.Left="-24" Canvas.Top="32" />
</Canvas>
We used a Canvas for icon, a TextBlock for label and a container canvas to hold them both.
And our code back for the control would be:
public class Icon : ControlBase
{
Canvas icon;
TextBlock text;
Canvas container;
protected override void OnInitialized()
{
icon = actualControl.FindName("_icon") as Canvas;
text = actualControl.FindName("_name") as TextBlock;
container = actualControl.FindName("_container") as Canvas;
}
protected override string ResourceName
{
get { return "Icon.xaml"; }
}
}
Now if we add some getter/setter we get the icon control ready to be used.
The Window
Window is a customized control- but is different from others. It uses mouse events to implement feature like drag/ drop, has a title bar and sizing buttons for minimize to system taskbar, maximize to cover full user desktop area or close button to close and dispose the control from the system.
Posts
