AS3给图片加水印文字

<需要flash player 10+支持>

通过FileReference获取选中的图片,调用它的load方法,将图片存入到内存中。使用Loader(flash.display.Loader)类的loadBytes方法,加载图片。

在点击“加水印”的按钮时,建立两个BitmapData,然后里面分别存放图片和需要添加的文字,之后将两个BitmapData转换为Bitmap添加至舞台,再转成一张新的Bitmap。

保存图片功能则较为简单了,直接使用FileReference的save方法

实现的并不完善,缺少例如:选择字体大小、颜色、间距等功能,未提供平铺或是移动文字位置的功能…

示例代码如下<仅供参考>:

1: <?xml version="1.0" encoding="utf-8"?>

       2: <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 

       3:                 layout="absolute" 

       4:                 minWidth="400" minHeight="600" 

       5:                 creationComplete="inited()" 

       6:                 backgroundColor="#ffffff">

       7:     

       8:     <mx:Style source="theme/vistaremix/vistaremix.css" />

       9:     

      10:     <mx:Script>

      11:         <![CDATA[

      12:             import mx.controls.Alert;

      13:             import mx.core.UIComponent;

      14:             import mx.events.PropertyChangeEvent;

      15:             import mx.graphics.codec.PNGEncoder;

      16:             

      17:             private var file:FileReference;

      18:             private var loader:Loader;

      19:             

      20:             private function inited():void

      21:             {

      22:                 loader = new Loader();

      23:                 loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderDataCompleteHandler);

      24:                 loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loaderProgressHandler);

      25:                 

      26:                 var ui:UIComponent = new UIComponent;

      27:                 

      28:                 addChild(ui);

      29:                 

      30:                 ui.addChild(loader);

      31:                 

      32:                 loader.visible = false;

      33:             }

      34:             

      35:             private function selectPictureHandler():void

      36:             {

      37:                 file = new FileReference();

      38:                 file.addEventListener(Event.SELECT, fileSelectHandler);

      39:                 file.browse(getFileFilterArr());

      40:             }

      41:             

      42:             private function getFileFilterArr():Array

      43:             {

      44:                 return [new FileFilter("Images(*.jpg;*.jpeg;*.png;*.gif)", "*.jpg;*.jpeg;*.png;*.gif")];

      45:             }

      46:             

      47:             private function fileSelectHandler(evt:Event):void

      48:             {

      49:                 file.removeEventListener(Event.SELECT, fileSelectHandler);

      50:                 file.addEventListener(Event.COMPLETE, fileLoadCompleteHandler);

      51:                 file.load();

      52:                 

      53:                 filePathTxt.text = file.name;

      54:             }

      55:             

      56:             private function fileLoadCompleteHandler(evt:Event):void

      57:             {

      58:                 file.removeEventListener(Event.COMPLETE, fileLoadCompleteHandler);

      59:                 loader.loadBytes(file.data);

      60:             }

      61:             

      62:             private function madePictureHandler():void

      63:             {

      64:                 if (loader.content == null)

      65:                 {

      66:                     Alert.show("请先选择要处理的图片","提示");

      67:                     

      68:                     return; 

      69:                 }

      70:                 

      71:                 var ui:UIComponent = new UIComponent();

      72:                 

      73:                 var txt:TextField=new TextField(); 

      74:                 var imgBitmapData:BitmapData = (loader.content as Bitmap).bitmapData.clone();

      75:                 

      76:                 var format:TextFormat = new TextFormat();

      77:                 format.size = 22; 

      78:                 format.bold = true;

      79:                 format.color=0xcc9900;

      80:                 format.align = TextFormatAlign.CENTER;

      81:                 txt.defaultTextFormat = format; 

      82:                 txt.htmlText = contentTxt.text || "形象装"; 

      83:                 txt.width = 170;

      84:                 txt.height = 50;

      85:                 

      86: //                txt.filters = [getTextGlowFilter()];

      87:                 

      88:                 var tempBitMapData:BitmapData = new BitmapData(txt.width, txt.height, true, 0x00000000); 

      89:                 tempBitMapData.draw(txt); 

      90:                 

      91:                 var txtShap:Shape = new Shape(); 

      92:                 txtShap.graphics.beginBitmapFill(tempBitMapData); 

      93:                 txtShap.graphics.drawRect(0,0, tempBitMapData.width, tempBitMapData.height); 

      94:                 txtShap.graphics.endFill(); 

      95:                 txtShap.x=(imgBitmapData.width-tempBitMapData.width) / 2; 

      96:                 txtShap.y=(imgBitmapData.height-tempBitMapData.height) / 2; 

      97: //                txtShap.alpha = .7;

      98:                 

      99: //                txtShap.rotation = 45 + 270;

     100:                 

     101:                 ui.addChild(new Bitmap(imgBitmapData)); 

     102:                 ui.addChild(txtShap); 

     103:                 

     104:                 var newBitmapData:BitmapData = new BitmapData(imgBitmapData.width, imgBitmapData.height, true, 0x00000000); 

     105:                 newBitmapData.draw(ui);

     106:                 

     107:                 var newBitmap:Bitmap = new Bitmap();

     108:                 newBitmap.bitmapData = newBitmapData;

     109:                 

     110:                 previewImg.source = newBitmap;            

     111:             }

     112:             

     113:             private function getTextGlowFilter(col:uint=0x000000,blur:Number=2):GlowFilter

     114:             {

     115:                 var color:uint             = col

     116:                 var alpha:Number        = 1;

     117:                 var blurX:Number        = blur

     118:                 var blurY:Number        = blur

     119:                 var strength:Number     = 255;

     120:                 var quality:Number      = 1     

     121:                 return new GlowFilter(color,alpha,blurX,blurY,strength,quality);      

     122:             }

     123:             

     124:             private function savePictureHandler():void

     125:             {

     126:                 if (loader.content == null || previewImg.source == null)

     127:                 {

     128:                     Alert.show("请先选择要处理的图片","提示");

     129:                     

     130:                     return; 

     131:                 }

     132:                 

     133:                 var pngenc:PNGEncoder = new PNGEncoder();

     134:                 

     135:                 var bitmapData:BitmapData = (previewImg.source as Bitmap).bitmapData.clone();

     136:                 

     137:                 var imgByteArray:ByteArray = pngenc.encode(bitmapData);

     138:                 

     139:                 var _file:FileReference = new FileReference();

     140:                 _file.addEventListener(Event.COMPLETE, downloadCompleteHandler);

     141:                 _file.save(imgByteArray, "_" + filePathTxt.text);

     142:             }

     143:             

     144:             private function downloadCompleteHandler(evt:Event):void

     145:             {

     146:                 Alert.show("图片已保存成功","提示");

     147:             }

     148:             

     149:             private function loaderDataCompleteHandler(evt:Event):void

     150:             {

     151:                 var bitmapData:BitmapData = new BitmapData(loader.width, loader.height, true, 0x00FFFFFF);

     152:                 

     153:                 bitmapData.draw(loader.content);

     154:                 

     155:                 var bitmap:Bitmap = new Bitmap();

     156:                 bitmap.bitmapData = bitmapData;

     157:                 

     158:                 previewImg.source = bitmap;

     159:             }

     160:             

     161:             private function loaderProgressHandler(evt:ProgressEvent):void

     162:             {

     163:                 var percent:Number = evt.bytesLoaded / evt.bytesTotal;

     164:                 

     165:                 percent *= 100;

     166:                 

     167:                 var msg:String = "正在加载:" + percent + "%";

     168:                 

     169:                 trace(msg);                

     170:             }

     171:             

     172:         ]]>

     173:     </mx:Script>

     174:     

     175:     

     176:     <mx:VBox width="100%" height="100%" paddingLeft="20" verticalGap="5">

     177:         

     178:         <mx:HBox width="100%" paddingTop="20" horizontalGap="5">

     179:             

     180:             <mx:TextInput id="filePathTxt" width="300" editable="false" />

     181:             

     182:             <mx:Button label="选择图片" id="selectBtn" click="selectPictureHandler()" />

     183:             

     184:         </mx:HBox>

     185:         

     186:         <mx:HBox width="100%" horizontalGap="5" verticalAlign="top">

     187:             

     188:             <mx:TextArea id="contentTxt" width="300" />

     189:             

     190:             <mx:Button label="加水印" id="madeBtn" click="madePictureHandler()" />

     191:             

     192:             <mx:Button label="保存图片" id="saveBtn" click="savePictureHandler()" />

     193:             

     194:         </mx:HBox>

     195:         

     196:         <mx:Canvas width="350" height="500" id="imgContainer" left="20" top="60" 

     197:                    borderColor="#3399cc" borderThickness="1" borderStyle="solid" >

     198:             

     199:             <mx:Image id="previewImg" horizontalAlign="0" verticalCenter="0" />

     200:             

     201:         </mx:Canvas>

     202:         

     203:     </mx:VBox>

     204:     

     205: </mx:Application>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏韦弦的偶尔分享

