Silverlight之资源样式的应用（5）

最新推荐文章于 2013-12-30 16:42:35 发布
最新推荐文章于 2013-12-30 16:42:35 发布
阅读量107 收藏
点赞数

代码下载

1.样式关键点
<UserControl.Resources>
<!-- 将样式应用于按钮Button-->
<Style TargetType="Button" x:Key="t1">
<!-- 设置Button上字体色为蓝色到红色渐变-->
<Setter Property="Foreground">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0.5" EndPoint="0.5,1">
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="Red" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<!-- 设置Button背景色为红色-->
<Setter Property="Background">
<Setter.Value >
red
</Setter.Value>
</Setter>
<!-- 设置Button字体字号为22-->
<Setter Property="FontSize" Value="22"></Setter>
</Style>
<!-- 将样式应用于TextBox-->
<Style TargetType="TextBox" x:Key="txt1">
<!-- 设置TextBox背景色为蓝色-->
<Setter Property="Background" Value="blue"></Setter>
</Style>

<!-- 将样式继承关系-->
<Style TargetType="TextBox" x:Key="txt2" BasedOn="{StaticResource txt1}">
<!-- 设置TextBox背景色为蓝色-->
<Setter Property="FontSize" Value="12"></Setter>
<!-- 覆盖父样式-->
<Setter Property="Background" Value="Red"></Setter>
</Style>

<LinearGradientBrush x:Key="l1">
<GradientStop Color="Blue" Offset="0"></GradientStop>
<GradientStop Color="Black" Offset="1"></GradientStop>
</LinearGradientBrush>
</UserControl.Resources>
2.应用样式代码
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions >
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<!-- TextBox应用样式-->
<TextBox Style="{StaticResource txt1}" Height="30" Width="100" Grid.Row="0" Grid.Column="0"></TextBox>
<!-- TextBox不应用样式-->
<TextBox Height="30" Width="100" Grid.Row="1" Grid.Column="0"></TextBox>
<!-- TextBox应用继承的样式-->
<TextBox Height="30" Width="100" Grid.Row="2" Grid.Column="0" Text="TextBox应用继承的样式" Style="{StaticResource txt2}"></TextBox>

<!-- Button不应用样式-->
<Button x:Name="b2" Height="30" Width="100" Grid.Row="0" Grid.Column="1" Content="bt1"></Button>
<Button x:Name="b3" Height="30" Width="100" Grid.Row="1" Grid.Column="1" Content="bt1"></Button>
<Button x:Name="b4" Height="30" Width="100" Grid.Row="2" Grid.Column="1" Content="中华人民共和国" Foreground="{StaticResource l1}"></Button>
<!-- Button应用样式-->
<Button x:Name="b1" Grid.Row="2" Grid.Column="2" Content="得到资源值" Style="{StaticResource t1}" Click="b1_Click" Margin="16,35,0,23"></Button>
</Grid>
3.说明
1）可以使用X：key。也可以使用X:Name来定义资源。
不同的是，使用X:Name必须是唯一的，使用X:key在一个范围内必须唯一，但是在小范围之外是可以重复。
关键在cs代码方法如果是X:Name，可以直接把name当作cs的对象来使用，但是如果是key，必须使用this.Resources["l1"]；来获得属性
2）样式Style基本是为特定的元素类型分配的属性集合，除了有Key外，还有一个TargetType属性，设置作用的控件类型。
3)样式的继承使用Baseon={StaticResource btnStyle}
继承父样式以后，可以直接使用父样式中的定义，如果有重复的定义，子样式会覆盖父样式的内容

3.执行效果

补充文档

新增样式代码

