[源码下载]
稳扎稳打Silverlight(40) - 3.0绑定之Element to Element Binding,relativeSource; 样式之动态修改样式,样式继承,自定义光标
作者： webabcd
介绍
Silverlight 3.0 绑定的新增功能，样式相关的新增功能
Element to Element Binding - Element 到 Element 之间的绑定 relativeSource - 一个扩展标记，用于指定关联数据源为 Self 或 TemplatedParent 动态修改样式 - 在 Runtime 时修改样式 样式继承 - 通过 BasedOn 使某样式可以继承自另一个样式 自定义光标 - 通过 CaretBrush 自定义输入框的光标的样式
在线DEMO
http://www.cnblogs.com/webabcd/archive/2009/08/04/1538238.html
示例
1、Element to Element 绑定的演示
Element2Element.xaml
< navigation:Page x:Class ="Silverlight30.Binding.Element2Element"
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"
xmlns:navigation ="clr-namespace:System.windows.Controls;assembly=System.windows.Controls.Navigation"
d:DesignWIDth ="640" d:DesignHeight ="480"
Title ="Element to Element Binding Page" >
< GrID x:name ="LayoutRoot" >
< StackPanel VerticalAlignment ="top" HorizontalAlignment ="left" >
<!-- Element to Element 绑定的支持 -->
<!--
绑定方式1：{Binding 绑定的属性名称, Mode=, Elementname=绑定的对象名称}
绑定方式2：{Binding Elementname=绑定的对象名称, Path=绑定的属性名称, Mode=}
Mode的可用值有：OneTime, OneWay, TwoWay
-->
< SlIDer x:name ="silder" Value ="50" Minimum ="1" Maximum ="100" LargeChange ="5" WIDth ="500" ></ SlIDer >
< TextBox Text =" {Binding Value, Mode=TwoWay, Elementname=silder} " />
< SlIDer Minimum ="1" Maximum ="100" LargeChange ="5" WIDth ="500"
Value =" {Binding Elementname=textBox, Path=Text, Mode=TwoWay } " ></ SlIDer >
< TextBox x:name ="textBox" Text ="50" />
</ StackPanel >
</ GrID >
</ navigation:Page >
2、relativeSource 扩展标记应用的 Demo
relativeSourceDemo.xaml
< navigation:Page x:Class ="Silverlight30.Binding.relativeSourceDemo"
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"
xmlns:navigation ="clr-namespace:System.windows.Controls;assembly=System.windows.Controls.Navigation"
d:DesignWIDth ="640" d:DesignHeight ="480"
Title ="relativeSourceDemo Page" >
< GrID x:name ="LayoutRoot" >
<!--
relativeSource - 一个扩展标记，用于指定关联数据源。这是 Silverlight 3.0 绑定的新增功能
relativeSource={relativeSource Self} - 指定数据源为自己本身
relativeSource={relativeSource TemplatedParent} - 在 ControlTemplate 出现，指定数据源为引用了该 ControlTemplate 的 Control
-->
< StackPanel >
< StackPanel.Resources >
< ControlTemplate x:Key ="mybutton" targettype ="button" >
< GrID >
<!-- 演示 {relativeSource TemplatedParent} 的 Demo -->
< border x:name ="Background" CornerRadius ="3" Background =" {Binding relativeSource={relativeSource TemplatedParent}, Path=Background} " borderThickness =" {TemplateBinding borderThickness} " borderBrush =" {TemplateBinding borderBrush} " >
< GrID Background =" {TemplateBinding Background} " margin ="1" >
< border Opacity ="0" x:name ="BackgroundAnimation" Background ="#FF448DCA" />
< Rectangle x:name ="BackgroundGradIEnt" >
< Rectangle.Fill >
< linearGradIEntBrush StartPoint =".7,0" EndPoint =".7,1" >
< GradIEntStop color ="#FFFFFFFF" Offset ="0" />
< GradIEntStop color ="#F9FFFFFF" Offset ="0.375" />
< GradIEntStop color ="#E5FFFFFF" Offset ="0.625" />
< GradIEntStop color ="#C6FFFFFF" Offset ="1" />
</ linearGradIEntBrush >
</ Rectangle.Fill >
</ Rectangle >
</ GrID >
</ border >
< ContentPresenter
x:name ="contentPresenter"
Content =" {TemplateBinding Content} "
ContentTemplate =" {TemplateBinding ContentTemplate} "
VerticalAlignment =" {TemplateBinding VerticalContentAlignment} "
HorizontalAlignment =" {TemplateBinding HorizontalContentAlignment} "
margin =" {TemplateBinding padding} " />
< Rectangle x:name ="DisabledVisualElement" RadiusX ="3" RadiusY ="3" Fill ="#FFFFFFFF" Opacity ="0" IsHitTestVisible ="false" />
< Rectangle x:name ="FocusVisualElement" RadiusX ="2" RadiusY ="2" margin ="1" stroke ="#FF6DBDD1" strokeThickness ="1" Opacity ="0" IsHitTestVisible ="false" />
</ GrID >
</ ControlTemplate >
</ StackPanel.Resources >
<!-- 演示 {relativeSource Self} 的 Demo -->
< TextBlock x:name ="lbl" Text =" {Binding relativeSource={relativeSource Self}, Path=name} " />
< button Content ="button" Template =" {StaticResource mybutton} " Background ="Red" />
</ StackPanel >
</ GrID >
</ navigation:Page >
3、Runtime 时修改样式的演示
buttonStyle1.xaml（样式 1）
< ResourceDictionary xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vsm ="clr-namespace:System.windows;assembly=System.windows"
>
<!--
自定义 button 样式 1
-->
< Style x:Key ="mybutton1" targettype ="button" >
< Setter Property ="Foreground" Value ="Red" />
< Setter Property ="padding" Value ="3" />
< Setter Property ="borderThickness" Value ="3" />
< Setter Property ="borderBrush" Value ="Green" />
</ Style >
</ ResourceDictionary >
buttonStyle2.xaml（样式 2）
< ResourceDictionary xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vsm ="clr-namespace:System.windows;assembly=System.windows"
>
<!--
自定义 button 样式 2
-->
< Style x:Key ="mybutton2" targettype ="button" >
< Setter Property ="Foreground" Value ="Blue" />
< Setter Property ="padding" Value ="3" />
< Setter Property ="borderThickness" Value ="3" />
< Setter Property ="borderBrush" Value ="Red" />
</ Style >
</ ResourceDictionary >
RuntimeChangeStyle.xaml
< navigation:Page x:Class ="Silverlight30.Style.RuntimeChangeStyle"
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"
xmlns:navigation ="clr-namespace:System.windows.Controls;assembly=System.windows.Controls.Navigation"
d:DesignWIDth ="640" d:DesignHeight ="480"
Title ="RuntimeChangeStyle Page" >
< GrID x:name ="LayoutRoot" >
<!--
runtime 时修改样式的 Demo
-->
< StackPanel OrIEntation ="Horizontal" >
< button x:name ="btn1" Content ="button 样式 1" Click ="btn1_Click" WIDth ="160" Height ="30" margin ="10" />
< button x:name ="btn2" Content ="button 样式 2" Click ="btn2_Click" WIDth ="160" Height ="30" margin ="10" />
</ StackPanel >
</ GrID >
</ navigation:Page >
RuntimeChangeStyle.xaml.cs
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 System.windows.Navigation;
using System.Xml.linq;
namespace Silverlight30.Style
{
public partial class RuntimeChangeStyle : Page
{
public RuntimeChangeStyle()
{
InitializeComponent();
}
private voID btn1_Click(object sender, RoutedEventArgs e)
{
// 动态设置样式。样式来自于 Style/buttonStyle1.xaml
System.windows.Style style = (System.windows.Style)Application.Current.Resources["mybutton1"];
btn1.Style = style;
btn2.Style = style;
}
private voID btn2_Click(object sender, RoutedEventArgs e)
{
// 动态设置样式。样式来自于 Style/buttonStyle2.xaml
System.windows.Style style = (System.windows.Style)Application.Current.Resources["mybutton2"];
btn1.Style = style;
btn2.Style = style;
}
}
}
4、样式的可继承性的演示
BasedOn.xaml
< navigation:Page x:Class ="Silverlight30.Style.BasedOn"
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"
xmlns:navigation ="clr-namespace:System.windows.Controls;assembly=System.windows.Controls.Navigation"
d:DesignWIDth ="640" d:DesignHeight ="480"
Title ="BasedOn Page" >
< GrID x:name ="LayoutRoot" >
<!--
样式的可继承性（BasedOn）的演示
-->
< GrID.Resources >
<!-- 基样式 -->
< Style x:Key ="basebutton" targettype ="button" >
< Setter Property ="Foreground" Value ="Red" />
< Setter Property ="padding" Value ="3" />
< Setter Property ="borderThickness" Value ="3" />
< Setter Property ="borderBrush" Value ="Green" />
</ Style >
<!-- 子样式 -->
<!-- BasedOn - 指定当前样式的父样式（此样式会继承指定的父样式） -->
< Style x:Key ="mybutton" targettype ="button" BasedOn =" {StaticResource basebutton} " >
< Setter Property ="borderBrush" Value ="Red" />
</ Style >
</ GrID.Resources >
< StackPanel >
< button x:name ="btn1" Content ="button 1" WIDth ="120" Height ="30" margin ="5"
Style =" {StaticResource basebutton} " />
< button x:name ="btn2" Content ="button 2" WIDth ="120" Height ="30" margin ="5"
Style =" {StaticResource mybutton} " />
</ StackPanel >
</ GrID >
</ navigation:Page >
5、自定义光标的实现
CaretBrush.xaml
< navigation:Page x:Class ="Silverlight30.Style.CaretBrush"
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"
xmlns:navigation ="clr-namespace:System.windows.Controls;assembly=System.windows.Controls.Navigation"
d:DesignWIDth ="640" d:DesignHeight ="480"
Title ="CaretBrush Page" >
< GrID x:name ="LayoutRoot" >
<!--
CaretBrush - 定义输入框的光标的样式
GradIEntBrush.MapPingMode - 指定渐变点的位置类型 [System.Window.Media.BrushMapPingMode 枚举]
relativeToBoundingBox - 百分比定位（0,0 - 1,1 之间）
absolute - 绝对定位
-->
< TextBox >
< TextBox.CaretBrush >
< linearGradIEntBrush MapPingMode ="relativeToBoundingBox" StartPoint ="0,0" EndPoint ="0,1" >
< linearGradIEntBrush.GradIEntStops >
< GradIEntStop color ="Red" Offset ="0.0" />
< GradIEntStop color ="Green" Offset ="1.0" />
</ linearGradIEntBrush.GradIEntStops >
</ linearGradIEntBrush >
</ TextBox.CaretBrush >
</ TextBox >
</ GrID >
</ navigation:Page >
OK
[源码下载] 总结
以上是内存溢出为你收集整理的稳扎稳打Silverlight(40) - 3.0绑定之Element to Element Binding, RelativeSource; 样式之动态修改样式, 样式继承, 自定义光标全部内容，希望文章能够帮你解决稳扎稳打Silverlight(40) - 3.0绑定之Element to Element Binding, RelativeSource; 样式之动态修改样式, 样式继承, 自定义光标所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）