Iris效果通过扩展或收缩集中在目标上的矩形遮罩为效果目标设置动画。该效果可以从目标的中心放大遮罩来显示目标,也可以向中心收缩遮罩来隐藏目标。演示:

源码如下:

  1. <?xml version="1.0"?>
  2. <!-- Simple example to demonstrate the Iris effect. -->
  3. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" height="352"
  4. width="450">
  5. <mx:Iris id="irisOut" duration="1000" showTarget="true"/>
  6. <mx:Iris id="irisIn" duration="1000" showTarget="false"/>
  7. <mx:Panel title="Iris Effect Example" width="351" height="304"
  8. horizontalAlign="center" layout="absolute">
  9. <mx:Text width="100%" color="blue" fontSize="12"
  10. text="使用Iris效果显示和隐藏图片."/>
  11. <mx:Image id="img" source="@Embed(source='meinv.jpg')"
  12. visible="true"
  13. showEffect="{irisIn}" hideEffect="{irisOut}" x="25.5" y="28"/>
  14. <mx:Button x="97" y="236" label="显示" fontSize="12"
  15. click="img.visible=true"/>
  16. <mx:Button x="170" y="236" label="隐藏" fontSize="12"
  17. click="img.visible=false"/>
  18. </mx:Panel>
  19. </mx:Application>

简要说明:showTarget="true"表示组件缓缓出现,false则为消失。第14行showEffect事件表示显示时的效果,hideEffect事件表示隐藏时的效果。duration属性表示效果的时间间隔

Flex Iris效果放大或缩小组件演示的更多相关文章

  1. jquery图片查看插件,支持旋转、放大、缩小、拖拽、缩略图(仿qq图片查看)

    最近做了一个jquery图片查看的插件,目的是能精确查看图片的详情,插件支持图片旋转.放大.缩小.拖拽.缩略图显示,界面效果是按照window的qq查看图片功能写的,当然不尽相同. 具体功能: 1. ...

  2. Flex 动画效果

    1.使用自带效果 在Flex里面不像在Flash里面随意制作动画了,Flex更趋向于应用程序,而不是动画制作了,所以没有了时间轴的概念.在Flex中使用动画效果,可以用Flex自带的Effect,或者 ...

  3. 在线图片上传、预览、裁切、放大、缩小之 cropbox.js 的应用

    cropbox.js 是一个实现了图像在线剪裁的 jQuery .YUI 插件和 JavaScript 库. 上DEMO: 上传的图片可以使用滚轮放大与缩小当前选择的图片,后点击“裁切”后,在右侧的预 ...

  4. vue 实现 裁切图片 同时有放大、缩小、旋转功能

    实现效果: 裁切指定区域内的图片 旋转图片 放大图片 输出bolb 格式数据 提供给 formData 对象 效果图 大概原理: 利用h5 FileReader 对象, 获取 <input ty ...

  5. js实现Mac触摸板双指事件(上、下、左、右、放大、缩小)

    前言 这几天在修复一个web问题时,需要捕获Mac触摸板双指事件(上.下.左.右.放大.缩小),但发现并没有现成的轮子,还是要自己造. 例如:jquery.mousewheel.js(添加跨浏览器的鼠 ...

  6. Flex动画效果的用法--Resize

    Flex动画效果的用法--Resize FlexAdobeXML  <?xml version="1.0" encoding="utf-8"?> & ...

  7. Android------实现图片双击放大,缩小,左右滑动的多种方式

    项目中常常有图片浏览功能.像微信朋友圈图片浏览,QQ空间照片浏览 的功能. 实现图片双击放大,缩小,左右滑动等效果. 来看看我的效果图,希望能满足你的要求   前三个button按钮是参考网上的多种实 ...

  8. 实例讲解如何利用jQuery设置图片居中放大或者缩小

    大家有没有见过其他网站的图片只要鼠标放上去就能放大,移出去的时候就能缩小,而且一直保持居中显示!其实jQuery提供一个animate函数可以使图片放大和缩小,只要改变图片的长和高就OK啦!但是ani ...

  9. 在cocos2d中实现真正意思上的图片放大和缩小

    http://www.cnblogs.com/dinghing154/archive/2012/08/05/2623970.html 在编写程序的时候我们常常使用self.scale来让我们使用的图片 ...

随机推荐

  1. EXSI6.5复制文件太慢的解决方法

    听说裸金属服务器性能比在windows中安装VMware workstations要好,就在电脑上安装了一个EXSI6.5. 可是在复制文件时很慢,一个3G的文件复制了两三个小时,还时常担心网络会断, ...

  2. [蓝桥杯]ALGO-122.算法训练_未名湖边的烦恼

    问题描述 每年冬天,北大未名湖上都是滑冰的好地方.北大体育组准备了许多冰鞋,可是人太多了,每天下午收工后,常常一双冰鞋都不剩. 每天早上,租鞋窗口都会排起长龙,假设有还鞋的m个,有需要租鞋的n个.现在 ...

  3. PyQt—QTableWidget中的checkBox状态判断

    一.QTableWidget实现checkBox效果 利用QTableWidgetItem对象的CheckState属性,既能显示QCheckBox,又能读取状态 table = QtGui.QTab ...

  4. python3实现mysql导出excel

    Mysql中'employee'表内容如下: # __Desc__ = 从数据库中导出数据到excel数据表中 import xlwt import pymysql class MYSQL: def ...

  5. Maven编译错误记录:Some Enforcer rules have failed

    一.错误信息 添加httpclient与httpcore依赖后编译Maven报错. 错误信息如下: Failed to execute goal org.apache.maven.plugins:ma ...

  6. PAT 乙级 1020 月饼 (25) C++版

    1020. 月饼 (25) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 月饼是中国人在中秋佳节时吃的一种传统食 ...

  7. 第一次有人把小米9快充讲的这么简单明了qc3.0 usb pd

    原文: http://www.chongdiantou.com/wp/archives/32093.html 2019年2月20日,小米在北京工业大学体育馆举办了盛况空前的小米9手机发布会,会上雷军揭 ...

  8. 搞定queryString

    querystring字面上的意思就是查询字符串,一般是对http请求所带的数据进行解析.querystring模块只提供4个方法: querystring.parse querystring.str ...

  9. 软硬链接ln

    1:软链接 -- 快捷方式 I:ln -s 文件名 快捷方式的名字 文件名:使用绝对路径 II':目录也可以创建链接 2:硬链接 I: ln 文件名 硬链接的名字

  10. CSS部分

    float属性 父级坍塌现象 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...