windows phone开发学习--再谈磁贴[wp8版]

众所周知,微软绑架了诺基亚以后就开始搞windows phone8操作系统,尽管这个系统界面上看起来和windows phone7差不多,但底层却发生了较大的改变。对于用户来说,最醒目的莫过于桌面上的磁贴大小的改变,原来只有那种单一磁贴,现在大小变成了三种,同时磁贴也有了三种类型,看来微软开放了更多的东西。

如果需要详细了解磁贴信息请看MSDN,http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh202948(v=vs.105).aspx 这里只是大致说下三种磁贴的创建过程。这三种磁贴如下:

  • Flip:带有翻转效果的磁贴,类似于最老的版本中的磁贴
  • Iconic:图标此贴,就是类似于电话信息那样的磁贴,原来是不开放给开发者的,需要用户自己绘制,好在现在开放了
  • Cycle:循环滑动磁贴,就是类似于照片显示那样的,原来也是不开放的
下面来说说这三种磁贴的创建,前提是windows phone8平台

首先分别为每个磁贴创建一个类,一系列get set函数,用来更新数据,这里以FilpTile为例:
using System;
using Microsoft.Phone.Shell;

namespace Mangopollo.Tiles
{
    // Summary:
    //     Describes a Tile template that flips from the front to the back side. Allows
    //     customization of the background image and text for both the front and back
    //     Tile.
    public class FlipTileData
    {
        private readonly object _shelltiledata;

        public FlipTileData()
        {
            Type tileDataType = Type.GetType("Microsoft.Phone.Shell.FlipTileData, Microsoft.Phone");
            _shelltiledata = tileDataType.GetConstructor(new Type[] { }).Invoke(null);
        }

        // Summary:
        //     Gets or sets the text that displays on the front side of the medium and wide
        //     tile sizes.
        //
        // Returns:
        //     The text that displays on the front side of the medium and wide tile sizes.
        public string Title
        {
            get { return (string)Utils.GetProperty(_shelltiledata, "Title"); }
            set { Utils.SetProperty(_shelltiledata, "Title", value); }
        }

        // Summary:
        //     Gets or sets a background image of the back of the Tile. If this property
        //     is an empty URI, the background image of the back of the Tile will not change
        //     during an update.
        //
        // Returns:
        //     The background image of the back of the Tile.
        public Uri BackBackgroundImage
        {
            get { return (Uri)Utils.GetProperty(_shelltiledata, "BackBackgroundImage"); }
            set { Utils.SetProperty(_shelltiledata, "BackBackgroundImage", value); }
        }

        //
        // Summary:
        //     Gets or sets the text to display on the back of the Tile, above the title.
        //     If this property is an empty string, the content on the back of the Tile
        //     will not change during an update.
        //
        // Returns:
        //     The text to display on the back of the Tile, above the title.
        public string BackContent
        {
            get { return (string)Utils.GetProperty(_shelltiledata, "BackContent"); }
            set { Utils.SetProperty(_shelltiledata, "BackContent", value); }
        }

        //
        // Summary:
        //     Gets or sets the background image of the front of the Tile. If this property
        //     is an empty URI, the background image of the front of the Tile will not change
        //     during an update.
        //
        // Returns:
        //     The background image of the front of the Tile.
        public Uri BackgroundImage
        {
            get { return (Uri)Utils.GetProperty(_shelltiledata, "BackgroundImage"); }
            set { Utils.SetProperty(_shelltiledata, "BackgroundImage", value); }
        }

        //
        // Summary:
        //     Gets or sets the title to display at the bottom of the back of the Tile.
        //     If this property is an empty string, the title on the back of the Tile will
        //     not change during an update.
        //
        // Returns:
        //     The title to display at the bottom of the back of the Tile.
        public string BackTitle
        {
            get { return (string)Utils.GetProperty(_shelltiledata, "BackTitle"); }
            set { Utils.SetProperty(_shelltiledata, "BackTitle", value); }
        }

