博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
零元学Expression Blend 4 - Chapter 11 用实例了解布局容器系列-「Border」
阅读量:4488 次
发布时间:2019-06-08

本文共 1992 字,大约阅读时间需要 6 分钟。

原文:

将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的专情王子-「Border」。

?
?

本系列将教大家以实做案例认识Blend 4 的布局容器,此章介绍的布局容器是Blend 4 里的专情王子-「Border」。

?

?

就是要让不会的新手都看的懂!

?

<专情王子?查理B>

Border是Blend里最简单的布局容器,可以使用Border制作一个带有边框的布局容器。

Border最重要的特色是,Border内只允许容纳一种子物件

?

我们直接延续着的范例往下做。

?

01

运用上一章的范例,在主要工作区放入一个Border

?

接着,把范例所做的ScrollViewer拉进刚刚的Border里面

?

可以测试一下,Border是不是只能放入一个子物件。

会发现,Border只能放入一个子物件,但是子物件却不受这个限制;

让我们从原始码来看:

1: 
2:     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3:     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4:     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
5:     x:Class="SilverlightApplication16.MainPage"
6:     Width="640" Height="480">
7:?
8:     
9:         
10:             
11:                 
12:                     
13:                     
14:                     
15:                     
16:                     
17:                     
18:                     
19:                     
20:                     
21:                     
22:                 
23:             
24:         
25:     
26: 

?

在我们的范例里Border包含了一个ScrollViewer,不过StackPanel却包含了数个Button

?

这边我们可以从Properties设定Border的长相。

设定Border的边框粗细Properties->Appearance->BroderThickness

接着改变边框颜色Properties->Brushes->BorderBrush

?

看,我们的ScrollViewer有了新的边框

??

?

02

接下来要教大家如何做Border的变化运用,只需要一点小技巧

若是你不喜欢Border预设的四角方框框,记得把下面的设定技巧学起来喔!

?

开启一个新专案後,在主要工作区放入一个Border

接着设定Properties->Appearance->CornerRadius,打上「20」後看看Border的变化

Border的四个角变成圆角,如下图

?

若是要使其中几个角,变为原角的做法只需要做下面的设定:

CornerRadius打上「20 , 0 , 50 ,100」,会变为下图的样子

?

由上图得知,可以分别设定四个角的半径弧度,分别是以顺时针方向由左上到左下输入数值。

?

还可以配合BroderThickness加上BorderBrush的设定,做出阴影边框的效果

?

?

?

本篇的教学就到此。

?

?

?

?

(若有任何错误的地方,请各位前辈或同好能不吝指教,小女子都会虚心接受;若是你喜欢我的教学,请给我点鼓励,谢谢。)

?

一步一步迈向HIE之路

 

喜欢我文章请推我一下或给我个回应,你的鼓励会给我无限的动力喔!

若是您有其他问题或是特别需要,请在文章回应处留言,我会尽快回覆您

 

 

posted on
2017-12-24 00:33 阅读(
...) 评论(
...)

转载于:https://www.cnblogs.com/lonelyxmas/p/8095136.html

你可能感兴趣的文章
poj 3264
查看>>
图标跟着摄像机(Camera)orthographicSize的值改变大小
查看>>
LeetCode 386——字典序排数
查看>>
Learn day1 变量/数据类型
查看>>
go安装和开发工具安装
查看>>
【Scala】Scala技术栈
查看>>
PAT-A1033 or codeup 2031 To Fill or Not to Fill (贪心)题解
查看>>
实体字符转换,同样变量密码加盐MD5后生成的加密字符串不同解决办法 (原)
查看>>
《Windows核心编程》第十一章——线程池
查看>>
内存优化
查看>>
数据结构:单链表
查看>>
Go socket
查看>>
无法连接asp.net development server
查看>>
BETTER SUPPORT FOR FUNCTIONAL PROGRAMMING IN ANGULAR 2
查看>>
微信小程序tab栏切换
查看>>
windows pm2 开机启动
查看>>
Flask - 特殊装饰器 和 Flask工作结构模式(FBV, CBV)
查看>>
node.js环境搭建以及入门级hello程序
查看>>
LightOJ1282 - Leading and Trailing(快速幂+数学)
查看>>
【mysql】关于checkpoint机制
查看>>