Display xaml as image in windows phone 8 live tile (custom tile)

One of the most beautiful feature of WP is the live tiles. Live tiles can display simple icon or  background and content on it.

Tiles can be used just for beauty purpose but the more useful reason is to inform the user about relevant information.

For example: weather, open missions, new requests etc.

 The regular way to create tile is pretty simple, you need to add icon/background image to your project and define some details in the manifest and the tile will display in the home screen (if the user choose to do that).

If you want to update the tile content then in the code you can do like the follow:

ShellTile.ActiveTiles.First().Update(new FlipTileData{Count=1});

But what if we want to do more than that? lets say we have a UI that has some text blocks that has important information and we want to display it in the tile in periodic time.

The template of the standard tile data is a constant, it has content, count and backgrounds and we can’t modify it as we want.

Another example is if we want to display randomly images from a local storage images or from the web but each image is in different size and the tiles size must be one of three defined size.

For the periodic mission we need to use ScheduledAgent and you can read about this here and for the tile itself the idea is to use WriteableBitmap.

Here is a great post that explain in details how to do that and also had source code to download. I not going to copy paste the solution… so read this post and enjoy 🙂

One thing to comment is the example use ManualResetEvent to block the scheduler thread from finish before the thread that work on the tile finish his work but you can use Task based programming and use TaskCompilationSource to achieve the same result.

Update:
Ariel Ben Horesh sent me this link http://msdn.microsoft.com/en-us/library/windows/apps/dn633914. So now there is a new way to do that.

Advertisements
This entry was posted in Windows Phone and tagged , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s