Nikhil Kothari's Weblog

Yellowstone National Park Photo Trip

Fri, 19 Jun 2009 21:53:49 GMT

Photos from a photo trip to Yellowstone and Grand Tetons National Park...
[Full post continued here...]

ViewModel with MVC/Navigation in Silverlight

Sat, 30 May 2009 16:13:46 GMT

I've been writing about ViewModel (aka MVVM) pattern (here, here, here and more) and implementing it in Silverlight.FX for quite some time now, and it continues to be an exciting area for further thinking, and prototyping. This time around I want to cover how ViewModel and MVC fit together in an application at the same time.

I have put together a set of navigation features into Silverlight.FX: a Page base class, a PageFrame control, and a Navigate trigger action. The PageFrame class by default maps URIs to Page types automatically, but at the same time supports plugging in an MVC PageLoader that maps URIs to Controllers and Actions, and maps ActionResults resulting from those actions into visuals or Pages.

Specifically the controller and the action methods enable writing navigation logic that runs in the context of when a view is being loaded as a result of loading a URI. The result of such an action, and navigation, is a Page and its associated view model. The view model on the other hand encapsulates interaction logic, i.e. the commands and operations and associated view state that come into play as the end-user interacts with the UI. Hopefully this post will show both using a sample application.

The diagram depicts the different building blocks and their relationships.

The Frame control hosts the pages and loads URIs when navigation occurs. The URI loading is performed by routing requests to Controller and its Actions. The controller performs any navigation logic, and potentially uses the data model and data access layer to load any relevant data as part of executing the action. The resulting ActionResult is mapped to a Page and its associated View Model. The view model contains properties, methods and events to encapsulate view state and interaction logic. The view consumes its view model by virtue of data-binding and commands, and subscribes to view model notifications using event triggers.

[Full post continued here...]

ViewModel + .NET RIA Services Part 2: Testability, Server Mocking and Dependencies

Wed, 13 May 2009 21:40:33 GMT

In Part 1 of ViewModel and .NET RIA Services, which I recommend you check out first if you haven't, I created a simple product search UI using Silverlight and .NET RIA Services using the ViewModel (aka MVVM) pattern. One of benefits of the ViewModel pattern is that it creates a nice contract between the view and associated logic, i.e. a contract between the designer and the developer. Another key benefit of the ViewModel pattern is that it furthers testability - more of your presentation tier is now unit testable. This post touches on that second benefit.

In doing so, it will allow me to go into a couple of other related topics:

First, this application uses .NET RIA Services. This post will demonstrate how you can mock out the server when using the client-side functionality of .NET RIA Services. This is important because it allows the view models to be tested independently outside of the end-to-end application, thereby minimizing dependencies.
Second, once we factor out dependencies from within the view model, we need something like dependency injection to initialize view models. This post will also demonstrate the super-minimal and lightweight IoC container and dependency injection implementation in Silverlight.FX

[Full post continued here...]

Locate Me and Virtual Earth Sample for Silverlight

Fri, 01 May 2009 04:05:02 GMT

A little sample app that uses Silverlight 3, the Virtual Earth Map Control CTP and IP-based geo-coding to implement the Locate Me scenario...
[Full post continued here...]

View Model Pattern with .NET RIA Services

Mon, 20 Apr 2009 07:55:10 GMT

Over the weekend, I saw a question on StackOverflow about combining .NET RIA Services and the ViewModel pattern and answered briefly there, but the topic is worthy of a blog post.

At a high level, .NET RIA Services generates a data model for use in the client presentation tier based on the application logic you author for the server portion of your application. The question is how could/should this data model fit into a view model. I blogged about the ViewModel pattern a long while back in the context of my Silverlight.FX work. This post will take care of a few things at the same time: (a) show how the two work together, and (b) show how the work in Silverlight.FX itself has evolved over time.

For most of the post, I'll walk you through a basic .NET RIA Services application. I'll of course use my favorite scenario, a Product catalog.

[Full post continued here...]

MouseWheel Behavior for Silverlight

Sat, 11 Apr 2009 06:20:57 GMT

