Sunday, March 30, 2008

Silverlight DeepZoom Part 2

I have rewritten the code sample released on Expression Blend and Design blog last week into VB version with the following changes:

1.
When the MultiScaleImage (MSI) is loaded, it displays the images as you put them in DeepZoom Composer. I overwrite this default behaviour by handling MotionFinished event of MSI to call ArrangeIntoGrid() method. An interesting fact, if I handle the MSI's Loaded event, nothing will display on screen.

2.
In ArrangeIntoGrid(), I change the assignment of number of columns and rows of MSI into this:
Dim columns As Integer = Math.Sqrt(totalImages + 1)
Dim rows As Integer = totalImages / columns
where totalImages is total number of MultiScaleSubImage of MSI.
This is to ensure no matter how many images I put into my DeepZoom application, the application will always tries to arrange images into square tiles and fill the width of the screen when loaded for the first time.

3.
I add control to Zoom() method so that users cannot zoom in / out too deep until the view port is gone. I saw an example of using ViewportWidth property to control the zooming, but it is not perfect. So I calculate the current zoom factor to control the zooming. This method is better but still not perfect.

So here is my source code and video demo.



Outstanding issues:

  • How to perform hit testing to identify selected image?
  • How to retrieve meta properties of selected image?
  • How to prevent users from dragging the viewport out of the boundary?
  • A better way of filtering besides using Opacity = 0
  • Arrange the images of different sizes 'properly' into grid

1 comments:

Wilfred Pinto said...

You can check out my blog at http://projectsilverlight.blogspot.com for answers to some of the items on your todo list.