Passing parameters to silverlight applications

A Silverlight application is a useful tool for creating active web content, It works across many platforms and browsers and is, in my opinion, easier to program than Flash because the development tools are the same ones you would use to create the site.

A reusable silverlight application will often take some input from the web page that will need to be passed in when the page is loaded. Because Silverlight runs on the client however, this may not be the easiest thing to do.

The application shown on this page is a simple slide-show panel that enables you to specify a set of images and captions that can be displayed in order enabling the user to click through the list. Give it a go!

The panel takes the URL of an XML file as input. When loaded, the control reads this URL from the URL specified, decodes the images and captions specified in the file and loads them one by one on demand.

The asp:Silverlight control has a property called InitParameters that can be used to pass a number of key-value pair items to the control. On load, the control has the opportunity to read and act upon these parameter values.

The control itself loads an XML file that looks a bit like this:

<?xml version="1.0" encoding="utf-8" ?>

</Slides>

Step one is to load the key value pair which is done in the silverlight application startup:

private void Application_Startup(object sender, StartupEventArgs e)

{

MainPage mp = new MainPage();

this.RootVisual = mp;

mp.SlideShowURI = new Uri(e.InitParams["SlideShowURI"]);

}

The value updates a dependency property which has a property change handler:

public Uri SlideShowURI

{

get { return (Uri)GetValue(SlideShowURIProperty); }

set { SetValue(SlideShowURIProperty, value); }

}

// Using a DependencyProperty as the backing store for SlideShowURI. This enables animation, styling, binding, etc...

public static readonly DependencyProperty SlideShowURIProperty =

DependencyProperty.Register("SlideShowURI", typeof(Uri), typeof(MainPage), new PropertyMetadata(SlideShowUpdated));

In the change handler, the XML is loaded from the web server using the WebClient component:

private void Update()

{

WebClient wc =new WebClient();

wc.DownloadStringCompleted+=new DownloadStringCompletedEventHandler(wc_DownloadStringCompleted);

wc.AllowReadStreamBuffering = true;

wc.DownloadStringAsync(SlideShowURI);

}

void wc_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)

{

this.SlideShowXML = e.Result;

this.Indexer = 0;

Reindex();

}

The other functions in the control are carried out by the user clicking on the buttons to advance the slides or go back to review them. An index is maintained which specifies the current slide from 0 to N. A little logic is used to ensure that the slide displayed rolls back to zero if the end of the list is exceeded.

private void Reindex()

{

//this.tb.Text = this.SlideShowXML;

XElement ele = XElement.Parse(this.SlideShowXML);

var q = from i in ele.Descendants("Slide")

select i;

if (Indexer > q.Count()-1)

Indexer = 0;

if (Indexer < 0)

Indexer = q.Count() - 1;

this.MainImage.Source=new BitmapImage(new Uri(q.ElementAt(Indexer).Attribute("Image").Value));

this.tb.Text = q.ElementAt(Indexer).Attribute("Caption").Value;

}

private void Previous(object sender, RoutedEventArgs e)

{

Indexer--;

Reindex();

}

private void Next(object sender, RoutedEventArgs e)

{

Indexer++;

Reindex();

}

Obviously, being a silverlight control it could be made to be more attractive but that really just complicates the functional nub of the code so we'll keep it simple for now.

If you'd like to download the complete source for the silverlight slide presenter for use on your own site you may do so from this link...

NOTE: If you attempt to use this control in debug mode from your local machine it will throw a security exception. It will work just fine from a server offsite.