Friday, 28 January 2011

Prism, MVVM and Silverlight – Gripping it by the short and curlies – introduction.

Today, and for a few hours yesterday, I found myself “on the bench” for the first time in 4 years – that means I’ve got a little bit of time to brush up on some concepts, write some spikes and equip myself with some new tools before I start another engagement. I figured I’d use this time productively to brush up on the latest incarnations of Silverlight (4) and Prism (4) by trying to build out a sample application.

The question is, what to build? I only have a day or so which means I need it to be simple-ish, but interesting. Well, recently, I’ve been playing with an iPad application called Popplet (links: Website, get it on iTunes) – which is a pretty neat little app that lets you essentially drop post it notes (text or image) onto a canvas, drag them around into some layout that makes sense to you and connect the various boxes. I’ve used it for brainstorming ideas, thinking about application components and how they relate and a bunch of other things.

iPad Screenshot 1

Inspiration? Check! – this kind of application covers a bunch of things that I’d like to cover off with this exercise;

  • Expressing a reasonably complex model.
  • Visualising that model
  • Data templates or components for the notes.
  • Best way to do the connections between things
  • Decorating the notes with resize handles and (for our version) rotation.

So here goes – our back of a napkin specification;

  • As a user I want to see a canvas of notes.
  • As a user I want to be able to add a new note box to my canvas.
  • As a user I want to be able to rotate or resize any of my note boxes on my canvas
  • As a user I want to be able to connect note boxes
  • As a user I want to be able to delete note boxes
  • As a user I want to be able to zoom in and out
  • As a user I want to be able to drag my canvas around
  • As a user I want to be able to click a button to zoom out to the extents of my canvas so far.

At this point, I’m not going to bother with persistence – that’s a problem that’s well and truly solved, I just want to concentrate on the Silverlight side of life and I’ll stub out the service that would get the data for the user from the database.

So that’s the idea – I’ve spent around 8 hours on this so far and I’m quite impressed with how far I’ve been able to get – the screenshot below might look like crap, but it’s proving out some of the technical issues I’m interested in; If you’re interested, the top and bottom diagrams mirror each other and have two separate data templates – you can add new notes, move notes around, pan the canvas as much as you like and zoom in and out…. quite good for 1 working day!


In coming days I’ll post the full diary, along with all of the source code - I’m keeping a detailed log of the issues I faced and how and why I made the decisions I made in building the application – once I’ve got it all together and the app finished, I’ll post it here. Watch this space!

No comments:

Post a Comment