Saturday, April 19, 2008

Deep Zoom - SlideShow

I was wondering how best to showcase the functionality from my last post and the idea of SlideShow popped up in my head. Also, I was bored and wanted to play around with Deep Zoom some more...

Update Oct 14, 2008: Removed the example from this post to reduce load time of this page. Please use the example from this post, DeepZoom sample ported to Silverlight 2 Beta 2, to try the functionality.



Click on the Start Slide button to activate the slide show. Click on the button again to stop the slide show.

The code to enable slide show is very simple. Most of the work is done by the function described in my last post.

Xaml
<Button Grid.Column="2" x:Name="buttonSlideshow" Width="70" Content="Start Slide" IsEnabled="False"/>

Code

int _slideshowImageIndex = 0;
System.Windows.Threading.DispatcherTimer _myDispatcherTimer;

msi.Loaded += delegate(object sender, RoutedEventArgs e)
{
_myDispatcherTimer = new System.Windows.Threading.DispatcherTimer();
_myDispatcherTimer.Tick += new EventHandler(Each_Tick);
buttonSlideshow.IsEnabled = true;
};

buttonSlideshow.Click += delegate(object sender, RoutedEventArgs e)
{
if ((string)buttonSlideshow.Content == "Start Slide") {
buttonSlideshow.Content = "Stop Slide";
StartSlideShow();
}
else {
buttonSlideshow.Content = "Start Slide";
StopSlideShow();
}
};

public void StartSlideShow()
{
// Set the timer interval to 200 ms so that the tick event is called immediately
_myDispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 200);
_myDispatcherTimer.Start();
}

public void StopSlideShow()
{
_myDispatcherTimer.Stop();
}

public void Each_Tick(object o, EventArgs sender)
{
// Reset the timer to 5 sec so that each slide appears after 5 seconds
_myDispatcherTimer.Interval = new TimeSpan(0, 0, 0, 0, 5000);
ZoomFullAndCenterImage(_slideshowImageIndex);
if (++_slideshowImageIndex == msi.SubImages.Count)
_slideshowImageIndex = 0;
}

6 comments:

Marauderz said...

Hey Wilfred, your idea for a slide show, I have something that is just like it.

I'll send you the link once I type up my post.

But for now, here's the output for the program
http://silverlight.services.live.com/invoke/5089/dza-sample/iframe.html

marauderz said...

OK.. I have uploaded my post already, please do check out my DeepZoom album creator. The arrangement code was all from your website. Thanks for your time and insight into this!

http://www.marauderzstuff.com/PermaLink,guid,2dbe34b8-306a-45cf-8bf1-db718a5c998c.aspx

Wilfred Pinto said...

Marauderz,

Nice work! Glad to see my work getting leveraged in some useful tools.

I like challenges so let me know if you need help with a complex Deep Zoom task.

Wilfred

Anonymous said...

How do I get this code to work with Silverlight 2 RC? I get many errors when I cut'n'paste. :(

Wilfred Pinto said...

You can find the source code for Silverlight 2 RC here

I haven't tried running it yet but it compiles fine on Silverlight 2 RC.

Regards

Wilfred

iimagegrapher said...

I like http://www.imagesurf.net for online deep zoom of photos.