zoukankan      html  css  js  c++  java
  • WP7入门 (二)主题、样式与模版

    主题、样式与模版
    1、主题 -- theme
    theme有两项:Background、Accent color
    (1)获取主题背景
    主题文件以XAML文件形式来描述并存放的,在C:\Program Files\Microsoft SDKs\Windows Phone\v7.0\Design下的Theme Resources.xaml,它也是Framework Element的一个对象,开发人员可以访问。
    (2)获取主题颜色
    通过系统的资源属性PhoneAccentBrush访问 accent colors 的值,可以在XAML代码中直接访问accent colors,代码如:<TextBlock Foreground="{Static Resource PhoneAccentBrush}".../>,也可以用托管代码访问,代码如:
    (Brush)Application.Current.Resources["PhoneAccentBrush"];//是通过资源字典进行获取的,其中的Resources可以更多的获取系统内的资源元素,包括颜色值、字体等。
    2、样式 -- style
    wp7中的样式只能存放于应用程序的Resources里或当前的XAML文档的Resources里,用于更改页面的元素是性质,从而使原色拥有更统一的外观,更统一的属性值设置方式,使程序维护更加简单。
    (1)样式的应用范围
    指的是该样式能够起作用的文件代码区域,将样式定义在当前文档的<Phone:PhoneApplication.Resources>中时,该样式只会对当前文件有效,文件下所有的FrameworkElement均可以引用该样式,但是当需要改文件都可以被项目里的XAML文件元素引用时,必须将样式代码定义在应用程序配置文件App.xaml中。下面以Image为例:
    1> 在当前文件MainPage.xaml中:
    <phone:PhoneApplicationPage.Resources>
    <Style x:Key="Image1" TargetType="Image"> //x:Key="" 表明了样式的名称;TargetType="" 指明了该样式的使用类型是什么
    <Setter Property="Width" Value="180"/> //<Setter ...>中设置统一的属性值
    ......
    <Setter Property="Stretch" Value="Fill"/>
    </Style>
    </phone:PhoneApplicationPage.Resources>
    然后在Image控件的属性中写入:
    <Image Margin="21,46,0,0" Name="p1" Style="{StaticResource Image1}" Source="/wp7实验3;component/Images/12.png"/>
    <Image Margin="218,50,0,0" Name="p2" Style="{StaticResource Image1}" Source="/wp7实验3;component/Images/11.png"/>
    ....
    其中的p1和p2在样式中已经设置好的属性相同,其他的属性都可以再自行设置。
    2> 在App.xaml中,将<Style ...>...</Style>写入<Application.Resource></Application.Resource>中,就可以被该项目里的所有XAML文件元素所引用了。
    (2)也可以使用Expression Blend 4 for Windows Phone 创建样式,EBlend和Adobe的PS差不多的,截图会更清晰的明白,这里就不多写了。。。
    延伸------样式继承
    样式能够通过继承过程来加强或更改其他样式,只需要设置Style的BasedOn属性为之前已经定义过的样式就行,如:
    <Style x:Key="A1" TargetType="Button">....</Style>
    <Style x:Key="B1" TargetType="Button">
    ...
    BasedOn="{StaticeResource A1}"
    <Setter Property="HorizontalAlignment" Value="Left" /> ...
    </Style>
    <Style x:Key="B2" TargetType="Button">
    ...
    BasedOn="{StaticeResource A1}"
    <Setter Property="HorizontalAlignment" Value="Right" /> ...
    </Style>

    ..........
    解释:在你写的引用的代码中可以引用上述B1、B2的两种不同的样式。
    3、模版 -- Template
    模版是通过设置、修改元素的属性以达到定制控件的外观,可以彻底的改变控件的外观、填充等属性,并且能够全部保留控件的自有属性和事件。与样式不同的是,比如将一个Button做成一个图片类型的控件,利用样式很难做到,但模版就很方便了。
    (1)使用模版
    Template和Style的应用范围是一样的,只是有定义的差别,Template在MainPage.xaml中的代码如下:
    <phone:PhoneApplicationPage.Resources>
    <ControlTemplate x:Key="ImageControlTemplate1" TargetType="Image"> //ControlTemplate表示创建一个模版资源
    <Grid> //TargetType表示模版的类型
    .... // 定义模版属性和属性值,比如可以添加一个Image控件。。
    </Grid>
    </ControlTemplate>
    </phone:PhoneApplicationPage.Resources>
    Template和Style的区别还有:Style是以Setter集合定制控件属性的,而Template是通过节点元素来覆盖控件属性的。
    (2)也可以使用Expression Blend 4 for Windows Phone 创建模版喔。。。
    4、在样式中使用模版
    通过样式的<Setter Property="Template">的方式来指定模版,这样就可以在一个控件中既使用样式也使用模版了,在一些复杂的项目中将会为程序的维护提供便利。
    以给Button添加一个Image为例:
    <phone:PhoneApplicationPage.Resources>
    <Style x:Key="Button1" TargetType="Button"> //x:Key="" 表明了样式的名称;TargetType="" 指明了该样式的使用类型是什么
    <Setter Property="Width" Value="180"/> //<Setter ...>中设置统一的属性值
    ......
    <Setter Property="Template"> //这里很重要,指定集合属性值为自定义模版代码,这样能够为样式所引用
    <Setter.Value> // 下面为模版
    <ControlTemplate TargetType="Image">
    <Grid>
    <Image Source="/Img;component/png/1.png" Stretch="Fill"> .........
    </Grid>
    </ControlTemplate>
    </Setter.Value>
    </Setter>
    </Style>
    </phone:PhoneApplicationPage.Resources>
    定义之后使用时只需要在Button中指定Style属性值,不需要设置Template属性值,就可以讲模版套用在该Button控件上了。。
    延伸---
    也可以在<Setter Property="?"></Setter>中添加其他的,例如
    <Setter Property="Foreground">
    <Setter.Value> //下面为渐变画刷
    <LinearGradientBrush>
    <GradientStop Offset="0" Color="Pink">
    ....
    </LinearGradientBrush>
    </Setter.Value>
    </Setter>

    后记--我啊,一个连菜鸟都称不上的小麻雀,写下的一些东西很基础,代码很少,先把理论弄明白了以后再深入实践,是给我自己积累的,也拿出来给friends分享下。。。

    http://www.cnblogs.com/kefira/archive/2012/11/06/WP.html

  • 相关阅读:
    [WF4.0 实战] AutoResetEvent具体解释(线程独占訪问资源)
    linux下getrlimit与sysconf函数
    36.怎样使用定时任务
    1016. 部分A+B (15)
    找你妹+ipad+wifi,回顾那年的经典游戏
    Oracle 外键约束子表、父表
    字符串 上
    LeetCode103 BinaryTreeZigzagLevelOrderTraversal(二叉树Z形层次遍历) Java题解
    jquery ajax參数加点号状态200进error
    泛型数组随机排列工具类
  • 原文地址:https://www.cnblogs.com/zziss/p/2759095.html
Copyright © 2011-2022 走看看