        //
        // Summary:
        //     Gets or sets a value between 1 and 99 will be displayed in the Count field
        //     of the Tile. A value of 0 means the Count will not be displayed. If this
        //     property is not set, the Count display will not change during an update.
        //
        // Returns:
        //     A value between 1 and 99 will be displayed in the Count field of the Tile.
        public int? Count
        {
            get { return (int?)Utils.GetProperty(_shelltiledata, "Count"); }
            set { Utils.SetProperty(_shelltiledata, "Count", value); }
        }

        // Summary:
        //     Gets and sets the front-side background image for the small Tile size.
        //
        // Returns:
        //     The front-side background image for the small Tile size.
        public Uri SmallBackgroundImage
        {
            get { return (Uri)Utils.GetProperty(_shelltiledata, "SmallBackgroundImage"); }
            set { Utils.SetProperty(_shelltiledata, "SmallBackgroundImage", value); }
        }

        //
        // Summary:
        //     Gets and sets the back-side background image for the wide Tile size.
        //
        // Returns:
        //     The back-side background image for the wide Tile size.
        public Uri WideBackBackgroundImage
        {
            get { return (Uri)Utils.GetProperty(_shelltiledata, "WideBackBackgroundImage"); }
            set { Utils.SetProperty(_shelltiledata, "WideBackBackgroundImage", value); }
        }

        //
        // Summary:
        //     Gets and sets the text that displays above the title, on the back-side of
        //     the wide Tile size.
        //
        // Returns:
        //     The text that displays above the title, on the back-side of the wide Tile
        //     size.
        public string WideBackContent
        {
            get { return (string)Utils.GetProperty(_shelltiledata, "WideBackContent"); }
            set { Utils.SetProperty(_shelltiledata, "WideBackContent", value); }
        }

        //
        // Summary:
        //     Gets and sets the front-side background image for the wide Tile size.
        //
        // Returns:
        //     The front-side background image for the wide Tile size.
        public Uri WideBackgroundImage
        {
            get { return (Uri)Utils.GetProperty(_shelltiledata, "WideBackgroundImage"); }
            set { Utils.SetProperty(_shelltiledata, "WideBackgroundImage", value); }
        }


        public static implicit operator ShellTileData(FlipTileData data)
        {
            return (ShellTileData)data._shelltiledata;
        }

        public ShellTileData ToShellTileData()
        {
            return (ShellTileData)_shelltiledata;
        }
    }
}


然后创建ShellTileExt.cs类,该类用来创建Tile

using System;
using System.Reflection;
using Microsoft.Phone.Shell;

namespace Mangopollo.Tiles
{
    public static class ShellTileExt
    {
        public static void Create(Uri uri, ShellTileData tiledata, bool usewide)
        {
            Type shellTileType = Type.GetType("Microsoft.Phone.Shell.ShellTile, Microsoft.Phone");
            MethodInfo createmethod = shellTileType.GetMethod("Create", new[] {typeof (Uri), typeof (ShellTileData), typeof (bool)});
            createmethod.Invoke(null, new object[] {uri, tiledata, usewide});
        }
    }
}

最后和老版本创建磁贴一样,设置几个参数传入即可,下面是main.cs里面的部分代码:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Media;
using Mangopollo.Tasks;
using Mangopollo.Tiles;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Shell;
using Microsoft.Phone.Tasks;

