先上代码: 1){ maskcan.graphics.beginFill(0xff0000); showline.graphics.moveTo(points[0].x,points[0].y); maskcan.graphics.moveTo(points[0].x,points[0].y); var b:Boolean = true; for(var i:uint=1;i598||_h>445){ scale = Math.max(_w/598,_h/445); } //var p:Point = new Point(rect.topLeft.x/2,rect.topLeft.y/2); //识别有色区域 var bmd:BitmapData = ImageSnapshot.captureBitmapData(content,new Matrix(scale,0,0,scale),null,null,null,true); var rect:Rectangle = bmd.getColorBoundsRect(0xff000000,0x00000000,false ); var bmd2:BitmapData = new BitmapData(rect.width,rect.height,true,0xff000000) ; bmd2.copyPixels(bmd,rect,new Point(0,0)); } ]]--> >>完成" y="483" toolTip="保存当前剪裁区域到设计器并退出" click="{ok()}" styleName="primaryButton" color="0x000000" width="78" x="547"/> 功能如下:
能按任意多边形剪裁一个图片,多边形的点由用户添加和控制,最终切割出来的图应该是有色区域部分最小的图,透明的多余边缘可过滤。
还有几个细节:切割过程中切割区域外要50%透明显示,内部是100%可见的,和ps的切割效果类似,只不过切点可以自由增加;用户切割操作时候应该是小屏幕,而切割后是按原图比例的。比如一个2000×2000的图片,切割屏幕只有100×100的话,要能适应。
代码说明:
其中切割拖动过程主区域和其它区域的区别都是用mask实现的,
整个的切割流程:
底图使用mask,mask本身是一个canvas,里面用graphics控制,拖动切点后重新渲染一把。
渲染路径算法: 按次序简单的绘制2点间路程,这个算法目前简单,每增加一个切点默认加在首尾间。
最终切割过滤有色边缘算法如下,主要是通过bitmapdata的getColorBoundsRect完成:
//识别有色区域
var bmd:BitmapData = ImageSnapshot.captureBitmapData(content,new Matrix(scale,0,0,scale),null,null,null,true);
var rect:Rectangle = bmd.getColorBoundsRect(0xff000000,0x00000000,false );
var bmd2:BitmapData = new BitmapData(rect.width,rect.height,true,0xff000000) ;
bmd2.copyPixels(bmd,rect,new Point(0,0));
附件demo:
.........奥晕,不能传swf,可自行拷贝代码运行,上面代码中是完整的。
只能看我实际应用的效果了:点击预览效果
设计器上面上传图片然后选择-切割功能(点击图片后,在图片下面的工具栏上)
发表评论
-
判断是否是正确日期字符串的函数
2012-07-06 09:52 1138个人写的一个判断是否是正确日期字符串的函数, 请大家点评 ... -
PyQt4--QLineEdit内引入正则表达式
2012-07-06 09:46 1512from PyQt4.QtCore import * ... -
杂记之通过style样式xml定义规范组件属性
2012-07-03 13:44 978效果图 main.xml 组件进行关联 --& ... -
Flex 不支持GIF的解决方法
2012-07-02 13:12 893GIF图片,加载到Image后,不能动起来,需要把 gif ... -
使用Flex和Actionscript开发Flash游戏――碰撞检测
2012-07-02 13:12 578这一部分,我们加 ... -
完美解决Panel设置了borderSkin后内容体与标题栏重叠的问题
2012-07-02 13:12 786如果您做过Flex皮肤 ... -
flex 界面改进
2012-07-02 13:12 573f 代码如下: ... -
flex 实现的多点切割+mask蒙版+自动识别非透明区域+自适应图片大小
2012-07-01 10:44 1208先上代码: Arr ... -
Flex DataGrid单元格背景色 单元格字体颜色控制
2012-07-01 10:43 1094前阵子在做Flex网页时,关于单元格字体颜色这方面纠结了好 ... -
flex 读取配置文件 与PHP交互 圆饼图
2012-07-01 10:43 629FLEX文件 teacherevalute.mxml ... -
flex 界面改进
2012-07-01 10:43 650f 代码如下: Arr ... -
flex招式八:flex共享对象ShareObject
2012-07-01 10:43 774flex的共享对象ShareO ... -
Flex是咋回事之三 谁用谁知道
2012-06-30 17:07 614Flex是咋回事之三 谁用谁知道 2010年09月21日 ... -
java与flex通信
2012-06-30 17:07 599java与flex通信 2010年10月22日 一、准备 ... -
如何使用Maven 3.0, Flex Mojos 4.0和Flex 4.5构建一个简单的SWF程序
2012-06-30 17:07 1281如何使用Maven 3.0, Flex Mojos 4.0和F ... -
学习flex 初步实现与java进行数据交互
2012-06-30 17:07 636学习flex 初步实现与java进行数据交互 2010年06 ... -
Flex数据绑定陷阱(二)
2012-06-30 17:07 653Flex数据绑定陷阱(二) 2010年08月10日 尝试 ...
相关推荐
java实现图片上传并添加水印效果(文字水印,蒙版,logo图片),自动进行文字大小行数位置匹配,文字自动换行
moviepy音视频剪辑:使用mask遮罩实现视频叠加透明效果.rar
js 动态获取图片上的矩形热区,可随意选择区域。鼠标经过该区域时,会出现一半透明蒙版,显示该区域的位置大小。点击可超链接。创建的热区可修改链接,也可以动态删除热区
Android蒙版+Bannar广告自动无限轮播的Demo实现
moviepy音视频剪辑:使用mask遮罩剪辑实现叠加透明效果详解.rar
兼容谷歌、火狐、IE7.0以上版本的所有浏览器的透明边框弹窗,带半透明蒙版,参考购物网站实例制作
很简单的一个教程,可以学一下哦,简单处理一下数码相机拍出来人像美眉图片!
Topaz Mask AI(图片蒙版工具)是一款非常好用的图片蒙版工具,相较于PS,Topaz Mask AI不需要繁琐的笔刷就能获得高质量的蒙版,只需要用工具勾勒出图片的轮廓就能快速实现图片蒙版效果,软件适用于非常多的场景,非常...
Topaz Mask AI(图片蒙版工具)是一款非常好用的图片蒙版工具,相较于PS,Topaz Mask AI不需要繁琐的笔刷就能获得高质量的蒙版,只需要用工具勾勒出图片的轮廓就能快速实现图片蒙版效果,软件适用于非常多的场景,非常...
VB.net源码,通过HLSL shader对图像进行灰度变成不透明度的处理。通过自定义控件利用MediaPlayer播放透明通道视频。利用ShaderEffect实时处理的视频帧作为OpacityMask蒙版。
Unity5的unitypackage 利用UI Mask 实现对Sprite精灵遮罩处理。不是插件
Android指引蒙版的实现。
js鼠标滑过图片,在图片上方蒙上一层透明层显示详情内容
jquery实现蒙版效果,可以用在微信诱导点击等等
html,css.css3.js,利用mask蒙版实现展示图片的动画
使用单窗体实现透明窗体或蒙板效果,可用于窗体美化或其他特殊用途,具体操作简单,使用方便,效果突出,可自定义扩展。
地图导航类APP半透明黑色蒙版的透明度阈限研究.pdf
在以下图片中,显示了此过滤器的结果,并且半径大小设置为14。 原始图片 结果图片 锐化蒙版滤镜 结果图片 FILTER PARAMETER: radius = 5 unsharp mask value = 4 坎尼边缘检测器 结果图片 FILTER PARAMETER: low ...
安卓Android实现蒙版引导功能,自定义实现透明蒙版 需求:博主前段时间做的教育类型APP,需要引导用户(低龄化小朋友),播放器的播放,页面可以左右滑动,以及右上方进入答题卡入口
掌握通道的基本操作 掌握快速蒙版、图层蒙版、矢量蒙版和剪贴蒙版的使用方法