Silverlight2 边学边练之六设定风格

阳光穿透心脏的1/2处 2022-02-01 01:59 225阅读 0赞

本篇的内容较为简单，主要针对Style进行一个练习。Style简要的说就是一些属性值的集合，  
作用和CSS比较像。在Silverlight2中定义Style只能同用于同种类型的Element。如下代码：

<Style x:Key="ButtonStyleTwo" TargetType="Button">
                <Setter Property="FontFamily" Value="Arial" />
                <Setter Property="FontSize" Value="40" />
                <Setter Property="Foreground" Value="Blue" />
                <Setter Property="Background"></Style>

这就是一个定义好的Style，它只能用于Button组件，看看它如何产生作用，将Style直接嵌入Button：

<Button Content="Button">
        <Button.Style>
             <Style TargetType="Button">
                  <Setter Property="FontFamily" Value="Arial" />
                  <Setter Property="FontSize" Value="40" />
                  <Setter Property="Foreground" Value="Blue" />
                  <Setter Property="Background">
                     <Setter.Value>
                       <LinearGradientBrush>
                         <GradientStop Color="Green" Offset="0"></GradientStop>
                         <GradientStop Color="Red" Offset="1"></GradientStop>
                       </LinearGradientBrush>
                     </Setter.Value>
                  </Setter>
             </Style>
        </Button.Style></Button>

当然也可以通过Resource的方式来设置Style，分别设置了两个Style：ButtonStyleOne、ButtonStyleTwo，  
ButtonStyleOne设置为默认Style，ButtonStyleTwo用于在点击Button后切换Style。

XAML Code：

<UserControl x:Class="SilverlightTest.Page"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Width="400">
        <UserControl.Resources>
            <Style x:Key="ButtonStyleOne" TargetType="Button">
                <Setter Property="FontFamily" Value="Georgia" />
                <Setter Property="FontSize" Value="40" />
                <Setter Property="Foreground" Value="SlateGray" />
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush>
                            <GradientStop Color="Blue" Offset="0"></GradientStop>
                            <GradientStop Color="Yellow" Offset="1"></GradientStop>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="ButtonStyleTwo" TargetType="Button">
                <Setter Property="FontFamily" Value="Arial" />
                <Setter Property="FontSize" Value="40" />
                <Setter Property="Foreground" Value="Pink" />
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush>
                            <GradientStop Color="Green" Offset="0"></GradientStop>
                            <GradientStop Color="Red" Offset="1"></GradientStop>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Style>
        </UserControl.Resources>
        <StackPanel x:Name="LayoutRoot" Background="White">
            <Button x:Name="TestButton" Content="A Customized Button" 
    Style="{
        StaticResource ButtonStyleOne}" Click="Button_Click"></Button>
        </StackPanel>
    </UserControl>

用C\#来切换Sytle，如下代码：

private void Button_Click(object sender, RoutedEventArgs e)
    {
       //切换Style:ButtonStyleTwo
       TestButton.Style = this.Resources["ButtonStyleTwo"] as Style;
       //修改Button文字
    TestButton.Content = "Style Changed";
    }

实例Demo效果（感谢[GWPBrian][]指导SL嵌入cnblogs方法）：

本例参考自《Pro Silverlight 2 in C\# 2008》CHAPTER 11 ■ STYLES, TEMPLATES, AND CUSTOM CONTROLS

本文转自Gnie博客园博客，原文链接：http://www.cnblogs.com/gnielee/archive/2009/08/02/silverlight2-learning-style.html，如需转载请自行联系原作者

[GWPBrian]: http://www.cnblogs.com/gaoweipeng/

发表评论取消回复

表情：

评论列表（有 0 条评论，225人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML5一些小结------边学边更

Div没有明确语义块标签可以实现自动换行 H5引入了一些有明确语义的div，用这些div来构建网页，便于搜索引擎找到相关的内容，主要有 header（页眉）,footer

梦里梦外;/ 2023年07月07日 08:15/ 0 赞/ 150 阅读

相关近万字的Numpy总结——边学边练

前言： > 作者：神的孩子在歌唱 > 大家好，我叫陈运智，大家可以叫我小智 Numpy大汇总一. Naddary结构总结 1.1

た入场券/ 2023年01月16日 09:56/ 0 赞/ 151 阅读

相关玩游戏学前端——钢笔工具边玩边学

引入大约一年前曾经通过两篇文章给大家推荐了几个前端游戏《[玩游戏学前端——猜颜色、选择器][Link 1]》、《[玩游戏学前端——颜色您了解多少？][Link 2]》，

╰+攻爆jí腚メ/ 2022年08月07日 20:29/ 0 赞/ 294 阅读

相关 Haskell之Yesod开发–边踩坑边开发(2)

今天继续上一节的开发今天我们需要具体的开发一个图书馆网站，分为以下几个页面 / HomeR GET 主页 /login LoginR GET 用户登录页面

以你之姓@/ 2022年08月01日 13:51/ 0 赞/ 370 阅读

相关 Vuex2.0边学边记+两个小例子

转载自：http://www.jianshu.com/p/13bec8f5b17d 最近在研究Vuex2.0，搞了好几天终于有点头绪了。首先vuex概念比较多，

向右看齐/ 2022年07月10日 04:30/ 0 赞/ 259 阅读

相关 LaTeX边学边用

表格：三线表：[http://blog.sina.com.cn/s/blog\_5e16f1770100fwi5.html][http_blog.sina.com.cn

﹏ヽ暗。殇╰゛Y/ 2022年06月11日 02:51/ 0 赞/ 264 阅读

相关 scala-边学边记(快学scala)

随机数 import java.util.Random val rand = new Random() val x = rand.nextInt(

谁践踏了优雅/ 2022年05月16日 07:51/ 0 赞/ 253 阅读

相关 iOS边练边学--UIGestureRecognizer手势识别器简单介绍

iOS 3.2之后，苹果退出了手势识别功能（Gesture Recognizer），在触摸事件处理方面，大大简化了开发者的开发难度。一、UIGestureRecognize

川长思鸟来/ 2022年03月27日 04:28/ 0 赞/ 281 阅读

相关 Silverlight2 边学边练之六设定风格

本篇的内容较为简单，主要针对Style进行一个练习。Style简要的说就是一些属性值的集合，作用和CSS比较像。在Silverlight2中定义Style只能同用于同种类

阳光穿透心脏的1/2处/ 2022年02月01日 01:59/ 0 赞/ 226 阅读

相关 Docker 入门终极指南：边学边用

点击上方 [Java后端][Java]，选择设为星标优质文章，及时送达 -------------------- 作者：jartto 出处：http://ja

墨蓝/ 2021年09月01日 07:42/ 0 赞/ 426 阅读