进入Flash MX组件时代之六 改善组件用户体验
作者 佚名技术
来源 服务器技术
浏览
发布时间 2012-07-09
如此的想法：是否有一种途径能够让我们在对组件完成参数设置以后，该组件在场景中会立即产生反映而将组件的外观等内容马上显示为影片测试时的效果状态。万幸的是，该问题的答案是肯定的，组件的LivePreview为我们提供了此项功能。下面我们就带领大家对于这里提及的几个问题一同继续前往FlashMX组件的天堂，通过制作一款新的显式组件AxisGrid来分析显式组件与LivePreview的结合运用的功能。
AxisGrid组件的制作
相信大家对于AxisGrid这个词的概念还未曾了解，对于AxisGrid组件的功能更是莫提。为了不至于让大家产生莫名其妙的感觉我们将AxisGrid组件欲实现的目标作以简要描述：我们都清楚在FlashMX中绘制网格线是件十分麻烦的事情，AxisGrid组件就是为了解决该问题而编写制作的。我们只需将AxisGrid组件拖放至场景中，设置组件的相应参数，即可使组件在影片中显示相应行与列的网格表格。
如ToolTip与fbrowserWindow组件的制作过程一般，我们先在影片中创建一个MovieClip，并定义它的Component Definition，如下图94所示：
图94 AxisGrid的Component Definition
上一页??[1]?[2]?[3]?[4]?[5]?[6]?下一页??
在此我们为AxisGrid组件设置了类似于坐标轴颜色、网络线颜色、网格宽度、网格高度等变量，这些变量中包括了前面我们未曾用过的Color类型。 然后我们又为该组件的Linkage设置为AxisGrid。 显然上述几个步骤应该是组件编写的必要操作了，希望大家能够经过这里反复的阐述培养出自己良好的组件编写习惯。 接下来的操作是为了让我们在组件应用时能够有一个显式的界面外观，我们又创建了一个名为BoundingBox的MovieClip，它包括了一个大小为200×200象素的正方形色块，如下图95所示，它将为该组件起到网格边界判定的作用。 
图95 BoundingBox的内容
我们将该MovieClip拖放至AxisGrid中，并设置该MC场景中的实体名称也为BoundingBox。 然后在AxisGrid中再新建一层Class层，用以放置我们编写的代码内容（点击下载） 由于AxisGrid组件的代码编写部分的方式与fbrowserWindow基本无异，并且其中的代码内容亦无太复杂难懂之处，因而我们不作太多分析。需要注意的一点是，在redraw函数中我们通过with(this)来引用对象进行操作，而此对象就是组件其本身。介于组件的实物内容中包含了一个boundingBox的对象，因而该对象即成为了网格绘制的边界线的起终点了。 接下来我们将刚才制作的AxisGrid组件从Library中拖放至场景中，由于原先组件的大小也应为200×200，因而组件在场景中的位置应该与场景大小一致，如下图96所示。 
图96 AxisGrid的场景内容
然后我们新建一层ActionScript层，用以输入代码以便进行操作，其ActionScript层代码内容如下： //更新参数事件 function onUpdate() { AxisGrid.axisColor = xch.axisColor; AxisGrid.lineColor = xch.lineColor; AxisGrid.cellW = xch.cellW; AxisGrid.cellH = xch.cellH; AxisGrid.xMin = xch.xMin; AxisGrid.xMax = xch.xMax; AxisGrid.yMin = xch.yMin; AxisGrid.yMax = xch.yMax; AxisGrid.redraw(); } 在完成了该组件以后，我们想在场景中运用该组件，并且渴望达到在场景中更改参数即可更改组件显示样式的效果，那么我们即需要来继续下面这些有关LivePrevie制作与应用的操作步骤了。 AxisGrid组件LivePreview界面的制作 首先我们将AxisGrid.fla文件另存为AxisGrid_lp.fla，然后我们将场景大小设置为200×200象素大小。 特别注意：如UI界面制作中一样，在LivePreview中我们仍需要xch（exchange）来收集参数设置中传递过来的变量，以便通过传递过来的参数对组件进行应用与更新。而 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
上一篇: Flash AS教程之七 绘图及颜色的AS编写下一篇: Flash MX实战精选：大变活人
关于进入Flash MX组件时代之六 改善组件用户体验的所有评论
