Windows Phone 7 - 學習新的Secondary Tile與Application Tile | Pou's IT Life - 點部落

2011-10-15

Windows Phone 7 - 學習新的Secondary Tile與Application Tile

4704
0
Windows Phone
2013-06-24

Windows Phone 7 - 學習新的Secondary Tile與Application Tile

之前在<Windows Phone 7 – 讓你的程式出現在Tile中也有功能 – Live Tile>說明了可以透過ShellTileSchedule自訂Tile的變化，

然而那個時候討論的都是Application Tile，因為在WP 7.0 SDK裡Tile對於一個Application只會有一個，不管Push notifiaction或

自己ShellTileSchedule來變化，都是只有那一個Application Tile。

到了WP 7.1 SDK之後，除了Application Tile也多了讓開發者可以在自己的Application裡就增加自訂的Tile，而自訂的Tile就被稱

為Secondary Tile。以下將說明這二者的差異：

(a) Application Tile：

參數	說明
Count	整數格式：1~99。如果Count未指定預設被認為是0，該count就不會顯示出來。
Background Image	指定App Tile的背景圖，預設是App的Icon，可以配合Push Notification或ShellTileSchedule來修改。到了7.1 SDK在App Tile的操作，更支援ShellTile APIs的使用。
Title	預設為該App的名稱。可以透過Push Notification或ShellTileSchedule來修改。該內容需符合單行(single-line)的限制，最多15個字元，超過的內容將不會顯示出來。

Application Tile故名思意它是透過用戶在Application透過長按顯示「pint to start」字樣選擇後所產生於start的tile。

(b) Secondary Tiles：

參數	說明
Back Content	設定Back Tile要呈現的內容，大約40個字元。
Back Background Image	設定Back Tile的圖像。
Back Title	設定要呈現的標題。跟App Tile一樣大約15個字元，支援單行呈現。

‧使用ShellTile API，取得Active Tiles中的第一個項目，進行參數的設定來更新Tile內容；

‧使用Push Notification發送Tile Notification來更新Application Tile；

‧使用ShellTileSchedule API，指定要更新的週期與對應的內容，進行週期更新；

從上述可以了解這二個Tile的差異，但其實差異比較大的就是Secondary Tiles被Pin在Start之後，它會定期顯示正面與背面資訊。

並且可以透過程式的方式，把該Secondary Tiles要攜帶的參數(例如：Page、QueryString)加上Tiles中，讓用戶點擊時，可以觸發

指定的Page與帶入對應的參數。至於Application Tile的話，就需要配合Push Notification或ShellTileSchedule來轉換。

那麼要怎麼來自訂Tile呢？接下來就往下說明幾個重要的類別，學習它們如果協助建立tile。

〉ShellTile Class：

該API負責管理該Application的Application Tile與多個Secondary Tiles。在Application所擁有啟動的Tiles集合(ActiveTiles)中，

第一個Tile(First item)一定是Application Tile。另外，該API除了提供管理的功能之外，也提供屬性方法來取得目前啟動的Tiles

有那些，以及管理Tiles中各個tile的參數。

a. 重要屬性：

屬性	說明
ActiveTiles	取得Application中目前被pinned start中的所有tiles。
NavigationUri	取得目前被點擊(tapping)的secondary tile的URI與執行參數。

這二個屬性將是用於每次

〉StandardTileData：

該類別用於建立一個Tile物件，在建立、更新或刪除ShellTile中ActiveTiles時，均是透過該物件來進行刪除。

該物件提供一些需要設定的屬性，如下：

屬性	說明
Title	設定標題，type：string。
BackgroundImage	設定背圖，type：uri。
Count	設定Count數量，type：int。
BackTitle	設定背向標題，type：string。
BackBackgroundImage	設定背向圖示，type：uri。
BackContent	設定背向內文，type：string。

以下就舉個範例來說明如何操作上述二個類別與物件。

〉範例說明：

a. 建立Secondary Tile，並且指定點擊該Tile時要進入App與夾帶的參數：

private void btnCreateTile_Click(object sender, RoutedEventArgs e)
		
{
		
    //確認是否有被建立過相同的secondary tile
		
    ShellTile tTileToFind = ShellTile.ActiveTiles.FirstOrDefault(
		
        x => x.NavigationUri.ToString().Contains("KeyID=POU"));
		
  
		
    if (tTileToFind == null)
		
    {
		
        //設定要建立新的Secondary Tile的樣式
		
        StandardTileData tNewTileData = new StandardTileData
		
        {
		
            BackgroundImage = new Uri("/Images/blue.png", UriKind.Relative),
		
            Title = "Secondary Tile",
		
            Count = 99,
		
            BackTitle = "Back of Tile",
		
            BackContent = "Welcome to the back of the Tile",
		
            BackBackgroundImage = new Uri("/Images/red.png", UriKind.Relative)
		
        };
		
  
		
        //建立Secondary Tile，並且指定該Tile對應點擊後要開啟的Page與參數
		
        ShellTile.Create(new Uri("/Tile2Page.xaml?KeyID=POU", UriKind.Relative), tNewTileData);
		
    }
		
}

設定指定要開啟Page取得NavigationContext中的Querystring參數：

protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
		
{
		
    //註冊事件在OnNavigateTo，代表Page進入後的事件
		
    base.OnNavigatedTo(e);
		
  
		
    //取得NavigationContext中的QueryString資料
		
    this.PageTitle.Text = this.NavigationContext.QueryString["KeyID"];
		
}

b. 更新Application Tile：

private void btnUdpateATile_Click(object sender, RoutedEventArgs e)
		
{
		
    //取得application tile，透過activetiles中的first();
		
    ShellTile tTileToFind = ShellTile.ActiveTiles.First();
		
    if (tTileToFind != null)
		
    {
		
        //產生要更新的tile data
		
        StandardTileData tTileData = new StandardTileData();
		
        tTileData.Title = "更新App tile";
		
        tTileData.BackgroundImage = new Uri("/Images/red.png", UriKind.Relative);
		
        tTileData.Count = 99;
		
        tTileData.BackContent = "背後內文";
		
        tTileData.BackTitle = "更新App Back";
		
        tTileData.BackBackgroundImage = new Uri("/Images/green.png", UriKind.Relative);
		
  
		
        //update application tile
		
        tTileToFind.Update(tTileData);
		
    }
		
}

要更新Secondary Tile的方式也一樣，只是需要先找出要更新的Secondary Tile，因為Secondary Tiles會有多個。

如下範例：

private void btnUdpateSTile_Click(object sender, RoutedEventArgs e)
		
{
		
    //確認是否有被建立過相同的secondary tile
		
    ShellTile tTileToFind = ShellTile.ActiveTiles.FirstOrDefault(
		
        x => x.NavigationUri.ToString().Contains("KeyID=POU"));
		
  
		
    if (tTileToFind != null)
		
    {
		
        //設定要更新的Secondary Tile的樣式
		
        StandardTileData tTileData = new StandardTileData
		
        {
		
            BackgroundImage = new Uri("/Images/green.png", UriKind.Relative),
		
            Title = "更新的se Tile",
		
            Count = 19,
		
            BackTitle = "更新的 B Tile",
		
            BackContent = "更新的Tile",
		
            BackBackgroundImage = new Uri("/Images/bule.png", UriKind.Relative)
		
        };
		
  
		
        //更新Secondary Tile
		
        tTileToFind.Update(tTileData);
		
    }
		
}