• windows phone小试自定义样式 (12) [转]


    转自:http://www.cnblogs.com/shenzhoulong/archive/2012/04/17/2452898.html

    内容:

     

    样式在BS开发中经常用到,在wp中系统也提供了解决办法,就是对设置的样式的一种资源共享,首先是共享资源的位置,它是在App类中,之前我们已经有介绍到设置公共属性存放临时数据,可参考windows phone 三种数据共享的方式(8),同样共享的样式我们也在app类中实现,系统在App.xaml文件中已经给我们提供了Resources集合:

      <!--应用程序资源-->
        <Application.Resources>
            
        </Application.Resources>

     我们只需要在上面标签中加入我们自定义的样式即可,适用于此资源的对象是有FrameworkElement派生的类,此类派生类的列表如下:

     Microsoft.Internal.Pivot.Controls.VisualTreeGraft
            System.Windows.Controls.Border
            System.Windows.Controls.ContentPresenter
            System.Windows.Controls.Control
            System.Windows.Controls.DrawingSurface
            System.Windows.Controls.Image
            System.Windows.Controls.ItemsPresenter
            System.Windows.Controls.MediaElement
            System.Windows.Controls.MultiScaleImage
            System.Windows.Controls.Panel
            System.Windows.Controls.Primitives.Popup
            System.Windows.Controls.RichTextBlock
            System.Windows.Controls.RichTextBlockOverflow
            System.Windows.Controls.TextBlock
            System.Windows.Controls.Viewbox
            System.Windows.Controls.WebBrowser
            System.Windows.Documents.Glyphs
            System.Windows.Shapes.Shape

     以上类或者以上类中派生的类都可以使用此共享资源,这里是指自定义样式,接下来按照上一篇内容的做法,我们给内容区域的Textblock设置前景色,所以在App.xaml 自定义样式可以这样:

     <!--应用程序资源-->
        <Application.Resources>
            <LinearGradientBrush x:Key="lgBrush">
                <GradientStop Offset="0" Color="AliceBlue"></GradientStop>
                <GradientStop Offset="1" Color="BurlyWood"></GradientStop>
            </LinearGradientBrush>
        </Application.Resources>

     x:Key特性是唯一标示该资源的一个键名,在共享资源中必须唯一;自定义样式定义好了,怎么使用那,比较繁琐的做法是这样,不提倡:

    <TextBlock x:Name="tbContent" Text="显示样式" HorizontalAlignment="Center" VerticalAlignment="Center">
                <TextBlock.Foreground>
                    <StaticResource ResourceKey="lgBrush"></StaticResource>
                </TextBlock.Foreground>
            </TextBlock>

     比较常用的书写是这样:

      <TextBlock x:Name="tbContent" Text="显示样式" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource lgBrush}">
                </TextBlock>

     可以看到这里有个大括号,它就是xaml标记扩展,在xaml标记扩展中是不能使用引号的,比如这里的lgBrush不能使用引号;上面两种方法实现的效果一样:即

    此外我们还可以看到MainPage类在xaml文件中已经定义了Foreground,但是在tbContent中我们依然看到了我们自定义的颜色,这说明样式设置的优先级高于继承来的样式的优先级;以上两种方法是实现在xaml文件中对样式的使用,我们也可以在隐藏文件(.cs)进行访问,但是必须是在构造函数完成之后,例如我们可以这样访问刚刚定义的样式:

    View Code using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;
    using Microsoft.Phone.Controls;
    
    namespace ShareStyle
    {
        public partial class MainPage : PhoneApplicationPage
        {
            // 构造函数
            public MainPage()
            {
                InitializeComponent();
                LinearGradientBrush lgBrush = (LinearGradientBrush)this.Resources["lgBrush"];
                TextBlock tb = new TextBlock();
                tb.Name = "tbName";
                tb.VerticalAlignment = VerticalAlignment.Center;
                tb.HorizontalAlignment = HorizontalAlignment.Center;
                tb.Text = "隐藏代码实例化的";
                tb.Foreground = lgBrush;
                this.ContentPanel.Children.Add(tb);
               
            }
        }
    }

    如果想使用该样式的话,就像上面的代码实例化样式,并设置Textblock的前景色为lgBrush,还有另一种写法是将自定义样式中的x:Key改为x:Name,隐藏文件中设置前景色就可以是这样:(此处有疑问:根据教材中的说法,我怎么也获取不到设置的颜色)

     tb.Foreground = lgBrush;

     不需要实例化该自定义颜色,需要注意的是如果使用x:Name资源,该名称必须是在xaml文件中保持唯一性;


     上面的案例是说明怎么自定义某个属性(Foreground )的样式,下面是为特定的元素定义样式集合
    <phone:PhoneApplicationPage>
    <phone:PhoneApplicationPage.Resources>
            <Style x:Key="tbStyle" TargetType="TextBlock">
             <Setter Property="HorizontalAlignment" Value="Center"></Setter>
            </Style>
        </phone:PhoneApplicationPage.Resources>
    </phone:PhoneApplicationPage>

     上面实例代码中x:Key表示键名,在使用该样式的时候会用到,TargetType是指此样式的使用对象元素,Style标签中Setter标签是设置适用此样式的元素属性;

    实例代码:

    <phone:PhoneApplicationPage>
        <phone:PhoneApplicationPage.Resources>
            <Style x:Key="tbStyle" TargetType="TextBlock">
                <Setter Property="HorizontalAlignment" Value="Center"></Setter>
                <Setter Property="HorizontalAlignment" Value="Center"></Setter>
                <Setter Property="Foreground">
                    <Setter.Value>
                        <LinearGradientBrush>
                            <GradientStop Offset="0.2" Color="Brown"></GradientStop>
                            <GradientStop Offset="0.7" Color="DarkBlue"></GradientStop>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Style>
        </phone:PhoneApplicationPage.Resources>
    </phone:PhoneApplicationPage>

     在TextBlock元素中的使用xaml标记扩展得到该样式:

    <TextBlock x:Name="tbContent" Text="显示样式" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource tbStyle}"  />

     得到的效果是这样子的:

     

    作者:神舟龙
        
     

    新建的wp開發者群:42182428 

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
  • 相关阅读:
    解决electron-vue中无法使用Element的Tooltip组件
    解决Electron安装包下载慢的问题
    虚拟机VirtualBox 共享挂载问题:mount: /mnt/xxx: wrong fs type, bad option, bad superblock on xxx
    git 设置和取消代理
    (转载)数据库连接池到底应该设多大?这篇文章可能会颠覆你的认知
    MySQL主主复制+MMM实现高可用
    Mysql5.6主从热备配置
    java 启动 shell脚本
    redis批量删除key
    spring mvc异常统一处理(ControllerAdvice注解)
  • 原文地址:https://www.cnblogs.com/qiongmiaoer/p/3026656.html
Copyright © 2020-2023  润新知