Windows 8 Store Apps學習(36) 通知: Tile 詳解

介紹

重新想象 Windows 8 Store Apps 之 通知

Tile - 基本應用參見 http://www.cnblogs.com/webabcd/archive/2013/06/17/3139740.html

Tile - 全部 Tile 模板

Tile - 在一個 Tile 上迴圈顯示多個 TileNotification

Tile - 一個 app 多個 Tile

Tile - 按計劃更新 Tile 通知, 輪詢服務端以更新 Tile 通知

樣本

1、顯示 Tile 的全部 46 種模板

Notification/Tile/AllTemplates.xaml

<Page    x:Class="XamlDemo.Notification.Tile.AllTemplates"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:local="using:XamlDemo.Notification.Tile"    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    mc:Ignorable="d">        <Grid Background="Transparent">        <Grid.Resources>            <Style x:Key="ItemTitleStyle" TargetType="TextBlock">                <Setter Property="FontSize" Value="14.667"/>            </Style>                            <ItemsPanelTemplate x:Key="StoreFrontGridItemsPanelTemplate">                <WrapGrid MaximumRowsOrColumns="3" VerticalChildrenAlignment="Top" HorizontalChildrenAlignment="Left"/>            </ItemsPanelTemplate>                <Style x:Key="StoreFrontTileStyle"  TargetType="GridViewItem">                <Setter Property="FontFamily" Value="Segoe UI" />                <Setter Property="Height" Value="300" />                <Setter Property="Width" Value="260" />                <Setter Property="Padding" Value="0" />                <Setter Property="Margin" Value="0" />                <Setter Property="HorizontalContentAlignment" Value="Left" />                <Setter Property="VerticalContentAlignment" Value="Top" />                <Setter Property="BorderThickness" Value="0"/>                <Setter Property="TabNavigation" Value="Local" />            </Style>                <DataTemplate x:Key="StoreFrontTileTemplate">                <Grid HorizontalAlignment="Left" Background="Transparent">                    <StackPanel Orientation="Vertical">                        <TextBlock TextWrapping="Wrap" VerticalAlignment="Center" Text="{Binding FileName}" HorizontalAlignment="Left" />                        <Image Source="{Binding Path}" Stretch="None" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,10,0,0"/>                    </StackPanel>                </Grid>            </DataTemplate>        </Grid.Resources>                    <!--顯示 46 種不同的 Tile 模板-->        <GridView x:Name="gridView" Margin="120 0 0 0"            ItemTemplate="{StaticResource StoreFrontTileTemplate}"            ItemContainerStyle="{StaticResource StoreFrontTileStyle}"            ItemsPanel="{StaticResource StoreFrontGridItemsPanelTemplate}"            BorderBrush="LightGray" VerticalAlignment="Top"            ScrollViewer.VerticalScrollBarVisibility="Auto"            ScrollViewer.HorizontalScrollBarVisibility="Auto"            SelectionMode="None" />    </Grid></Page>

Notification/Tile/AllTemplates.xaml.cs

/* * 顯示 Tile 的全部 46 種模板 */    using System;using System.Linq;using Windows.ApplicationModel;using Windows.UI.Xaml.Controls;using Windows.UI.Xaml.Navigation;    namespace XamlDemo.Notification.Tile{    public sealed partial class AllTemplates : Page    {        public AllTemplates()        {            this.InitializeComponent();        }            protected async override void OnNavigatedTo(NavigationEventArgs e)        {            // XamlDemo/Notification/Tile/TemplateDemo 檔案夾內 46 張圖片分別用於示範 Tile 的 46 種模板                var folder = await Package.Current.InstalledLocation.GetFolderAsync(@"Notification\Tile\TemplateDemo");            var files = await folder.GetFilesAsync();                var dataSource = from p in files                             select new                             {                                 FileName = p.DisplayName,                                 Path = "ms-appx:///Notification/Tile/TemplateDemo/" + p.Name                             };                gridView.ItemsSource = dataSource;        }    }}