A demonstration of the MouseWheel behavior to add mouse wheel-based scrolling in Silverlight applications, effortlessly, using Silverlight.FX and behaviors...
[Full post continued here...]

.NET RIA Services: From Vision to Architecture

Fri, 20 Mar 2009 21:08:57 GMT

.NET RIA Services is now public. And folks at MIX generally loved what we're doing in this space, which is a promising start. We don't yet have a great landing page for the technology but here is what the download page currently has to say:

Microsoft .NET RIA Services simplifies the traditional n-tier application pattern by bringing together the ASP.NET and Silverlight platforms. RIA Services provides a pattern to write application logic that runs on the mid-tier and controls access to data for queries, changes and custom operations. It also provides end-to-end support for common tasks such as data validation, authentication and roles by integrating with Silverlight components on the client and ASP.NET on the mid-tier.

A rather brief summary. There is also a walkthrough I recommend checking out to get a first hand feel at the basic usage. In this post, I want to share some of the thoughts and architectural concepts behind the bits. This is going to turn into a super long post, but I hope it is still a useful read, and provides insight to both evaluate and hopefully appreciate the bits.

As we looked at Silverlight planning, we realized RIA development is simply hard. There are too many moving pieces to manually stitch together between the client and the server. There are too many things that are un-natural, yet the norm, starting with the forced n-tier (many developers are used to writing 2-tier apps), async (when sync is the norm), dealing with latency (doing so incorrectly has the potential to break end-user experience), figuring out how to be less chatty, dealing with validation, conflicts, disconnected or occasionally connected scenarios, performing authentication and sharing user state across client and server, the list goes on and on...

We wanted to simplify RIA development... and bring back productivity for mainstream development, in much the same way that ASP.NET 1.0 provided client app developers a productive platform for developing Web apps. The pendulum has swung, and it is time to simplify RIA-style client development.

For many reasons, I like to think of .NET RIA Services and what we are doing as RAD for RIA.

[Full post continued here...]

.NET RIA Services MIX '09 Talk - Slides + Code

Fri, 20 Mar 2009 01:05:54 GMT

.NET RIA Services (formerly code-named Alexandria and what I have been working on for the most part during the past year) is now public. It has even been termed as the real premiere of Silverlight, which is nice to read as you might imagine :-). I had a similar blog post yesterday about the progression of Silverlight from its early v1 roots to a real app platform in v3.

A quick description of .NET RIA Services is in order:
.NET RIA Services builds on Silverlight 3 on the client and ASP.NET on the server to simplify building n-Tier data-driven applications. First, .NET RIA Services provides a prescriptive CRUD-based pattern for authoring your application/domain/business logic, i.e. queries, operations, rules for authorization, validation etc. on the middle tier and makes that functionality easily consumable from your presentation tier in the form of bindable data. Second, on the presentation tier, we're providing new data controls such as a DataSource, enhanced DataGrid and DataForm/DataPager controls for mainline data/LOB scenarios. Third, we're also providing higher level building blocks such as authentication, cross-tier user state and the like.

I have some more insight to share (that deserves its own blog post) around what .NET RIA Services really is, but I wanted to do a quick post related to my MIX talk, T41F - Building Data-Driven Applications in ASP.NET and Silverlight (click for the video). Here are the accompanying slides and code:

[Full post continued here...]

Silverlight Makes Version 3 at MIX '09

Wed, 18 Mar 2009 20:16:53 GMT

Silverlight Version 3 takes center-stage at MIX '09, and shapes up to be a great platform for RIA and LOB apps. More coming by way of .NET RIA Services...
[Full post continued here...]

TemplatePanel (aka MasterPage) for Silverlight

Tue, 10 Mar 2009 15:14:43 GMT

In my last post, I introduced the current set of layout panels provided by Silverlight.FX. All of those panels positioned their children by computing the size and position based on desired and available sizes, i.e. by overriding the measurement and arrangement API, as expected of Panel-based elements.

