原文:零元学Expression Blend 4 - Chapter 35 讨厌!!我不想一直重复设定!!『Template Binding』使用前後的差异

因为先前写到自制Button时需特别注意Template Binding步骤的部分,有不少网友常常问我差异到底在哪?



所以在这边就特别为了Template Binding做单独的介绍

?

因为先前写到自制Button时需特别注意Template Binding步骤的部分,有不少网友常常问我差异到底在哪?

所以在这边就特别为了Template Binding做单独的介绍

?

(回顾自制玻璃质感Button请看这里)

?

就是要让新手都看得懂!

?

?

01

首先我把Gird切割为二等分

分别放入一个爱心

(Gird的详细介绍请看这里,爱心制作请看这里)

?

接着把爱心转换为Button

爱心上单击右键->Make Into Control->Button

?

进入Button Template後,请把本范例不需要的ContentPresenter删除

?

由於本章介绍的是Template Binding的差异,我就不针对设定Button做详细的说明了

如果你想知道更多自订状态,可以参考我其他篇的介绍:

(1) 零元学Expression Blend 4 - Chapter 15 用实例了解互动控制项「Button」I

(2) 零元学Expression Blend 4 - Chapter 16 用实例了解互动控制项「Button」II

(3) 零元学Expression Blend 4 - Chapter 28 ListBox的基本运用与更改预设样式

(4) 零元学Expression Blend 4 - Chapter 32 简单轻松的学会如何使用Visual States(上)

(5) 零元学Expression Blend 4 - Chapter 33 简单轻松的学会如何使用Visual States(下)

?

02

进入样板编辑模式後,请在Properties->Brush->Fill後面的小白点(Advanced options)->点选Template Binding->Background

?

Bindind以後,我们离开样板编辑模式(Edit Button Template)

再用一样的方法把右边的爱心转为Button,但右边的爱心不需要设定Template Binding,因为我们要看出Template Binding与否的差异

?

以上步骤都完成了以後,表面上看似正常的两个爱心,底层已经不一样了喔!

看下去就知道:

一般模式下,已Template Binding的左边爱心,当选取什麽颜色,爱心就是什麽颜色

就像下图,左边的爱心,选取粉红色,爱心就是粉红色

?

一般模式下,未Template Binding的右边爱心,当选取蓝色,爱心却不会变成蓝色

?

到底是怎麽一回事呢?

这边我们把两个爱心都改为蓝色再进入样板编辑模式看看

?

左边爱心:

可以看到已Template Binding的爱心,有绑定的状态检色器会出现一个黄色外框

而且於一般模式已经改为蓝色的爱心,在样板编辑模式时也同样是蓝色

但你可以发现,被黄色外框框住的检色器已经无法选择颜色了

?

右边爱心:

可以调整看看颜色,刚刚在一般模式无法更改颜色,但进到样板编辑模式就可以更改了!

?

统整一下刚刚我们遇到的状况:

?

???????????????? 左边爱心?????????????? V.S?????????????? 右边爱心

已Template Binding

未Template Binding

一般模式编辑色彩有效

一般模式编辑色彩无效

样版模式无法编辑颜色

样版模式可以编辑颜色

一般模式编辑色彩

与样版模式色彩同步

一般模式编辑色彩

与样版模式色彩不同步

?

其实我们在Edit Template的时候,做的是底层的东西

所以如果没有把底层与外层Binding起来,会造成一般编辑与样板编辑(Edit Template)的不同

?

03

以我们把Backgruond Fill Template Binding为例:

Binding前後的差异在----

Binding前:即使调整了外层(未进入样板编辑)的Backgruond Fill颜色,对於样板编辑模式里的Backgruond Fill 不会造成影响。

Binding後:调整了外层的Backgruond Fill颜色,样板编辑模式里的Backgruond Fill 颜色会跟着变动。

?

这动作最主要实现在於Blend的基本精神

如果我复制了Button,就可以在一般编辑贴出多个Button後,直接更改我喜欢的颜色

不需要一直去动到样板,能够直接从一般模式下调整你想要的颜色

因为,每做一个颜色就要去调一次样板是很累人的.....

?

但是如果你想要一口气直接把所有颜色都调整为同一种颜色

你可以选择不使用TemplateBinding

试着复制多个未TemplateBinding的右边爱心,然後进入到样版里面更改颜色

应该可以发现,不管复制了几个爱心,都可以在同一时间改变颜色,就算是大小或外观改变了

?

用最简单的话说

我们只是利用TemplateBinding把样版里面的属性开放出来,和实际的元件的某个属性绑在一起

所以在实际元件的那个属性上做设定,就会被样版里与属性有Binding的属性一起吃进去

?

而且TemplateBinding一次不只可以绑一个属性 ,样版里面的多个属性可以绑到实际元件的同一个属性

试着玩玩看吧!

?

?

若能注意到很小的设定,会对你Silverlight的制作加分喔!

?

本篇的教学就到此。

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

?

