WP8.1学习系列(第三章)——磁贴和锁屏通知

一、创建默认磁贴

  创建默认磁贴,不需要任何代码只有制作几张图片就可以了。

  1.创建工程之后,在工程目录找到package.appxmanifest,打开它。

  2.在应用程序栏,通知选项,选择徽章和图块文本。

     

  3.然后切换到可见资产栏,右边有几个初始选项。图块(磁贴)旁边有一个显示名称选项,一个正方形150*150的磁贴,一个是310*150的,

分别对应着开始屏幕中切换磁贴大小的最大和中等大小模式,只有这两种才能下显示名称,还有一种更小的图标是不能显示名称了,因为它已经够

小了,还要显示文本就显示不下了。然后是背景色,我们默认为transparent透明,因为自从8.1开始微软就开始吧开始屏幕支持了透明的特性,这

样就可以在开始屏幕设置壁纸,透过磁贴就能看到开始屏幕的壁纸。

  磁贴总共有三种尺寸的图标:

  1.71*71正方形徽标:开始屏幕磁贴最小的一种形式,只显示图标不能显示文字,Square71x71Logo.png

  2.150*150正方形徽标:开始屏幕磁贴中等大小的一种,默认创建就是这个尺寸,可以显示文字,多任务列表显示的也是这个图标,Logo.png

  3.310*150长方形徽标:开始屏幕最大的一种磁贴,可以显示名称,WideLogo.png

  应用列表的Icon:

  44*44正方形徽标:应用列表的图标,SmallLogo.png

  应用商店徽标:

  50*50,StoreLogo.png

  徽章徽标:

  24*24,BadgeLogo.png,默认锁屏通知提醒的图片。

  初始屏幕有初始屏幕背景色和初始屏幕图片两个设置。SplashScreen.png

  

 一般图像需求

  磁贴和 Toast 源图像的尺寸必须小于或等于 1024x1024 像素,文件大小必须小于或等于 200 KB,类型必须为 .png、.jpg、.jpeg 或 .gif。图像没有位深或颜色需求,只要它满足其他需求。

  以上所有图片都有放大140倍和240倍的图片设置,这些图片会加上.scale-140.png或.scale-240.png

  

二、发送磁贴更新

  磁贴有很多种,模板枚举TileTemplateType提供各种各样的正方形、长方形、带图片等待非常多,具体可以到这https://msdn.microsoft.com/zh-cn/library/windows/apps/xaml/windows.ui.notifications.tiletemplatetype.aspx?cs-save-lang=1&cs-lang=csharp#code-snippet-1查看。

  我们看其中一种TileWide310x150ImageAndText01,这是310*150的模板,可以显示文本和图片。我们看一下Xml模板结构:

  

<tile>
    <visual version="2">
        <binding template="TileWide310x150ImageAndText01" fallback="TileWideImageandText01">
            <image id="1" src="ms-appx:///assets/redWide.png"/>
            <text id="1">Hello World! My very own tile notification</text>
        </binding>
    </visual>
</tile>

  和Toast一样,磁贴也是通过Xml解析模板编辑Xml来修改或创建更新内容,所以这两个namspace是必选的。

using Windows.UI.Notifications;
using Windows.Data.Xml.Dom;

  然后在我们的例子里添加一个AppBarButton来发送更新,一个来清除更新

<Page.BottomAppBar>
        <CommandBar>
            <CommandBar.PrimaryCommands>
                <AppBarButton Label="更新磁贴" Click="AppBarButton_Click"/>            <AppBarButton Label="清除更新" Click="AppBarButton_Click_1"/>
            </CommandBar.PrimaryCommands>
        </CommandBar>
