菜鸟学Windows Phone 8开发(4)——设置应用程序样式_移动开发_编程开发_程序员俱乐部
中国优秀的程序员网站
程序员频道
CXYCLUB技术
地图
最新资讯
|
百度新闻
|
GOOGLE地图
|
RSS订阅
|
更多
职场话题
生活休闲
恋爱交友
程序人生
学习进修
职业发展
项目管理
求职面试
程序员创业
JAVA
.NET
C/C++
Ruby
Delphi
JavaScript
PHP
ASP
JSP
HTML
XML
移动开发
开发工具
其他
编程开发
数据库
操作系统
新闻资讯
互联网
非技术区
非技术区
生活休闲
恋爱交友
职业发展
求职面试
程序人生
移动开发
开发工具
DB2
MySql
Sybase
开发
JAVA
.NET
PHP
C/C++
数据库
SQL Server
Oracle
互联网
运营
推广
营销
SEO
系统
Linux
Unix
Windows
资讯
动态
产品
人物
创业
职场
学习
管理
热搜:
class
Win8
摄像头
NullPointerException
removeview
viewgroup
onAnimationEnd
controller
异步
同步
编码
版本
缓存
HTTP
内存
class
Win8
摄像头
NullPointerException
removeview
viewgroup
onAnimationEnd
controller
异步
同步
更多>>
您所在的位置:
程序员俱乐部
>
编程开发
>
移动开发
> 菜鸟学Windows Phone 8开发(4)——设置应用程序样式
菜鸟学Windows Phone 8开发(4)——设置应用程序样式
2013/10/23 10:55:43 多了特 博客园
我要评论(
0
)
摘要:
本系列文章来源MSDN的面向完全新手的WindowsPhone8开发本文地址:http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners/Part-6-Styling-the-App源代码:http://aka.ms/absbeginnerdevwp8我们已经学习了XAML布局和事件基础,接下来让我们做些有趣的事情,我们将通过给应用程序添加样式来赋予它一些独特的特征
标签:
程序
Windows
应用
开发
应用程序
本系列文章来源
MSDN
的
面向完全新手的 Windows Phone 8 开发
本文地址:http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners/Part-6-Styling-the-App
源代码:http://aka.ms/absbeginnerdevwp8
我们已经学习了XAML布局和事件基础,接下来让我们做些有趣的事情,我们将通过给应用程序添加样式来赋予它一些独特的特征,显然我们需要按照微软的向导以便我们能让我们的应用看起来像Windows Phone 8生态系统的一部分,但是我们任然有许多自由在个性化应用程序上面。
我们这节课的计划:
1、我们将改变应用在手机应用列表和首页的icon图标;
2、我们将访问用户手机的主题颜色并应用在应用程序中,同时我们也将学习到一些重要的XAML语法——绑定;
3、最后我们将讨论关于样式重用。
一、改变ICON
这节课的第一个任务是改变应用程序图标,我们将在按字母顺序的应用程序列表和开始页面看到他如果我们Pin了我们的应用图标到首页,首先我们展开我们项目中Properties文件夹节点:
本系列文章来源MSDN的
面向完全新手的 Windows Phone 8 开发
本文地址:http://channel9.msdn.com/Series/Windows-Phone-8-Development-for-Absolute-Beginners/Part-6-Styling-the-App
源代码:http://aka.ms/absbeginnerdevwp8
我们已经学习了XAML布局和事件基础,接下来让我们做些有趣的事情,我们将通过给应用程序添加样式来赋予它一些独特的特征,显然我们需要按照微软的向导以便我们能让我们的应用看起来像Windows Phone 8生态系统的一部分,但是我们任然有许多自由在个性化应用程序上面。
我们这节课的计划:
1、我们将改变应用在手机应用列表和首页的icon图标;
2、我们将访问用户手机的主题颜色并应用在应用程序中,同时我们也将学习到一些重要的XAML语法——绑定;
3、最后我们将讨论关于样式重用。
一、改变ICON
这节课的第一个任务是改变应用程序图标,我们将在按字母顺序的应用程序列表和开始页面看到他如果我们Pin了我们的应用图标到首页,首先我们展开我们项目中Properties文件夹节点:
当你双击打开这个文件的时候你可以看到一个特别的窗口,这个窗口提供了很多选项来影响我们的应用程序,例如在第一个选项卡“应用程序界面”我们能改变应用的默认名字和应用图标等:
我们使用一个更适合这个应用的图标来改变它的默认图标,我已经创建了这个图标在
C9Phone8\PetSounds_Assets文件夹下面。
在文件夹中是Application.png
我们拖拽这个图标到我们项目的Assets文件夹,我们将会看到一个提示一个同名的文件已经存在:
我们用新图标替换旧图标
接下来我们将替换在
Assets\Tiles文件夹中的两个子文件,我已经看到了这个目标在解决方案窗口中。
在windows窗口中是在
C9Phone8\PetSounds_Assets\Tiles文件夹中:
我们同样拖拽
他们
到目标文件夹中,同样你会看到刚刚的提示窗口。
1、勾选应用所有项目
2、点击确定
现在我已经替换了这些主要的磁贴文件,让我们回到WMAppMainfest.xaml文件,因为我们使用新文件替换了就文件所以我们需要重新打开这个文件来看我们的新文件。
继续往下翻这个设置文件,我们确定下面的选项:
1、图块模版选择TemplateIconic
2、选择支持大磁贴
3、小图标已经设置
4、中等图标已经设置
为了测试这些设置,我们(或者按F5)运行这个应用,在模拟器中我们点击手机的开始按钮,然后(按住鼠标)从右向左
滑动
在字母顺序列表中找到我们的PetSounds应用.
我们点击并按住这个图标知道弹出一个包含固定到开始屏幕和
卸载
的菜单。
点击固定到开始菜单,点击模拟器的Home键我们将看到:
这是一个很小的细节,我们通过设置一点点改变就可以看到它基本上符合我们的应用。
二、修改应用和页面标题
接下来我们将改变应用和页面的标题,在MainPage.xaml定位到TitlePanel,这个StackPanel通过页面的默认模版添加了默认的标题:
我们将作如下改变:
1、使用应用标题“PET SOUNDS”改变应用标题Text属性,我们全部使用大写(caps)因为它是Windows Phone应用的常用手法。
2、使animals替代页面标题,我们全部使用小写因为他也是常用的。
结果显示:
仅仅使用了一点点样式就更看起来像一个应用。
三、
理解
绑定语法和静态资源
textbox的Style属性是默认设置成
Style="{StaticResource PhoneTextTitle1Style}"
我们将花点时间解释,首先你随时可以在XAML中看到大括号,他们就是绑定语法,有两种类型的绑定语法:
1、{StaticResource }让我们从里面的resource开始,一个资源是一个在应用程序中能重用的对象,例如brush和style
http://msdn.microsoft.com/en-us/library/ms750613.aspx
我们创建一个我能想到的一个最简单的关于
{StaticResource }的项目XAMLResources。
1、添加一个在
<phone:PhoneApplicationPage>下面的子元素,任何brush和style只能用于这个页面不能用于其它页面。
2、我创建了一个SolidColorBrush并且我能通过键值MyBrush引用他。
3、我创建了一个Style我能通过键MyButtonBackground来引用,注意我们设置了TargetType=Button,意思是这个Style只能用于Button,在这个style中我能设置button独有的属性,我设置了Background=Blue。
4、创建Button并将Background属性绑定到MyBrush
5、创建Button的Style属性绑定到MyButtonBackground。
在这个简单的应用中你可能还不能
发现
这样写的价值,但是当你的应用程序特别大的时候你想保持页面上的所有控件有一个统一的外观你就可以发现了。它保持XAML简单和紧凑,当你想改变Style的时候你会发现在所有应用了这个style的地方都会改变。
这是结果:
我们在页面中创建了
本地资源
,意思是我们只能在这个页面中使用这个资源,但是我们怎样才能在整个程序中使用呢?在下面的
例子
中,我将在App.xaml文件的
<Application.Resources>
位置定义主题作为一个系统资源。
四、探索主题资源
现在让我们回到PetSounds项目,你可能想知道PhoneTextTitle1Style样式在哪里定义的,的确他是一种内嵌的样式,作为Windows Phone操作系统主题资源的一部分。
http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff769552(v=vs.105).aspx
如果你往下滚动这个页面你将看到可用于Windows Phone应用的样式。
这些主题应该被利用到windows PHone应用程序中,你应该尽量避免使用
自定义
的颜色字体等样式除非你有一个好的理由,(例如你公司的品牌元素)。
值得注意的是有很多样式是继承其他样式的。这种可视化的继承是允许开发者避免重复创建一些公用的属性,这看起来很像css在web开发中。
我开始说过有两种绑定方式,第二种是{Binding }它用于页面元素绑定数据(即通常一些自定义类型的数据列表),我们将在后面的课程中看到。
五、自定义主题资源通过创建一个继承样式
现在让我们做些有趣的事情,按照我前面说的,你一般应该坚持使用Windows Phone的主题资源,但是我们也能自己创建一个我们想要的样式,我认为这样能提供一个或多个视觉。
确保鼠标的光标是在一个Text设置为animals的TextBlock上。
在属性窗口导航到杂项区域,并且找到Style属性。
注意你将看到style后面的textbox周围是绿色的并且后面的图标也是绿色的,如果你点击右边的小正方形,你将会看到下面的菜单:
在这里我们能改变绑定,实际,我将选择“转换到本地值”,当我们这样做了后,你会发现style属性值不见了取而代之的是用一个定义在<style>的复杂
属性设置
<TextBlock.Style>的值。
正如你看到的我们能将系统主题样式转换成本地样式,我盟能看到在主题样式中的定义,它是基于PhoneTextBlockBase主题样式,并且通过设置两个额外的属性FontFamily和FontSize重写了继承样式,使用这两个定义我们重写样式:
1、设置FontFamily为Verdana
2、设置FontSize为64
这效果如下:
接下来我们将这个样式成为一个
全局
可用的系统资源,我将<TextBlock.Style>和</TextBlock.Style>之间的代码剪切。
然后打开App.xaml文件
粘贴在<Application.Resources>区域(12到19行)我们也添加一个属性x:Name="MyTitleText":
现在我能返回到MainPage.xaml文件并且用新的应用程序资源重写TextBlock:
最后这效果应该是不会改变的:
成功。
回顾
快速回顾下,这节课我们最大的收获就是学习了如何给我们的应用添加样式,让他看起来更像Windows Phone应用但是我们也能表达我们自己的个性。我们学习了如何修改WMAppMainfest.xml文件来修改我们应用的图标和标题。我们改变了应用的标题和页面的标题,学习了如何像Windows Phone的主题资源样绑定静态资源,以及如何创建基于主题资源的本地和系统资源等等。
上一篇:
你应该去寻求在家工作的机会
下一篇:
ASP.NET安全
相关文章
·
菜鸟学Windows Phone 8开发
·
Mac应用商店支持软件版本回滚
·
传微软正在开发智能眼镜 与谷歌眼镜类似
·
谷歌2310万美元收购法国应用优化公司F
·
封装一个通用递归算法,使用TreeIte
·
常见Java程序员面试题及解答
·
spring/struts/mybati
·
开发者应该避免使用的6个Java功能
·
Windows整合云存储服务或使硬盘遭到
·
《战地4》开发商:下一代游戏场面更火爆
查看所有评论(
0
)
我要评论
发表评论
用户名:
匿名
最新文章
菜鸟学Wind..
cocos2d..
·
菜鸟学Windows Phone 8开发
·
ObjC之RunTime(上)
·
cocos2d-x 学习笔记之 CCMe
·
【Android】ScaleAnimat
·
【Android】TypedArray和
·
eclipse 编辑代码区字体大小
·
Android 4学习(9):用户界面
·
Android数据库安全解决方案,使用S
·
【Android】android:win
·
【Android】Tips for An
·
cocos2d-x 3.0 Androi
·
了解WP的传感器
·
jquery mobile -role
·
ios开发中的一些小技巧
·
unable to open sync
最新标签
class
Win8
摄像头
NullPointerException
removeview
viewgroup
onAnimationEnd
controller
异步
同步
今日热点
·
ListView问题解决办法总结
·
JSP+WAP2.0规范
·
解决android2.2把安装程序放入S
·
圆角PopupWindow对话框和圆角E
·
android SurfaceView
·
android---->进度条(P
·
完全退出android程序
·
android 切换卡(TabWidge
·
android 获取ListView列中
·
android ListView 使用
推荐文章
android..
android..
·
android Canvas让我很困惑
·
android ListView的分段显
·
iPhone中使用ShareKit一键分
·
Android 2.1 从SD卡导入联系
·
android中设置List
·
android HTC Desire (
·
PC机上体验Android x86操作系
·
Android make脚本简记
·
Android PreferenceAc
·
android文件上传(android端
·
Android手势研究(textview
·
Android手势研究(textview
·
android的拖拽问题--onTouc
·
TableView 的使用 实例二
·
android 选项卡(TabHost)
English
|
关于我们
|
诚聘英才
|
联系我们
|
网站大事
|
友情链接
|
意见反馈
|
网站地图
Powered by
程序员俱乐部
程序提供: HugoCMS 2.0
网站备案:苏ICP备11048748号-1