This chapter is from the book
This chapter is from the book
This chapter is from the book
Exploring Silverlight 4 Demos
Now that Silverlight 4 is a little older, it is possible to see some nice samples on the web. To see these demos, you just need to install Silverlight 4 and to navigate to a URL.
Deep Zooming the Matterhorn
The Matterhorn Deep Zoom application was developed by Microsoft Switzerland to celebrate their 20th anniversary in Switzerland. It features multiple gigapixel pictures stitched together and processed in order to be rendered by the DeepZoom technology. We already talked about DeepZoom in Silverlight 2 Unleashed: A composer application prepares a large image by splitting it into a collection of tiles. Multiple resolutions of each tiles are prepared. When the image is loaded in the DeepZoom viewer (powered by Silverlight), the user can zoom in or out (for example using the mouse wheel or, if he has a supported multitouch screen, with a "pinch" gesture).
When the image is zoomed, the DeepZoom viewer dynamically loads the corresponding tiles from the server. To render the experience more dynamic for the user, the tiles are loaded at low resolution first, and then gradually the image is rendered with a finer grain until the maximum resolution is reached.
To start the Matterhorn DeepZoom application (shown in Figure 1.3), navigate to http://www.galasoft.ch/sl4-matterhorn. Clicking on the demo sets the application in full screen. Select one of the pictures and use the mouse's wheel to zoom in. Notice how the zoom action is smooth, and how the tiles, blurry at first, become sharper as more information is loaded by the application. More information about the pictures can be seen by clicking on the "info" button, which is a nice way to enrich a presentation.
)
Figure 1.3 The Matterhorn DeepZoom application.
Getting Involved Socially with Sobees
In today's World Wide Web, social networks have gained in popularity to become an unavoidable part of the browsing experience. Many people, however, do not use the social websites but prefer to use a rich aggregator instead. Sobees offer such applications for multiple platforms, including one built in Silverlight 4 and running either in the browser or installed out-of-the-browser. The Sobees application can be used to visualize entries from Twitter, Facebook, MySpace, and LinkedIn within one single window. It is also possible to perform multiple searches on Twitter.
To run the Sobees Silverlight application (shown in Figure 1.4), navigate to http://sobees.com/web. Follow the instructions to connect to the services that you want to aggregate. In order to install the application and run it like a normal Windows (or Mac) application, right click anywhere on the application's surface and select Install Sobees web alpha onto this computer. After confirming the operation, this creates a shortcut in your Start menu and/or on your desktop that you can use to run the application without starting the web browser.
)
Figure 1.4 Sobees Silverlight application.
Navigating with Bing Maps Streetside and PhotoSynth
Bing maps and the Streetside application are an interesting way to navigate geographical maps and to immerse yourself in a city, either to discover it in advance or to remember where your steps took you. Note that the "classic" Bing maps application uses standard web technologies; to get the Silverlight version, follow the URL: http://www.bing.com/maps/explore.
After the application is loaded, use the mouse wheel to zoom into the map. Note the smooth loading of details, powered by Silverlight. As you zoom in, the level of detail changes, and switches from map view to satellite view. This can be controlled using the "+" and "-" buttons on the bottom of the page (shown in Figure 1.5).
)
Figure 1.5 Bing maps controls.
Two additional features are available in selected areas: Streetside and PhotoSynth.
Exploring the Streets with Streetside
The idea behind Bing maps Streetside is not new but Silverlight provides a very smooth and innovative experience. First, you need to locate a region where Streetside is enabled. Click the second button from the right in the controls at the bottom of the page, as shown in Figure 1.5. This adds a number of blue areas to the map. Use the zoom controls to dive into one of these areas (for example the city of Seattle in the USA).
After entering the Streetside view, you can use the mouse to click around your location and navigate the available area. It is interesting to see how the pictures are deconstructed and reconstructed to provide an impression of speed as the view advances along the streets. It is also possible to press and hold the mouse to pan the picture around, and the mouse wheel to zoom in and out. For example, the Seattle Aquarium building is shown in Figure 1.6.
)
Figure 1.6 Bing maps Streetside in Seattle.
Discovering a Landscape with PhotoSynth
The PhotoSynth technology uses Silverlight to combine multiple pictures taken around a same object (building, monument, landscape, and so forth). To dive into a PhotoSynth from the Bing Maps viewer, look for a small icon as shown in Figure 1.7.
)
Figure 1.7 PhotoSynth icons.
Once the PhotoSynth viewer is started, use the mouse to click on the panes shown in Figure 1.8, in order to see a different view of the same object. The view is composed of multiple pictures stitched together automatically. Silverlight is used to smoothly pass from one picture to another, providing an impression of 3D as the viewer navigates around the object. For more information about PhotoSynth, refer to http://photosynth.net/.
)
Figure 1.8 PhotoSynth of the Statue of Liberty.
Visualizing Information with the Pivot Viewer
The Silverlight Pivot viewer is an innovative way to display large quantities of information and to sort it. Some examples start being published on the Web, for example the page at http://www.galasoft.ch/sl4-pivot which represents all the editions of MSDN magazine since 2000. Using links or a search box, you can refine the search as shown in Figure 1.9 and Figure 1.10.
)
Figure 1.9 Pivot Viewer: All MSDN editions.
)
Figure 1.10 Pivot Viewer: MSDN editions by popularity, zoomed in.
The Pivot Viewer is but one possibility to represent information in a rich manner with Silverlight. In this book, we will work with data often and create rich connected business applications with Silverlight. The power of computation that Silverlight has over classic web solutions, as well as innovative representations such as shown in Figures 1.9 and 1.10 allow creating compelling experiences.
Drawing on the Web with Fantasia
The Fantasia drawing application demonstrates some advanced graphics features of Silverlight 4, such as using loading and modifying pictures, adding effects to a scene, opening pictures from Flickr directly, and saving the result as an image file locally on the computer. We will talk about many of these features, especially in Chapter 16, "Using Effects and Recording Media." The Fantasia drawing application shown in Figure 1.11 is a nice place to see all these in action, and to realize what advanced graphics features are included in this version of Silverlight. It is available at http://nokola.com/fantasia/.
)
Figure 1.11 The Fantasia Drawing Application.