From the Windows 8 start screen to the XBox, SkyDrive and Windows Phone – tiles seem to be everywhere. Live tiles soup up regular tiles by providing animation, imagery, interactivity, and live data displays that enhance user experience. Did you know that Windows Forms applications can take advantage of the features of live tiles? With the RadPanorama control and the RadLiveTileElement you can provide your users with their content at a glance quickly and easily. This blog post will walk you through creating a small live tiles sample, implementing and adding the tiles programmatically.
Watch the video below to see the interactivity and motion obtained using the RadPanorama control and RadLiveTileElements.
To build this sample, first create a new RadControls for Windows Forms Application project, I named my project LiveTiles. Create a new folder in the project called Assets and add multiple graphic files that we will use to implement our group of tiles. Ensure once you have graphics added, that you set the Copy To Output Directory to Always (otherwise you can also add these images as resources in the project).
Once this is done, let’s create the Fruit class to encapsulate information pertaining to the image path as well as the name of the fruit that you’d like to have displayed on the tile, included in this file I’ve also added a repository class called FruitMarket that we will use to create the data for the application.
Next, let’s implement the Load event for Form1. Double-click Form1 to enter the designer. In the Properties pane, select events, then double-click the Load event. In the code of the Load Event, we want to create an instance of our RadPanorama control, as well as define a tile group with a header to display our tiles. We’ll define this group to have 3 rows of tiles, additional tiles will wrap automatically to the next column. Live tiles must have frames defined if you want to see animation happen. These animations as well as transition effects are defined on the tile itself. The implementation of the Load Event is as follows:
Now when you run the application, you should see the RadPanorama populated with the tiles. This interface is fully interactive with the mouse and touch and the animation transition effects make the application visually appealing.
Subscribe to be the first to get our expert-written articles and tutorials for developers!