As promised, I've just completed a 15-minute video tutorial that shows you how to create a Silverlight 2.0 application using DeepZoom. Even if you are unfamiliar with DeepZoom and just want to learn how to build a cool Silverlight application, this is the tutorial for you!
The tutorial covers project setup as well, which I think is quite valuable if you're new to the whole Blend / VS 2008 / Silverlight gig.
What am I building?
This. Click to focus the control, press W to zoom in, press S to zoom out.
What you need
This is loosely based on Scott Hanselman's early work following the announcement at MIX 2008. If you are interested in doing more with the mouse, such as dragging and the mouse wheel, check out his article.
Watch it here, or download it full-resolution at the bottom of this article.
Here's a snapshot of the code in Page.xaml.cs that handles the primitive zooming. Note: The variable 'dzo' is a reference to the MultiScaleImage control in my project, short for "DeepZoomObject."
1: namespace DeepZoomFrog
3: public partial class Page : UserControl
5: Point _currentMousePosition = new Point();
7: public Page()
13: private void InitializeEvents()
15: this.MouseMove += new MouseEventHandler(Page_MouseMove);
16: this.KeyDown += new KeyEventHandler(Page_KeyDown);
19: void Page_KeyDown(object sender, KeyEventArgs e)
21: if (e.Key == Key.W) // zoom in
22: Zoom(1.2f, _currentMousePosition);
24: if (e.Key == Key.S) // zoom out
25: Zoom(0.8f, _currentMousePosition);
28: void Page_MouseMove(object sender, MouseEventArgs e)
30: _currentMousePosition = e.GetPosition(this);
33: private void Zoom(double zoomFactor, Point pointToZoom)
35: Point logicalPoint = dzo.ElementToLogicalPoint(pointToZoom);
36: dzo.ZoomAboutLogicalPoint(zoomFactor, logicalPoint.X, logicalPoint.Y);
Note you will need a Windows Live ID to access my public SkyDrive folder