微信小程序带图片弹窗简单实现

(PS:最近发现一个问题,如果页面内有textarea时,textarea的层级会比蒙版视图高,并且无法修改,做了一个比较笨的解决方案:小程序textarea层...

1.7K20
来自专栏LinXunFeng的专栏

iOS - Swift UIButton中ImageView的animationImages动画执行完毕后,图标变暗

16830
来自专栏技术总结

UIView不可不知的秘密

24690
来自专栏vue学习

小程序 — 实现左滑删除效果①

(1)movable-area这个就是定义了一个移动的区域,跟普通的<view></view>的含义是一样的,不同在于,接着往下看;

75120
来自专栏IT可乐

frameset标签设计页面

重要事项:不能将 <frameset></frameset> 标签放在<body></body> 标签里。且 HTML5 已经不支持 frameset 标签的使...

26590
来自专栏web前端

02移动端布局

  一、rem      1、意义:当px固定宽度不能适应不同屏幕尺寸时,布局需要,从而产生rem      2、rem 和 em 区别           2...

21890
来自专栏前端菜鸟变老鸟

setTimeout定时器以及部分小知识点

思路:加一个标记flag,开始执行之后改变flag为原来的值并启动定时器,暂停的时候改变flag的值。

7620
来自专栏HT

HTML5 网络拓扑图性能优化

HTML5 中的 Canvas 对文本的渲染(fillText,strokeText)性能都不太好,比如设置字体(font)、文本旋转(rotation),如果...

33460
来自专栏菩提树下的杨过

silverlight数据绑定模式TwoWay,OneWay,OneTime的研究

asp.net开发中,数据绑定是一个很简单的概念,控件与数据绑定后,控件可以自动把数据按一定的形式显示出来。(当然控件上的值改变后,可以通过提交页面表单,同时后...

24160
来自专栏逸鹏说道

06.移动先行之谁主沉浮----我的代码我来写(Xaml的优势)

如果移动方向有任何问题请参考===> 异常处理汇总-移动系列(点) 前面几节课,我们都是在前台创建对象,进行一些设置,那么我们为什么不用传统的方法来编程呢? 我...

27250

扫码关注云+社区

领取腾讯云代金券