`
lovnet
  • 浏览: 6714076 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
文章分类
社区版块
存档分类
最新评论

Silverlight 的 Border 控件

阅读更多

Border 控件用于在另一元素周围绘制边框或背景。

先看一个简单的例子

Xaml 文件

UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="SilverlightApplication2.MainPage"
	Width="300" Height="150">
  	Border Background="Coral" Width="250" Margin="12" 
	Padding="10" CornerRadius="30,38,150,26"
	BorderThickness="8 15 10 2" BorderBrush="Aqua">
    	TextBlock FontSize="12">Text Surrounded by a BorderTextBlock>
	Border>
UserControl>

演示效果图:

image

其中属性说明:

Border.Padding 属性 获取或设置边框与其子对象之间的距离。

FrameworkElement.Margin 属性 获取或设置 FrameworkElement 的外边距。

Border.CornerRadius 属性 获取或设置边框的角的半径。 上面例子中是按照 topLeft,topRight,bottomRight,bottomLeft 的顺序来设置的。

Border.BorderThickness 属性 获取或设置边框的粗细。默认情况下,四个边的粗细都为 0。 上面例子中是按照 left,top,right,bottom 顺序来设置的:

在如上所示的 XAML 语法中,可以使用空格而不是逗号作为值之间的分隔符。 
Border.BorderBrush 属性 获取或设置用于创建边框的 Brush。
需要注意的是: 

Border 只能包含一个子对象。如果要在多个对象周围放置一个边框,应将这些对象包装到一个容器对象中,例如 StackPanel。

下面的示例就演示了一个如何在 StackPanel 中包含的多个 TextBlock 对象,并在周围放置一个边框。

Border BorderThickness="5" BorderBrush="Blue" >
    StackPanel Grid.Column="0" Grid.Row="0">
        TextBlock Text="One"/>
        TextBlock Text="Two"/>
        TextBlock Text="Three"/>
    StackPanel>
Border>

我们如果修改其他控件的 ControlTemplate 时,我们就会看到, Border 控件在很多地方都用到了,用于模拟选中的3D效果。这个逻辑的实现很简单,通过修改 Opacity 来实现,下面就是一个简化版的演示,当用户点击文本时,出现一个文本的边框。

Xaml 代码

UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="SilverlightApplication2.MainPage"
	Width="300" Height="150">
 Grid x:Name="LayoutRoot" >
    Border x:Name="TextBorder" BorderThickness="10" >
    	Border.BorderBrush>
        	SolidColorBrush Color="Red" Opacity="0" />
        Border.BorderBrush>
        TextBlock MouseLeftButtonDown="TextBlock_MouseLeftButtonDown" Text="Hello" />
    Border>  
Grid>
UserControl>

C# 代码

private void TextBlock_MouseLeftButtonDown(object sender,
	System.Windows.Input.MouseButtonEventArgs e)
{
	TextBorder.BorderBrush.Opacity = 1;
}

参考资料:

Using the Border control in Silverlight 2
http://www.silverlightshow.net/items/Using-the-Border-control-in-Silverlight-2-Beta-1-.aspx

Border 类
http://msdn.microsoft.com/zh-cn/library/system.windows.controls.border(VS.95).aspx

稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox
http://www.cnblogs.com/webabcd/archive/2008/10/09/1307493.html

Show/Hide a Border and other Border fun
http://blogs.msdn.com/silverlight_sdk/archive/2008/07/30/show-hide-a-border-and-other-border-fun.aspx

Silverlight里的Rectangle与border有啥区别呀?
http://social.microsoft.com/Forums/zh-CN/silverlightzhchs/thread/86581cff-f660-414f-94dc-f4e77a02090a

Silverlight Border Control
http://www.c-sharpcorner.com/UploadFile/raj1979/SilverlightBorder10162008030241AM/SilverlightBorder.aspx

border控件中的一些疑问
http://bbs.blueidea.com/viewthread.php?tid=2957515

分享到:
评论

相关推荐

    Silverlight 控件使用实例

    Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox 介绍 Silverlight 2.0 控件一览:Border, Button, Calendar, Canvas, CheckBox, ComboBox 2、Silverlight(4) - 2.0控件之...

    Silverlight基本控件介绍.doc

    二、<Border> 控件 2 三、<WatermarkedTextBox> 控件 <显示其他控件时> 3 四、ToggleButton控件 3 五、ScrollViewer控件 4 六、TextBlock控件 5 七、ToolTip控件 <用作内嵌控件时> 6 八、Rectangle控件 7 九、Slider...

    wp7 控件练习

    SilverlightToolkitControls 是SilverlightToolkit中的控件练习 1. 项目WPControls中包含如下控件使用: 面板类控件 Grid Canvas StaticPanal Border Web控件 WebBrowaer 资源字典 ResourceDictionary ...

    Silverlight Loader

    可以看出,在建立整个项目的过程中,SLLoader.xap和LoadTarget.xap并不需要打交道,只在HHTML或asp:Silverlight控件设置中才把二者联系起来。 1.HTML中的设置方法: <object data="data:application/x-silverlight-...

    Silverlight2.0功能展示Demo源码

    1、Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox 介绍 Silverlight 2.0 控件一览:Border, Button, Calendar, Canvas, CheckBox, ComboBox 2、Silverlight(4) - 2.0控件之...

    一款非常好的WPF编程宝典2010 源代码

    5.3.1 Border控件 112 5.3.2 Viewbox控件 113 5.4 结束语 115 第6章 依赖项属性和路由事件 116 6.1 理解依赖项属性 116 6.1.1 定义和注册依赖项属性 117 6.1.2 WPF使用依赖项属性的方式 124 6.2 理解路由事件...

    Apress.Pro.WPF.in.C.Sharp.2008.2nd.Edition.Feb.2008

    5.3.1 Border控件 112 5.3.2 Viewbox控件 113 5.4 结束语 115 第6章 依赖项属性和路由事件 116 6.1 理解依赖项属性 116 6.1.1 定义和注册依赖项属性 117 6.1.2 WPF使用依赖项属性的方式 124 6.2 理解路由事件 126 ...

    wpf编程宝典c#2010版pdf(全)1/3包,共118M

     3.2.5 Border控件  3.3 wrapPanel面板和DockPanel面板  3.3.1 wrapPanel面板  3.3.2 DockPanel面板  ……  第4章 依赖项属性  第5章 路由事件  第6章 控件  第7章 application类  第8章 元素绑定  第9章...

    wpf编程宝典c#2010版pdf(全)2/3包,共118M

     3.2.5 Border控件  3.3 wrapPanel面板和DockPanel面板  3.3.1 wrapPanel面板  3.3.2 DockPanel面板  ……  第4章 依赖项属性  第5章 路由事件  第6章 控件  第7章 application类  第8章 元素绑定  第9章...

Global site tag (gtag.js) - Google Analytics