<UserControl xmlns:my="clr-namespace:SLUI"  x:Class="SLUI.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="600" d:DesignWidth="800" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">

    <Grid x:Name="LayoutRoot" Style="{StaticResource GridStyle}">
        <Grid.ColumnDefinitions >
            <ColumnDefinition ></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions >
            <RowDefinition Height="Auto" MinHeight="600"></RowDefinition>
        </Grid.RowDefinitions>

        <Border Name="borderAll"  CornerRadius="10" Height="500" Style="{StaticResource BorderStyle}">
            <StackPanel Height="500" HorizontalAlignment="Center"  Name="stackPanel3" VerticalAlignment="Top" Style="{StaticResource StackPanelStyle}" Orientation="Vertical" FlowDirection="RightToLeft" >
                <!--大标题高50-->
                <StackPanel   Name="stackPanelBigTitle"  Style="{StaticResource StackPanelBigTitleStyle}">
                    <TextBlock Name="txtBigTitle" Text="借款申请单" Style="{StaticResource TextBlockBigTitleStyle}"/>
                </StackPanel>
                <!--小标题高30-->
                <StackPanel  Name="stackPanel1"  Style="{StaticResource StackPanelSmallTitleStyle}">
                    <TextBlock  Name="txtTitle" Text="基本信息"  Style="{StaticResource TextBlockSmallTitleStyle}"/>
                </StackPanel>
                <!--工具栏30-->
                <StackPanel  Name="stackPanel2"  Style="{StaticResource StackPanelToolStyle}" >
                    <Button Content="取消" Name="button2" Width="75"  Style="{StaticResource ButtonStyle}"/>
                    <Button Content="保存" Name="btnSave" Width="75" Style="{StaticResource ButtonStyle}"/>
                </StackPanel>
                <!--内容100-->
                <Border Height="100" Name="border1" Style="{StaticResource BorderContentStyle}" >
                    <StackPanel  Height="99"   Name="stackPanelContent1"  Style="{StaticResource StackPanelContentStyle}">
                    	<Grid Height="102"  FlowDirection="LeftToRight">
                    		<Grid.ColumnDefinitions>
                    			<ColumnDefinition/>
                    			<ColumnDefinition/>
                    			<ColumnDefinition/>
                    			<ColumnDefinition/>
                    		</Grid.ColumnDefinitions>
                    		<Grid.RowDefinitions>
                    			<RowDefinition/>
                    			<RowDefinition/>
                    			<RowDefinition/>
                    			<RowDefinition/>
                    		</Grid.RowDefinitions>
                    		<sdk:Label Margin="27,6,51,3" d:LayoutOverrides="Height" Content="申请单编号"/>
                    		<sdk:Label Grid.Column="2" Margin="28,6,10,3" d:LayoutOverrides="Height" Content="申请单名称"/>
                    		<sdk:Label Margin="27,5,35,4" Grid.Row="1" d:LayoutOverrides="Height" Content="项目编号"/>
                    		<sdk:Label Grid.Column="2" Margin="28,5,26,4" Grid.Row="1" d:LayoutOverrides="Height" Content="项目名称"/>
                    		<sdk:Label Margin="27,4,43,5" Grid.Row="2" d:LayoutOverrides="Height" Content="业务类别"/>
                    		<sdk:Label Grid.Column="2" Margin="28,5,42,0" Grid.Row="2" Content="币种"/>
                    		<sdk:Label Margin="27,3,59,6" Grid.Row="3" d:LayoutOverrides="Height" Content="借款单位"/>
                    		<sdk:Label Grid.Column="2" Margin="28,3,42,6" Grid.Row="3" d:LayoutOverrides="Height" Content="是否合作项目"/>
                    		<ComboBox Grid.Column="1" Margin="5,2,1,3" Grid.Row="2"/>
                    		<ComboBox Grid.Column="3" Margin="-14,2,20,2" Grid.Row="2"/>
                    		<CheckBox Content="" Grid.Column="3" Margin="-13,3,35,-2" Grid.Row="3"/>
                    		<ComboBox Grid.Column="1" Margin="5,0,1,4" Grid.Row="3" Height="21" VerticalAlignment="Bottom"/>
                    		<TextBox Grid.Column="1" Margin="5,0,1,2" TextWrapping="Wrap" Text=""/>
                    		<TextBox Grid.Column="3" Margin="-14,0,20,1" TextWrapping="Wrap" Text=""/>
                    		<TextBox Grid.Column="1" Margin="5,0,1,1" Grid.Row="1" TextWrapping="Wrap" Text="" d:LayoutOverrides="Height"/>
                    		<TextBox Grid.Column="3" Margin="-14,0,20,1" Grid.Row="1" TextWrapping="Wrap" Text=""/>
                    	</Grid>
                    </StackPanel>
                </Border>

                <!--小标题高30-->
                <StackPanel   Name="stackPanelTitle2"  Style="{StaticResource StackPanelSmallTitleStyle}">
                    <TextBlock Name="txtTitle2" Text="合作方信息"  Style="{StaticResource TextBlockSmallTitleStyle}"/>
                </StackPanel>
                <!--工具栏30-->
                <StackPanel  Name="stackPanelTool2" Style="{StaticResource StackPanelToolStyle}">
                    <Button Content="添加合作方信息" Name="btnSave2" Width="100"  Style="{StaticResource ButtonStyle}"/>
                </StackPanel>
                <!--内容100-->
                <Border Height="100" Name="border2" Style="{StaticResource BorderContentStyle}">
                    <StackPanel  Height="100"  Name="stackPanelContent2" Style="{StaticResource StackPanelContentStyle}">
                    	<sdk:DataGrid Height="100" Background="White" FlowDirection="LeftToRight">
                    		<sdk:DataGrid.Columns>
                    			<sdk:DataGridCheckBoxColumn Header="选择"/>
                    			<sdk:DataGridTextColumn Header="合作方名称"/>
                    			<sdk:DataGridTextColumn Header="出资比例"/>
                    			<sdk:DataGridTextColumn Header="出资金额"/>
                    		</sdk:DataGrid.Columns>
                    	</sdk:DataGrid></StackPanel>
                </Border>
                
                <!--小标题高30-->
                <StackPanel   Name="stackPanelTitle3" Style="{StaticResource StackPanelSmallTitleStyle}">
                    <TextBlock Name="txtTitle3" Text="支付信息"   Style="{StaticResource TextBlockSmallTitleStyle}"/>
                </StackPanel>
                <!--工具栏30-->
                <!--内容100-->
                <Border Height="100" Name="border3" Style="{StaticResource BorderContentStyle}">
                    <StackPanel  Height="100" Name="stackPanelContent3" Style="{StaticResource StackPanelContentStyle}"></StackPanel>
                </Border>

            </StackPanel>
        </Border>
    </Grid>
