• silverlight控件样式控制


    在我们asp.net中我们页面控件的样式是通过css控制的,同样在silverlight中也设置了几种不同方式的控件样式控制方法

    1、对于全局样式的控制我们放在App.xaml文件中

    <Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        x:Class="Silverlight20.App"        >   <Application.Resources>
        <!--全局样式 - 任何地方都可引用-->     <!--     Style - 自定义样式资源。用于修改控件的样式。各个控件的默认样式可参见文档       x:Key - 唯一标识       TargetType - 目标对象类型       Setter - 属性设置器       Property - 需要设置的属性名称       Value - 需要设置的属性值     -->     <Style x:Key="styleTestApp" TargetType="TextBox">       <Setter Property="FontSize" Value="24"/>       <Setter Property="Foreground" Value="#0000FF"/>     </Style>
      </Application.Resources> </Application>

    2、当我们的系统在非常庞大的话,我们都放在此文件下会造成此文件非常的长,维护起来相当的不方便,为此微软又提供了两一种样式管理方式,通过新建数据字典文件,然后在控件中引用该文件

    <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <ControlTemplate x:Key="homeTemplate" TargetType="Button">   <Grid>    <VisualStateManager.VisualStateGroups>     <VisualStateGroup x:Name="FocusStates">      <VisualStateGroup.Transitions>       <VisualTransition GeneratedDuration="00:00:00.1000000"/>      </VisualStateGroup.Transitions>      <VisualState x:Name="Unfocused"/>      <VisualState x:Name="Focused"/>     </VisualStateGroup>     <VisualStateGroup x:Name="CommonStates">      <VisualStateGroup.Transitions>       <VisualTransition GeneratedDuration="00:00:00.1000000"/>      </VisualStateGroup.Transitions>      <VisualState x:Name="MouseOver">       <Storyboard>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="normal" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>        </DoubleAnimationUsingKeyFrames>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="down" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>        </DoubleAnimationUsingKeyFrames>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="hover" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>        </DoubleAnimationUsingKeyFrames>       </Storyboard>      </VisualState>      <VisualState x:Name="Normal"/>      <VisualState x:Name="Pressed">       <Storyboard>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="normal" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>        </DoubleAnimationUsingKeyFrames>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="hover" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>        </DoubleAnimationUsingKeyFrames>        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="down" Storyboard.TargetProperty="(UIElement.Opacity)">         <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>        </DoubleAnimationUsingKeyFrames>       </Storyboard>      </VisualState>      <VisualState x:Name="Disabled"/>     </VisualStateGroup>    </VisualStateManager.VisualStateGroups>    <Image Height="26" x:Name="normal"  Width="26" Source="images/home_rest.png" Stretch="Fill"/>    <Image Height="26" x:Name="down" Width="26" Opacity="0" Source="images/home_pressed.png" Stretch="Fill"/>    <Image Height="26" x:Name="hover" Width="26" Opacity="0" Source="images/home_hover.png" Stretch="Fill"/>   </Grid> </ControlTemplate> <Style x:Key="ButtonStyle1" TargetType="Button">   <Setter Property="Template">    <Setter.Value>     <ControlTemplate TargetType="Button">      <Grid>       <Button x:Name="btnup"  Content="up" Template="{StaticResource homeTemplate}"/>       <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>      </Grid>     </ControlTemplate>    </Setter.Value>   </Setter> </Style> <!-- 应该在此定义资源字典条目。--> </ResourceDictionary>

    通过不同文件的分配可以使得样式管理起来更加的方便,是一种推荐的方式,更能使得文件的复用性增强。

    3、有一种情况是在该控件的样式只有自己本身应用,在系统别的地方没有使用,诸如此种情况,我们应用页面内引用,和css的应用类似

    <UserControl x:Class="Silverlight20.Appearance.Style"   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">    <StackPanel HorizontalAlignment="Left">
        <StackPanel.Resources>
          <!--容器内样式 - 所属容器内可引用-->       <!--       Style - 自定义样式资源。用于修改控件的样式。各个控件的默认样式可参见文档         x:Key - 唯一标识         TargetType - 目标对象类型         Setter - 属性设置器         Property - 需要设置的属性名称        Value - 需要设置的属性值       -->       <Style x:Key="styleTestInContainer" TargetType="TextBox">         <Setter Property="FontSize" Value="24"/>         <Setter Property="Foreground" Value="#00FF00"/>       </Style>
        </StackPanel.Resources>
        <!--全局样式的应用-->     <TextBox Text="我是TextBox(全局样式的应用)" Margin="5" Style="{StaticResource styleTestApp}" />
        <!--容器内样式的应用-->     <TextBox Text="我是TextBox(容器内样式的应用)" Margin="5" Style="{StaticResource styleTestInContainer}" />
        <!--内联样式的应用。内联样式优先级高于全局样式和容器内样式-->     <TextBox Text="我是TextBox(内连样式的应用)" Margin="5" Foreground="#FF0000" Style="{StaticResource styleTestInContainer}" />
      </StackPanel> </UserControl>

    以上三种方式为系统基本的应用方式,当让一些简单的样式改变,可以使用在控件内部直接定义。

    在我们定义控件样式的同时,我们会在系统中应用到相同的控件,为了达到控件的复用性,微软提供了自定义控件模板,此种方式也是我们最常用的方式,当让相对难度大一点的控件在我们定义后,其应用不会仅局限于该项目中,在另外的项目中我们同样的能应用。

    4、当我们感觉我们所应用的控件不行仅仅局限于vs自带的控件的时候,微软为此特意开发了几套系统皮肤,供我们使用,对于系统整体皮肤的更换其实也很简单,我们在微软官方网站下载Silverlight_4_Toolkit_2010安装包,安装后在vs中就会自动添加相应的皮肤文件

    图片

    我们在系统中引用的时候最简单的方式就是直接添加dll文件

    系统引用时先添加命名空间

    //引入命名空间 using System.Windows.Controls.Theming; 然后在代码中加入

       /////////////             RainierOrangeTheme.SetIsApplicationTheme(App.Current, true);//设置主题

    简单的两行代码就能实现整套系统的整体换肤

    当然还有另一种应用的方式

    系统中添加xmal皮肤文件

    让后后台代码中应用

    Uri url = new Uri("Themes/Xaml/System.Windows.Controls.Theming.RainierOrange.xaml", UriKind.Relative); Theme.SetApplicationThemeUri(App.Current, url);

    此种方式同样也是两行代码,但在应用时须将皮肤文件的属性生成时标识为:内容

    当然能力可以,自己可以定义皮肤文件。

  • 相关阅读:
    原型设计 + 用户规格说明书
    第三次作业
    MathExam第二次作业
    第一次随笔
    冲鸭第一的合作
    功能规格说明书
    测试与优化
    结对编程
    高分小学计算器
    现实与梦
  • 原文地址:https://www.cnblogs.com/zhijianliutang/p/2250579.html
Copyright © 2020-2023  润新知