</Page.BottomAppBar>

  在Click事件里写下发送更新代码:

 private void AppBarButton_Click(object sender, RoutedEventArgs e)
        {
            //获取310*150的磁贴模板Document对象
            XmlDocument tileXml = TileUpdateManager.GetTemplateContent(TileTemplateType.TileWide310x150ImageAndText01);
            //磁贴文本,如果指定了显示应用名称,文本将会显示在应用名称上方
            XmlNodeList tileTextAttributes = tileXml.GetElementsByTagName("text");
            tileTextAttributes[0].InnerText = "内容更新了哦!!";
            //磁贴图片
            XmlNodeList tileImageAttributes = tileXml.GetElementsByTagName("image");
            ((XmlElement)tileImageAttributes[0]).SetAttribute("src", "http://pic.cnr.cn/pic/guoji/20150201/W020150201362994790722.jpg");
            //建立TileNotification
            TileNotification tileNotification = new TileNotification(tileXml);

        //五分钟之后清除更新
        tileNotification.ExpirationTime = DateTimeOffset.UtcNow.AddMinutes(5);

//立即发送更新
            TileUpdateManager.CreateTileUpdaterForApplication().Update(tileNotification);

        }

  磁贴中图片支持三种图片来源,一种是应用程序包,还有支持应用的本地存储和网络图片。

  应用程序包前缀:”ms-appx:///”,如assets目录下的图片:”ms-appx:///assets/redWide.png”

  本地存储空间:”ms-appdata:///local/”,如”ms-appdata:///local/redWide.png”

  网络图片:”http://”或”https://”,如”http://www.contoso.com/redWide.png”

  ps:模板中使用的图像都要求大小小于 200 KB,小于 1024 x 1024 像素。

  微软是建议我们最好设置磁贴更新的过期时间,而不是手动的清除它,当然清除它也很简单,一句代码就够了,TileUpdateManager.CreateTileUpdaterForApplication().Clear();

  默认图片有点呵呵,不知道会不会被和谐。。。,更新的图片是百度随便找的。

  

三、发送锁屏提醒更新

  锁屏提醒有两种形式,一种是显示数字,一种是显示字符。它的模板枚举类是BadgeTemplateType,数字是BadgeNumber,

字符是BadgeGlyph。

  更新锁屏提醒:

private void AppBarButton_Click_2(object sender, RoutedEventArgs e)
        {
            //用一个计数器,奇数就显示文字偶数显示数字
            XmlDocument badgeXml = BadgeUpdateManager.GetTemplateContent(counter % 2 == 0 ? BadgeTemplateType.BadgeGlyph : BadgeTemplateType.BadgeNumber);
            XmlElement badgeElement = (XmlElement)badgeXml.SelectSingleNode("/badge");
            //两种模板都是value这个值
            badgeElement.SetAttribute("value", counter % 2 == 0 ? "" + counter : "您有新的信息哦");
            BadgeNotification badge = new BadgeNotification(badgeXml);
            BadgeUpdateManager.CreateBadgeUpdaterForApplication().Update(badge);
            counter++;

        }

  清除锁屏:

private void AppBarButton_Click_3(object sender, RoutedEventArgs e)
        {
            BadgeUpdateManager.CreateBadgeUpdaterForApplication().Clear();
        }

  更新了锁屏提醒,磁贴的角标也会更新哦,三种尺寸的磁贴都角表数字提醒。但是更新到锁屏好像不是很及时哦,并且前提是一定要在锁屏的通知程序选上自

己的,通知详细也得选自己的,要不然文本形式的锁屏提醒就看不到的哦!

  

时间: 2024-09-28 20:40:58

WP8.1学习系列(第三章)——磁贴和锁屏通知的相关文章

WP8.1学习系列(第十七章)——Windows Phone重要图形、视觉指示器和通知

美感在手机应用中是不可或缺的,它是直观操作的代名词.在 Windows Phone 中,你的磁贴.初始屏幕.图标.控件和导航的视觉元素会引起用户对应用程序内的相关任务.优先事项或操作的注意,并采用新颖的且引人注目的方式显示信息.你的应用将需要自定义设计的动态磁贴.动画图标以及初始屏幕图像(用于在用户加载应用时向其介绍应用).这些设计和其他视觉指示器是本部分的主题. 尽量少使用图形.请记住,使用可以引起视觉吸引力的内容和版式,并且始终不要使用纯天然修饰的视觉元素. 请记住,在移动平台上,简洁性是最

WP8.1学习系列(第二十三章)——到控件的数据绑定

在本文中 先决条件 将控件绑定到单个项目 将控件绑定到对象的集合 通过使用数据模板显示控件中的项目 添加详细信息视图 转换数据以在控件中显示 相关主题 本主题介绍了如何在使用 C++.C# 或 Visual Basic 的 Windows 应用商店应用中将控件绑定到单个项或将列表控件绑定到项目集合.此外,本主题向你介绍了如何自定义控件项目的显示.如何基于所选内容实现详细信息视图,以及如何转换数据以进行显示.有关更多详细信息,请参阅使用 XAML 进行数据绑定. 路线图: 本主题与其他主题有何关联

WP8.1学习系列(第四章)——交互UX

