Download and compress images in ZIP format using the WebClient class in silverlight4

There are three main ways for Silverlight to communicate with other systems: direct communication through WCF or web service, HTTP, and socket communication.

 

For HTTP direct communication, you can use the WebClient class and httpwebrequest class. WebClient provides a simple event-based model that allows you to download and upload resources using streams or strings. httpwebrequest provides more complex communication scenarios. net asynchronous programming mode to send requests.

 

Here, I use the WebClient class to download and compress images in ZIP format. This is also an advantage of Silverlight, that is, images, videos, and other resource files can be compressed into ZIP format, download the file to the client through the WebClient class, and associate the resources in the ZIP file with the corresponding mediaelement or image to display the file. In this example, the effect is as follows:

Click the Download button to download the ZIP file. ListBox is a hard-coded list of several images bound to it. In ListBox, click the image list to display the corresponding image in the image control on the right.

 

Let's take a look at the XAML.Code:

<Grid X: Name = "layoutroot" background = "white"> <button content = "Download" Height = "25" horizontalalignment = "Left" margin = "12,21, 107 "name =" downloadbutton "verticalignment =" TOP "width =" 234 "Click =" downloadbutton_click "/> <ListBox name =" imagelistbox "Height =" "horizontalalignment =" left "margin =" 12,54, 135 "verticalignment =" TOP "width =" 234 "selectionchanged =" imagelistbox_selectionchanged "visibility =" Collapsed "/> <Image Height =" "horizontalalignment =" Left "margin =" 164,54, 224 "name =" image "stretch =" fill "verticalalignment =" TOP "width =" "/> </GRID>
 

 

Next, let's take a look at some members of the WebClient class:

 

here, the openreadasync method is used to asynchronously download the ZIP file as a stream. In the openreadcompleted event, the stream is obtained after the download is complete. The Code is as follows:

 private streamresourceinfo imageresources; private void downloadbutton_click (Object sender, routedeventargs E) {WebClient WC = new WebClient (); WC. openreadcompleted + = new openreadcompletedeventhandler (wc_openreadcompleted); WC. openreadasync (New uri ("/resource/images.zip", urikind. relative);} void wc_openreadcompleted (Object sender, openreadcompletedeventargs e) {If (E. error = NULL) {imageresources = new streamresourceinfo (E. result, null); this. imagelistbox. visibility = system. windows. visibility. visible;} else {Throw E. error ;}}

If no exception occurs during the openreadcompleted event, The ListBox is set to visible and the downloaded zip stream is saved using the system. Windows. Resources. streamresourceinfo class object.

Note the URI path problem. The relative URI with the leading slash is relative to the applicationProgramRoot location:

 

Finally, let's take a look at the code for obtaining and displaying the image:

 
Private void imagelistbox_selectionchanged (Object sender, selectionchangedeventargs e) {bitmapimage bitmapimagesource = new bitmapimage (); streamresourceinfo imageresourceinfo = application. getresourcestream (imageresources, new uri (this. imagelistbox. selecteditem. tostring (), urikind. relative); bitmapimagesource. setsource (imageresourceinfo. stream); this. image. source = bitmapimagesource ;}
 

Here, application. getresourcestream is used to obtain a specific image. The relative path of the image is relative to the image path of the ZIP file.

The complete background code is as follows:

Public partial class webclientdemo: usercontrol {private streamresourceinfo imageresources; Public webclientdemo () {initializecomponent (); List <string> imagelist = new list <string> {"01.jpg"," 02.jpg ", "03.jpg"}; imagelistbox. itemssource = imagelist;} private void downloadbutton_click (Object sender, routedeventargs e) {WebClient WC = new WebClient (); WC. openreadcompleted + = new openreadcompletedeventhandler (wc_openreadcompleted); WC. openreadasync (New uri ("/resource/images.zip", urikind. relative);} void wc_openreadcompleted (Object sender, openreadcompletedeventargs e) {If (E. error = NULL) {imageresources = new streamresourceinfo (E. result, null); this. imagelistbox. visibility = system. windows. visibility. visible;} else {Throw E. error;} private void imagelistbox_selectionchanged (Object sender, selectionchangedeventargs e) {bitmapimage bitmapimagesource = new bitmapimage (); streamresourceinfo imageresourceinfo = application. getresourcestream (imageresources, new uri (this. imagelistbox. selecteditem. tostring (), urikind. relative); bitmapimagesource. setsource (imageresourceinfo. stream); this. image. source = bitmapimagesource ;}}

 

Reference books: introducing Silverlight 4, msdn