Telerik UI for Windows Phone by Progress

RadMosaicHubTile mimics the people hub tile on the Windows Phone home screen. It is a grid of small tiles that individually flip themselves to display a random image. Every now and then, an image is selected and is displayed magnified by multiple tiles in one of the corners the mosaic tile.

Using RadMosaicHubTile

Since RadMosaicHubTile is designed to exclusively display images, it has a simple API that makes displaying images very easy. It supports images added to the application project and from isolated storage by default. This api is a property called ImageSources and it is a collection of objects (IEnumerable). The objects can be strings that are the same as those that are set on the Source property of the Image class and it is implicitly converted to a relative URI internally (default behavior). Isolated storage images are specified by a string with the special "is://" prefix. For example to display an image called SomePicture.jpg in IsolatedStorage, the string should be "is://SomePicture.jpg".

RadMosaicHubTile tile = new RadMosaicHubTile();
Collection<string> images = new Collection<string>();
tile.ImageSources = images;

For full flexibility RadMosaicHubTile also exposes a property called CreateImageSource. It is named like a method because it is actually a callback of type Func. Developers can set this callback if they want to override the default string parsing and implement their own scheme in order to handle special URIs (see C# example below), or simply to convert from custom objects to an image source. In order to revert back to the default scheme, the CreateImageSource callback should simply be set to null.

private ImageSource CreateImageSource(object uri)
    return new BitmapImage(new Uri(uri.ToString(), UriKind.RelativeOrAbsolute));
tile.CreateImageSource = this.CreateImageSource;
If the objects inside the ImageSources collection are of type ImageSource the CreateImageSource should just cast the incoming object from object to ImageSource.