交互模式和指南 这部分包括三部分内容,分别是导航模式.命令模式和输入模式. 导航模式 虽然 Windows 导航模式提供了框架,但它提倡创新.激发你的创造力并在已建立的模式上构建. 命令模式 使用应用栏.超级按钮.菜单和页面内容,以使用户可以控制你的应用. 输入模式 了解用户可用于与应用交互的许多方式.深入了解如何设计良好的触摸交互. 导航模式 组织 Windows 或 Windows Phone 应用中的内容,以便用户可以轻松而直观地进行导航. 适用于 Windows 的导航模式 适用于 Wi

WP8.1学习系列(第十七章)——交互UX之输入和反馈模式

如果你将 Windows 应用商店应用设计为触摸交互,则可免费获取对触摸板.鼠标.笔和键盘交互的支持.你的用户可以从一种输入法切换到另一种,而不会丧失应用体验的感觉.将键盘插入平板电脑?没问题.你的应用将对用户的选择做出一致且可预见的响应. 设计你的 Windows 应用商店应用的 UI 以支持触摸,同时考虑各种设备的设计含义: 结合了触摸和鼠标体验的触控板 鼠标 笔,专为数字墨迹而设计 键盘设备 触摸 Windows 提供一组在整个系统中使用的简单触摸交互功能.一致地应用此触摸语言可让用户对你

WP8.1学习系列(第十一章)——中心控件Hub开发指南

在本文中 先决条件 什么是中心控件? 添加中心控件 将分区添加到中心 添加交互式分区头用于导航 将展示磁贴添加到中心 使用窄应用中的垂直中心 借助中心使用语义式缩放视图 摘要和后续步骤 重要的 API Hub HubSection SemanticZoom 使用 Hub 控件创建一个进入应用的入口页.Hub 控件在丰富的平移视图中显示内容,这样用户一眼就能看见新鲜有趣的内容,从而吸引他们深入了解你的应用中的更多内容. 先决条件 查看并了解 Windows 导航模式. 查看并了解中心控件指南. 我

WP8.1学习系列(第二十一章)——本地应用数据

了解如何存储和检索本地应用数据存储中的设置和文件. 路线图: 本主题与其他主题有何关联?请参阅: 使用 C# 或 Visual Basic 的 Windows 运行时应用的路线图 使用 C++ 的 Windows 运行时应用的路线图 获取应用的设置和文件容器 使用 ApplicationData.LocalSettings 属性可以获取 ApplicationDataContainer 对象中的设置.使用ApplicationData.LocalFolder 属性可以获取 StorageFold

WP8.1学习系列(第七章)——应用选项卡Pivot交互UX

“应用选项卡”模式用于用户经常在中间导航的多个 UI 页面.如果你的应用基于单个主题(例如,电影.棒球等),该模式尤其有用.每页都将为用户显示与该应用呈现的整体数据相关的一些内容.“应用选项卡”模式可能构成整个应用,或者还可用于应用的子区域.例如,你可以使用中心控件作为应用主要的第一层级(如之前主题所述),然后让用户从该控件导航到应用使用“应用选项卡”模式的子部分(使用透视控件). 想象你希望拥有一个将你家里收藏的电影分类的应用.你可以使用“应用选项卡”模式提供几个不同的电影筛选视图.你可能希望

WP8.1学习系列(第五章)——交互UX中心或透视控件

具有主页菜单(中心或透视控件)的中心应用中心 你可能要设计包含许多功能的应用.当你看着这些功能时,可能会决定将它们整理到独立的区域中.这些区域最终会成为用户要访问的应用的独立部分.你需要设计一个简便的方法,让用户在这些 UI 区域中导航.此类应用需要应用程序中心,用户可在其中启动到应用的每个子区域. 例如,请想象设计一个用于管理足球队的应用.此应用需要多个功能区域—一个用于比赛和练习的日历管理,一个用于球队花名册信息,一个用于得分和球员统计数据,另一个用于过往赛事的视频片段.你会希望提供一种方式

WP8.1学习系列(第六章)——交互UX:具有面板部分的Hub

本主题中呈现的模型类似于适用于 Windows Phone 的具有主页菜单(中心或透视控件)的中心应用中描述的模型.正如之前的案例所示,你要向用户呈现不同的功能区域.此处的区别在于你可以在顶层呈现所有主要 UI,而无需主页菜单. 用于足球队管理的中心应用中心 UI 如果你的应用没有要导航到的子区域,则你的所有 UI 都可位于一组水平的可访问部分中.你仍可使用 中心控件,但在此案例中,你无需具有主页部分.Windows Phone 上的 People Hub 即属于这种情况.下图显示了中心的基本布