?

一步一步迈向HIE之路

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

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

 

零元学Expression Blend 4 - Chapter 35 讨厌!!我不想一直重复设定!!『Template Binding』使用前後的差异的更多相关文章

  1. 零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步

    原文:零元学Expression Blend 4 - Chapter 46 三分钟快速充电-设定Margin的小撇步 如果需要经常的使用某一项工具,总会希望能够更快速的使用各项设定达到效果 今天要介绍 ...

  2. 零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果

    原文:零元学Expression Blend 4 - Chapter 47 超简单!运用StackPanel配合OpacityMask做出倒影效果 有网友问我如何在Blend内制作出倒影效果 我提供了 ...

  3. 零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下)

    原文:零元学Expression Blend 4 - Chapter 44 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(下) 抱歉久等了!!!! 终於到了动画MenuBar ...

  4. 零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗?

    原文:零元学Expression Blend 4 - Chapter 45 ListBox里的物件不能换行吗? ListBox里的排列不是垂直就是水平,觉得这样的排列很枯燥乏味吗? 想要它变聪明吗? ...

  5. 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画

    原文:零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形动画 零元学Expression Blend 4 - Chapter 42 五分钟快速完成扇形变圆形 ...

  6. 零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中)

    原文:零元学Expression Blend 4 - Chapter 41 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(中) 我们接着进行动画MenuBar的制作 接续着上 ...

  7. 零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上)

    原文:零元学Expression Blend 4 - Chapter 40 Flash做的到的Blend也可以!轻松制作拥有动画的MenuBar!(上) 一直以来都有人拿Flash的动画问我Blend ...

  8. 零元学Expression Blend 4 - Chapter 39 虾米?!同款?不同师傅!告诉你Visible、Hidden与Collapsed的差异!

    原文:零元学Expression Blend 4 - Chapter 39 虾米?!同款?不同师傅!告诉你Visible.Hidden与Collapsed的差异! 由此可知 Hidden为隐藏项目,但 ...

  9. 零元学Expression Blend 4 - Chapter 38 看如何使用Clip修出想要的完美曲线(下)

    原文:零元学Expression Blend 4 - Chapter 38 看如何使用Clip修出想要的完美曲线(下) 你可以把Clip想成是一个遮罩,运用遮罩达到我们想要的效果 所以在这里我们把文字 ...

随机推荐

  1. Android View框架的measure机制

    概述 Android中View框架的工作机制中,主要有三个过程: 1.View树的測量(measure)Android View框架的measure机制 2.View树的布局(layout) Andr ...

  2. 【u240】棋子放置

    Time Limit: 1 second Memory Limit: 128 MB 小虎刚刚上了幼儿园,老师让他做一个家庭作业:首先画3行格子,第一行有三个格子,第二行有2个格子,第三行有1个格子. ...

  3. Java爬虫框架WebMagic入门——爬取列表类网站文章

    初学爬虫,WebMagic作为一个Java开发的爬虫框架很容易上手,下面就通过一个简单的小例子来看一下. WebMagic框架简介 WebMagic框架包含四个组件,PageProcessor.Sch ...

  4. reduce 阶段遍历对象添加到ArrayList中的问题

    起初遍历values时直接把对象添加到集合中,后来输出结果和预期不符,debug时发现添加到集合中的对象的值全部是最后一个对象的值,网上百度了下,发现是reduce阶段对象重用的问题,reduce阶段 ...

  5. Light libraries是一组通用的C基础库,目标是为减少重复造轮子而写(全部用POSIX C实现)

    Light libraries是一组通用的C基础库,目标是为减少重复造轮子而写实现了日志.原子操作.哈希字典.红黑树.动态库加载.线程.锁操作.配置文件.os适配层.事件驱动.工作队列.RPC.IPC ...

  6. Springmvc案例1----基于spring2.5的採用xml配置

    首先是项目和所须要的包截图: 改动xml文件: <?xml version="1.0" encoding="UTF-8"?> <web-app ...

  7. C#--动态操作DataTable

    C#动态操作DataTable(新增行.列.查询行.列等) 方法一:动态创建一个DataTable ,并为其添加数据 public void CreateTable()        {        ...

  8. Java 中override、overload、overwrite区别,以及与多态的关系【转】

    因为早期的翻译导致了override和overwrite的解释及理解混乱,需要重新梳理这几个词及相关内容. 转自:http://blog.csdn.net/lzhang007/article/deta ...

  9. WPF 将Bitmapsource转换到Emgu.cv.image

    原文:WPF 将Bitmapsource转换到Emgu.cv.image Transform WPF BitmapSource to Emgu.CV.Image******* /// <summ ...

  10. 解决ASP.NET中Redis 每小时6000次访问请求的问题

    原文:解决ASP.NET中Redis 每小时6000次访问请求的问题 虽然ServiceStack v4是商业支持的产品,但我们也允许免费使用小型项目和评估目的.上面的NuGet包中包含可以使用许可证 ...