</UserControl>


效果：

代码下载

iteye_4515
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Silverlight 5 Toolkit
02-02
Silverlight5 Toolkit,扩展了silverlight包，如WrapPanel
Silverlight5.0正式发布附下载地址
深海软件信息技术服务网【云中*深海】
04-15 1849
<br />Silverlight5.0正式发布附下载地址，带着大量全新特性的微软Silverlight5 Beta终于发布。<br /> <br />Silverlight是一个创建参与，为网络和移动应用的用户体验，交互功能强大的开发工具。 <br />Silverlight是一个免费的插件，搭载了.NET框架和多种浏览器，设备和操作系统兼容，带来了新的高度的交互性网络的任何地方工作。<br />Silverlight 是一种跨浏览器、跨平台的 .NET Framework 实现，用于为 Web 生成和提
Silverlight 5 开发工具包 - 中文
06-01
Silverlight 5 开发工具包- 中文
silverlight 5下载全
05-18
包括silverlight 5.exe，Silverlight_Developer.exe，Silverlight5_Tools.exe
silverlight 5安装包
05-30
安装SilverLight 5 相关安装包，注意必须要安装vs2010 sp1 补丁
利用样式和资源改写silverlight4中的导航应用程序
06-04
利用网上下载的精美样式和资源改写silverlight4中的导航应用程序，vs2010中sl4的扩展性极好
样式Silverlight
04-11
样式Silverlight应用的例子。比较全面描述了样式资源的用法。
为Silverlight应用程序创建图像按钮的一步
04-04
我必须为我的Silverlight网站创建一个简单的图像按钮。 我在网上搜索了很多提示和建议。 但是，它们大多数涉及通过资源，模板或样式的几个编辑步骤。 有些需要其他工具，例如Expression Blend。 在我的...
Silverlight在线几何绘图
04-27
当你解读Silverlight代码和WPF代码的时候，你将会发现这并没有什么重大的不同之处（所以现在出现了Silverlight 和 WPF的兼容性类库，甚至出现了Silverlight 和 WPF的转换程序）。或者我们不妨悲剧的理解这本就是一个...
silverlight一步步学习
04-23
创建一个基本的Silverlight应用；2.基本控件 ；3.界面布局；4.鼠标事件处理；5.实现简单的拖放功能；6.键盘事件处理；7.全屏模式支持；8.使用样式封装控件观感；9.使用控件模板；10.使用用户控件；11.数据绑定；12....
Silverlight漂亮清爽的按钮样式
02-29
Silverlight漂亮清爽的按钮样式
siverlight蓝色控件样式
04-21
一套蓝色的silverlight控件样式
Silverlight样式学习
weixin_33937913的博客
06-08 64
&lt;UserControl x:Class="StyleDemo.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas...
Silverlight 样式
蝈蝈俊.net
12-30 1311
WPF 和 Silverlight 支持 Style 机制，它允许我们把控件的属性值封装成可重用的资源。我们可以把这些样式声明保存在独立于页面的其他文件中(当然本文件也可以)，然后就可以在一个应用程序中跨控件和页面重用（甚至跨多个应用程序重用）。在做一些基本定制的场景下，概念上类似于在 HTML 中重用 CSS。   一个样式的简单例子 我们给一个园定义一个名叫 EllipseStyle1
silverlight全局（App.xaml）和局部样式汇总
ansy的专栏
04-25 1137
　1、内联方式--即直接在控件内部利用其属性进行设置 　　　 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 　　　 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 　　　 Width="400" Height="300">　　　 　　　　　　　 　
Silverlight 控件自定义样式
crystal的专栏
09-01 1000
<br /><Style  x:Key="PopupTextBoxStyle"  TargetType="Grid"><br />            <Setter Property="Width" Value="200"/><br />            <Setter Property="Template"><br />                <Setter.Value><br />                    <ControlTemplate TargetType="Grid
Silverlight样式(Style)的定义与引用
weixin_33860528的博客
07-23 86
类似css的方式。 定义：.header{color:red;}应用：&lt;div class='header'&gt;&lt;/div&gt;Silverlight定义样式是这样：在App.xaml中定义如下：在这里定义了DataGrid的Header样式与Element的样式。注意添加引用：xmlns:sdk="http://schemas.microsoft.com/winfx/2006...
Silverlight通过代码设置样式
技术积累、分享成果
12-30 1174
1.从页面资源中获取样式并应用 btnTest.Style = (Style)this.Resources["BigButtonStyle"] 2.从项目中单独分开的资源字典文件(或一个引用的程序集中)中获取样式。 首先，需要创建一个ResourceDictionary对象并提供正确的URI: ResourceDictionary dictionary = new ResourceDict
silverlight5_sdk.exe
最新发布
07-24
总之，Silverlight 5 SDK是一个完整的开发套件，为开发人员提供了一切必要的工具和资源，以便于他们使用Silverlight技术创建出色的Web应用程序和媒体内容。 ### 回答2： Silverlight 5 SDK是微软公司发布的一款...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值