Flex 放大镜效果实现代码

所属分类: 网页制作 / Flash 阅读数: 892
收藏 0 赞 0 分享
复制代码 代码如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
layout="vertical"
verticalScrollPolicy="off"
horizontalScrollPolicy="off"
backgroundColor="#FFFFFF"
backgroundGradientColors="#FFFFFF,#FFFFFF"
applicationComplete="onApplicationComplete();"
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
[Embed(source="assets/magnify.pbj", mimeType="application/octet-stream")]
private var shaderObj:Class;
private var shader:Shader;
private var shaderFilter:ShaderFilter;
/**
* Initialize the shader
*/
private function onApplicationComplete():void
{
// create the shader
shader = new Shader( new shaderObj() );
shader.data.center.value = [image.width/2, image.height/2];
setShader();
// setup event listeners
stage.addEventListener( Event.ENTER_FRAME, onEnterFrame, false, 0, true );
}
/**
* Each frame, only reapply the filter if necessary
*/
private function onEnterFrame( event:Event ):void
{
setShader();
}
/**
* Update all the shader&apos;s properties, create a new ShaderFilter,
* and reapply it to the image
*/
private function setShader():void
{
var centerX:Number = image.mouseX;
var centerY:Number = image.mouseY;
if( centerX < 0 || centerY < 0 || centerX > image.width || centerY > image.height )
{
var currentX:Number = shader.data.center.value[0];
var currentY:Number = shader.data.center.value[1]
centerX = currentX + ((image.width / 2)-currentX) / 2;
centerY = currentY + ((image.height / 2)-currentY) / 2;
}
shader.data.center.value = [centerX, centerY];
shader.data.innerRadius.value = [innerRadiusSlider.value];
shader.data.outerRadius.value = [outerRadiusSlider.value];
shader.data.magnification.value = [magnificationSlider.value];
shaderFilter = new ShaderFilter( shader );
image.filters = [shaderFilter];
}
]]>
</mx:Script>
<mx:Form>
<mx:FormItem label="Inner Radius">
<mx:HSlider
id="innerRadiusSlider"
minimum="0"
maximum="200"
value="50"
liveDragging="true" />
</mx:FormItem>
<mx:FormItem label="Outer Radius">
<mx:HSlider
id="outerRadiusSlider"
minimum="0"
maximum="200"
value="100"
liveDragging="true" />
</mx:FormItem>
<mx:FormItem label="Magnification">
<mx:HSlider
id="magnificationSlider"
minimum="1"
maximum="50"
value="4"
liveDragging="true" />
</mx:FormItem>
</mx:Form>
<mx:Image
id="image"
source="assets/YellowFlowers.jpg" />
</mx:Application>
更多精彩内容其他人还在看

AS3.0 实例学习 熟悉tween以及tweenEvent的运用

AS3.0 实例学习 熟悉tween以及tweenEvent的运用
收藏 0 赞 0 分享

AS3.0实例学习 熟悉xml的运用

AS3.0实例学习 熟悉xml的运用
收藏 0 赞 0 分享

AS3.0  实例学习 熟悉AS3的package,以及多个package之间的相互通信

AS3.0  实例学习 熟悉AS3的package,以及多个package之间的相互通信
收藏 0 赞 0 分享

AS3.0 通过类来实现一个gallery

AS3.0 通过类来实现一个gallery
收藏 0 赞 0 分享

AS3脚本编写的计时器效果代码

这篇文章通过实例代码给大家接受了AS3脚本编写的计时器效果,代码简单易懂,需要的朋友参考下吧
收藏 0 赞 0 分享

土人系列AS入门教程--基础篇

土人系列AS入门教程--基础篇
收藏 0 赞 0 分享

土人系列AS入门教程--语法篇

土人系列AS入门教程--语法篇
收藏 0 赞 0 分享

土人系列AS入门教程 -- 对象篇

土人系列AS入门教程 -- 对象篇
收藏 0 赞 0 分享

土人系列AS入门教程--实战篇

土人系列AS入门教程--实战篇
收藏 0 赞 0 分享

AS3笔记(13),sendAndLoad的继承者

AS3笔记(13),sendAndLoad的继承者
收藏 0 赞 0 分享
查看更多