,

Introducing the Cycle Tile Template

The cycle template cycles between a maximum of nine images. This template is great for apps that work primarily with images, such as photography apps.

Unlike the iconic and flip templates when sized to be either medium or wide, the cycle template does not have a large portion devoted to text across the tile.

The cycle template allows you to define a small image for when the tile is in its small state, and up to nine additional images that are displayed, in sequence, when the tile is in its medium or wide state (see Figure 13.2).

Image

FIGURE 13.2 Configuring an app to use the cycle tile template.


Note

Cycle images can only have local URIs. A cycle image cannot be assigned a remote URI to an image on the cloud.


The information portrayed in a cycle template maps to the CycleTileData class, which is used to update any of the tile properties. Figure 13.3 shows the elements of the cycle tile template and the CycleTileData property name associated with each aspect of the cycle template.

Image

FIGURE 13.3 Cycle tile template.

The Count property of the CycleTileData class element is displayed on the badge region of the tile. Count must be a positive integer value between 0 and 99. If the value is 0 the badge is not displayed.

Figure 13.4 shows the size of each element within the cycle tile template.

Image

FIGURE 13.4 Dimensions of elements within the cycle tile template.

You can edit the template properties outside of the WMAppManifest.xml designer by opening the WMAppManifest.xml file in a text editor. To do this, right-click the WMAppManifest.xml file in the Visual Studio Solution Explorer and select View Code.

The following excerpt shows the cycle template definition from a WMAppManifest.xml file:

<Tokens>
  <PrimaryToken TokenID="WPUnleashed.ExamplesToken" TaskName="_default">
    <TemplateCycle>
      <SmallImageURI IsRelative="true" IsResource="false">
           ApplicationIcon.png</SmallImageURI>
      <Title>Unleashed</Title>
      <Photo01ImageURI IsRelative="true" IsResource="false">
           ImagesTilesImage01.png</Photo01ImageURI>
      ...
      <Photo09ImageURI IsRelative="true" IsResource="false">
           ImagesTilesImage09.png</Photo09ImageURI>
      <Count>12</Count>
      <HasLarge>True</HasLarge>
      <DeviceLockImageURI IsRelative="true" IsResource="false">
      </DeviceLockImageURI>
    </TemplateCycle>
  </PrimaryToken>
</Tokens>

Each photo image URI element defines an image that is displayed in sequence.

The DeviceLockImageURI element is used to provide an icon for your app when it is set as a quick status app in the phone’s lock screen settings. You look at creating and configuring a lock screen icon later in the chapter.


Caution

A downside of the cycle template is that when used in conjunction with the lock screen, a cycle tile does not provide the means to set the lock screen’s notification text field. If you want to display images on your app’s primary tile as well as enable text notifications on the lock screen, a better option may be the flip tile template.


..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.218.9.139