This post is about a control named TemplatePanel. TemplatePanel is similar to other panels, in that it has some children that it is responsible for positioning. However it doesn't take on measurement and arrangement itself. It uses a different strategy - specifically it is associated with a template that defines a scaffolding that contains one or more named ContentPresenter elements, and TemplatePanel matches its children to the individual ContentPresenter elements within that scaffolding for positioning and laying them out.

There are a couple of analogies to other well established precedents that best explain the model:

Master pages in ASP.NET. If you're an ASP.NET developer you're probably familiar with these. Master pages can contain ContentPlaceHolder controls, and at runtime contents of a content page are inserted into the control tree defined in the master page at the right spots. TemplatePanel is similar, but is more general-purpose. It isn't tied to pages and navigation, and can instead be placed anywhere in the visual tree. At the same time it can be used to define the structure of pages for the classic navigation scenario as well.
Slide master in Powerpoint. This is one that all of you are likely to know what I am talking about. Slide masters define regions that specify where the title of the slides go, where the content goes, amongst other non-editable element such as a logo image. Each slide then defines the content for that slide instance, and the end result is a visual merge of the content in the master with the content on the slide.

The Silverlight Store application makes extensive use of this feature. When you run the app, you'll see different sections of the page have a similar look: a header, a body and a footer. They are implemented by using three instances of the TemplatePanel control. The TemplatePanel control allows defining the scaffolding around the elements that is common to each section just once, and optionally in a theme, so you can swap in and out the scaffolding without touching every page.

Here is how a TemplatePanel is typically declared:

[Full post continued here...]

Specialized Layout Panels for Silverlight

Sat, 07 Mar 2009 05:40:14 GMT

The layout system in Silverlight is, in my opinion, one of the key differentiators in presentation engine capabilities from HTML/CSS (on a related note, see my post long ago about my browser/scripting wish list and the references to need for core layout primitives).

The Silverlight platform provides a set of out-of-the-box layouts like Grid, so you don't have to simulate them with low-level absolute positioning, and float/clear css attributes. However, beyond that, you can build your own first class layouts, and in this post I'll discuss the handful of layout panels that I've written for Silverlight.FX, that I've found useful in application building.

Silverlight.FX currently has five layout panels: TilePanel, HStackPanel, VStackPanel (which derive from a base AnimatedPanel), XGrid, and FormPanel. It also has something called TemplatePanel, but I'll discuss that in a separate post, as it does a bit more than layout. I wanted to share a bit of information about the current set of panels, their scenarios and the motivation for them.

[Full post continued here...]

Silverlight.FX and Silverlight Store Sample App

Wed, 04 Mar 2009 22:35:42 GMT

I've got a project page finally up for Silverlight.FX, so it can be easily linked to rather than some arbitrary blog post of mine that alludes to it, and is a one-stop spot for the latest build, and relevant links and pointers to samples. As always, the full source code for the sample along with source code for the framework is available. For those who'd like to track progress as it happens, you can watch it on the associated GitHub repository as well. You can even fork and experiment if you'd like… I would definitely love to hear what you think about the project. Eventually I might set up something dedicated for facilitating discussion if there is interest.

While Silverlight.FX is something I use to prototype ideas into more tangible building blocks, some of which may eventually get incorporated into the platform, I am building the framework with concrete patterns and app scenarios in mind, so it is useful in its own right. Here is my one-line description of what Silverlight.FX is:

A small and lean framework that facilitates more structured and more declarative app development (eg. separation of view/code, effects, behaviors etc.) using Silverlight.

I've built a small collection of sample applications to highlight the features and concepts. Nothing beats app-building to help flesh things out. One of the applications is Silverlight Store - this is a small little application that allows you to search the Amazon catalog, as well as check out the latest deals and bargains, add them to your cart, and then do a checkout (for real if you go all the way). Below is a screenshot.

[Full post continued here...]

Inspiration for Next Generation UX

Tue, 03 Mar 2009 18:26:00 GMT

An inspiring concept video of what next-generation UX could be and what digital life might be...
[Full post continued here...]

MIX '09 Plans

Tue, 03 Mar 2009 07:17:37 GMT

My MIX plans, and some hints about what my presentation will be about...
[Full post continued here...]