namespace Mangopollo.Sample
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
        }

        //测试是否是wp8设备
        private void TestIfWP8_Click(object sender, RoutedEventArgs e)
        {
            if (Utils.IsWP8)
            {
                MessageBox.Show("It's a Windows Phone 8 !");
            }
            else
            {
                MessageBox.Show("It's a Windows Phone 7 !");
            }
        }

        //判断是否是7.8设备
        private void TestIfWP78_Click(object sender, RoutedEventArgs e)
        {
            if (Utils.CanUseLiveTiles)
            {
                MessageBox.Show("It's a Windows Phone 7.8 or sup !");
            }
            else
            {
                MessageBox.Show("It's a Windows Phone 7 !");
            }
        }


        //创建普通的循环磁贴
        private void CreateCycleTile_Click(object sender, RoutedEventArgs e)
        {
            //动态磁贴
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }
            try
            {
                var mytile = new CycleTileData
                    {
                        Title = "cyclic tile",
                        Count = 42,
                        SmallBackgroundImage = new Uri("/Assets/logo159x159.png", UriKind.Relative),
                        CycleImages = new List<Uri> {new Uri("/Assets/Image1.png", UriKind.Relative), new Uri("/Assets/Image2.png", UriKind.Relative), new Uri("/Assets/Image3.png", UriKind.Relative)}
                    };
#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateCyclicTile("cyclic tile", 42, new Uri("/Assets/logo159x159.png", UriKind.Relative), new List<Uri>() { new Uri("/Assets/Image1.png", UriKind.Relative), new Uri("/Assets/Image2.png", UriKind.Relative), new Uri("/Assets/Image3.png", UriKind.Relative) });
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20cycle%20tile", UriKind.Relative), mytile, false);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }

        //创建宽的循环磁贴
        private void CreateCycleTileWide_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            try
            {
                var mytile = new CycleTileData
                    {
                        Title = "cyclic wide tile",
                        Count = 42,
                        SmallBackgroundImage = new Uri("/Assets/logo159x159.png", UriKind.Relative),
                        CycleImages = new List<Uri> {new Uri("/Assets/Image1.png", UriKind.Relative), new Uri("/Assets/Image2.png", UriKind.Relative), new Uri("/Assets/Image3.png", UriKind.Relative)}
                    };

#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateCyclicTile("cyclic wide tile", 42, new Uri("/Assets/logo159x159.png", UriKind.Relative), new List<Uri>() { new Uri("/Assets/Image1.png", UriKind.Relative), new Uri("/Assets/Image2.png", UriKind.Relative), new Uri("/Assets/Image3.png", UriKind.Relative) });
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20wide%20cycle%20tile", UriKind.Relative), mytile, true);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }


        //创建普通的图标磁贴
        private void CreateIconicTile_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            try
            {
                var mytile = new IconicTileData
                    {
                        Title = "iconic tile",
                        Count = 8,
                        BackgroundColor = Colors.Purple,
                        IconImage = new Uri("/Assets/logo202x202.png", UriKind.Relative),
                        SmallIconImage = new Uri("/Assets/logo110x110.png", UriKind.Relative)
                    };

#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateIconicTile("iconic tile", 8, Colors.Purple, new Uri("/Assets/logo202x202.png", UriKind.Relative), new Uri("/Assets/logo110x110.png", UriKind.Relative));
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20iconic%20tile", UriKind.Relative), mytile, false);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }

        //创建宽的图标磁贴
        private void CreateIconicTileWide_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            try
            {
                var mytile = new IconicTileData
                    {
                        Title = "iconic wide tile",
                        Count = 8,
                        BackgroundColor = Color.FromArgb(255, 200, 10, 30),
                        IconImage = new Uri("/Assets/logo202x202.png", UriKind.Relative),
                        SmallIconImage = new Uri("/Assets/logo110x110.png", UriKind.Relative),
                        WideContent1 = "Mangopollo Library",
                        WideContent2 = "use Windows Phone 8 features",
                        WideContent3 = "on Windows Phone 7 apps"
                    };

#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateIconicTile("iconic wide tile", 8, Colors.Gray, new Uri("/Assets/logo202x202.png", UriKind.Relative), new Uri("/Assets/logo110x110.png", UriKind.Relative), "Mangopollo Library", "created by", "Rudy Huyn");
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20wide%20iconic%20tile", UriKind.Relative), mytile, true);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }

        //创建普通翻转磁贴
        private void CreateFlipTile_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            try
            {
                var mytile = new FlipTileData
                    {
                        Title = "flip tile",
                        BackTitle = "created by",
                        BackContent = "Rudy Huyn",
                        Count = 9,
                        SmallBackgroundImage = new Uri("/Assets/logo159x159.png", UriKind.Relative),
                        BackgroundImage = new Uri("/Assets/Background336x336_1.png", UriKind.Relative),
                        BackBackgroundImage = new Uri("/Assets/Background336x336_2.png", UriKind.Relative)
                    };


#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateFlipTile("wide flip tile", "created by", "Rudy Huyn", 9, new Uri("/Assets/logo159x159.png", UriKind.Relative), new Uri("/Assets/Background336x336_1.png", UriKind.Relative), new Uri("/Assets/Background336x336_2.png", UriKind.Relative));
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20flip%20tile", UriKind.Relative), mytile, false);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }

        //创建宽的翻转磁贴
        private void CreateFlipTileWide_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            try
            {
                var mytile = new FlipTileData
                    {
                        Title = "wide flip tile",
                        BackTitle = "created by",
                        BackContent = "Rudy Huyn",
                        Count = 9,
                        SmallBackgroundImage = new Uri("/Assets/logo159x159.png", UriKind.Relative),
                        BackgroundImage = new Uri("/Assets/Background336x336_1.png", UriKind.Relative),
                        BackBackgroundImage = new Uri("/Assets/Background336x336_2.png", UriKind.Relative),
                        WideBackContent = "This is a very long long text to demonstrate the back content of a wide flip tile",
                        WideBackgroundImage = new Uri("/Assets/Background691x336_1.png", UriKind.Relative),
                        WideBackBackgroundImage = new Uri("/Assets/Background691x336_2.png", UriKind.Relative)
                    };

#if ALTERNATIVE_SOLUTION
                var mytile = Mangopollo.Tiles.TilesCreator.CreateFlipTile("flip tile", "created by", "Rudy Huyn", "This is a very long long text to demonstrate the back content of a wide flip tile", 9, new Uri("/Assets/logo159x159.png", UriKind.Relative), new Uri("/Assets/Background336x336_1.png", UriKind.Relative), new Uri("/Assets/Background336x336_2.png", UriKind.Relative), new Uri("/Assets/Background691x336_1.png", UriKind.Relative), new Uri("/Assets/Background691x336_2.png", UriKind.Relative));
#endif
                ShellTileExt.Create(new Uri("/MainPage.xaml?msg=from%20wipe%20flip%20tile", UriKind.Relative), mytile, true);
            }
            catch
            {
                MessageBox.Show("remove tile before create it again");
            }
        }

        private void UpdateMainTile_Click(object sender, RoutedEventArgs e)
        {
            if (!Utils.CanUseLiveTiles)
            {
                MessageBox.Show("This feature needs Windows Phone 8");
                return;
            }

            var maintile = new FlipTileData
                {
                    Title = "main tile",
                    BackTitle = "this is main tile",
                    BackContent = "main tile",
                    Count = 3,
                    SmallBackgroundImage = new Uri("/Assets/logo159x159.png", UriKind.Relative),
                    BackgroundImage = new Uri("/Assets/Background336x336_2.png", UriKind.Relative),
                    BackBackgroundImage = new Uri("/Assets/Background336x336_1.png", UriKind.Relative),
                    WideBackContent = "This is a very long long text to demonstrate the back content of a wide flip tile",
                    WideBackgroundImage = new Uri("/Assets/Background691x336_2.png", UriKind.Relative),
                    WideBackBackgroundImage = new Uri("/Assets/Background691x336_1.png", UriKind.Relative)
                };

#if ALTERNATIVE_SOLUTION
            var maintile = Mangopollo.Tiles.TilesCreator.CreateFlipTile("main tile", "This is", "main tile", "This is a very long long text to demonstrate the back content of a wide flip tile", 9, new Uri("/Assets/logo159x159.png", UriKind.Relative), new Uri("/Assets/Background336x336_1.png", UriKind.Relative), new Uri("/Assets/Background336x336_2.png", UriKind.Relative), new Uri("/Assets/Background691x336_1.png", UriKind.Relative), new Uri("/Assets/Background691x336_2.png", UriKind.Relative));
#endif
            ShellTile.ActiveTiles.First().Update(maintile);
        }

整个工程的文件如下




注:这里的源码均来自CodePlex上面的一个开源项目,地址位于http://mangopollo.codeplex.com/ 需要查看源码的请自行前去下载,程序中还包括地图和任务的一些功能,不过由于与磁贴主题无关,就不再赘述。还要提一句,磁贴要分场合使用,并不是所有磁贴都能用于任何场合,MSDN上面的这篇文章已经详细说明了每种磁贴的使用范围:http://msdn.microsoft.com/en-us/library/windowsphone/design/jj662926(v=vs.105).aspx

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值