zoukankan      html  css  js  c++  java
  • SilverLight控件样式及控件模版

    SilverLigth继承了WPF的样式风格和模版的概念,和HTML使用CSS样式差不多。

    为什么引入样式和使用样式,这点恐怕使用过CSS的人都应该有比较直观的感觉。就不多说了

    在SilverLight中使用样式三种(目前我了解到的)

    1,控件内部样式(CSS内联样式,和CSS中一样,具有最高优先权):在控件内部定义样式

    <Button>

      <Button.Style>

        <Style>      //这种形式的,要是闲着没事,可以选择

         </Style>

      </Button.Style>

    </Button>

     1 <Grid x:Name="LayoutRoot" Background="White">
     2         <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
     3         <Button x:Name="btn" Content="提交按钮" ToolTipService.Placement="Mouse" >
     4             <ToolTipService.ToolTip>
     5                 <Image Source="/image/ooo.jpg"/>
     6             </ToolTipService.ToolTip>
     7         </Button>
     8             <Button x:Name="btn1" Content="对比" FontSize="10"/>
     9         </StackPanel>
    10  </Grid>

    2,用户控件资源

    在UserControl.Resources中定义Style

    <Style x:Key="btnStyle" TargetType="Button"></Style>  //TargetType表示该样式作用于哪一种控件,key是为了引用

    引用方式:Style="{StaticResource btnStyle}"

    引入样式后可以在控件内部重新定义属性,并且可以覆盖引入的样式(和CSS中样式级别一样)

     1 <UserControl.Resources>
     2         <Style x:Key="btnStyle" TargetType="Button">
     3             <Setter Property="HorizontalAlignment" Value="Center"></Setter>
     4             <Setter Property="VerticalAlignment" Value="Center"></Setter>
     5             <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
     6             <Setter Property="VerticalContentAlignment" Value="Center"></Setter>
     7             <Setter Property="FontSize" Value="14"></Setter>
     8         </Style>
     9     </UserControl.Resources>
    10     
    11     <Grid x:Name="LayoutRoot" Background="White">
    12         <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
    13         <Button x:Name="btn" Content="提交按钮" ToolTipService.Placement="Mouse" >
    14             <ToolTipService.ToolTip>
    15                 <Image Source="/image/ooo.jpg"/>
    16             </ToolTipService.ToolTip>
    17         </Button>
    18             <Button x:Name="btn1" Content="对比" Style="{StaticResource btnStyle}" FontSize="10"/>
    19         </StackPanel>
    20     </Grid>

    3,全局样式:在APP.xaml中如上定义

     1 <Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     2              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     3              x:Class="MySilverLightTest.App"
     4              >
     5     <Application.Resources>
     6         <Style x:Key="btnStyle" TargetType="Button">
     7             <Setter Property="HorizontalAlignment" Value="Center"></Setter>
     8             <Setter Property="VerticalAlignment" Value="Center"></Setter>
     9             <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
    10             <Setter Property="VerticalContentAlignment" Value="Center"></Setter>
    11             <Setter Property="Background" Value="Red"></Setter>
    12             <Setter Property="Foreground" Value="Blue"></Setter>
    13             <Setter Property="FontSize" Value="14"></Setter>
    14         </Style>
    15         <Style x:Key="textBlockStyle" TargetType="TextBlock">
    16             
    17         </Style>
    18     </Application.Resources>
    19 </Application>

    用户控件资源样式、全局样式形式,如果在定义Style时,没有指定x:Key="",那么,该样式作用于该样式的作用域!

    用户控件资源样式作用域:定义该要是的xaml内部

    App.xaml中定义的全局样式,作用域:该项目


    扩展:

    SilverLight中的控件内部样式使用仅限于该控件本身,因此它没有被放在资源字典中。

    控件资源(xxx.Resources)是向下继承的!!!

     1     <Grid>
     2         <Grid.Resources>
     3             <Style x:Key="btnStyle" TargetType="Button">
     4                 <Setter Property="HorizontalAlignment" Value="Center"></Setter>
     5                 <Setter Property="VerticalAlignment" Value="Center"></Setter>
     6                 <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
     7                 <Setter Property="VerticalContentAlignment" Value="Center"></Setter>
     8                 <Setter Property="FontSize" Value="14"></Setter>
     9             </Style>
    10         </Grid.Resources>
    11         <Button x:Name="btn" Style="{StaticResource btnStyle}"/>
    12     </Grid>

     控件模版

      SilverLight每个控件都有若干属性,用于改变控件的大小、颜色、字体、位置等。但通过属性来改变控件的外观形状是有限的。

    ………………

  • 相关阅读:
    用GDB调试程序(一)
    ZOJ Problem Set
    android 去除标题
    【hadoop之翊】——基于CentOS的hadoop2.4.0伪分布安装配置
    layoutSubviews总结
    用数据说话,外贸产品选择(中篇)-google趋势分析法
    Apache介绍
    浅谈android4.0开发之GridLayout布局
    Android GridView 分页加载数据
    Android TableLayout中的使用说明
  • 原文地址:https://www.cnblogs.com/lh-V/p/3435154.html
Copyright © 2011-2022 走看看