as3利用Bitmap做图片倒影效果
这几天把项目忙完了,也该过年了,所以利用这空闲的时间做一些效果,方便以后工作用。一直对Bitmap只是稍微的了解了下,因为平时做的项目中我很少用到这个,今天突然想做下图片倒影的效果。所以对这个类又重新的了解了下,但还是不太深,慢慢研究吧。话不多少了,代码如下:
1 <?xml version="1.0" encoding="utf-8"?> 2 3 <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 4 5 creationComplete="initApp()"> 6 7 8 <mx:Script> 9 10 <![CDATA[ 11 12 import flash.events.ProgressEvent; 13 14 import flash.display.Bitmap 15 16 import flash.display.BitmapData 17 18 import mx.controls.Image 19 20 protected function initApp():void{ 21 22 var bd:BitmapData = new BitmapData(img.contentWidth,img.contentHeight,true,0); 23 //垂直方向翻转,Matrix矩阵中第一、四个参数表示水平和垂直方向的放缩比例,第二、三个参数表示水平和垂直方向的旋转角度 24 //最后两个表示坐标的相对位移,当垂直翻转后,图像的Y坐标发生变化,因此必须移动 25 var matrix:Matrix = new Matrix( 1, 0, 0, -1, 0, img.contentHeight ); 26 //提取图形像素 27 bd.draw(img,matrix); 28 //创建一个视图元件,也可以是其它容器类组件,比如Canvas 29 //这个元件将用来做渐变的透明效果 30 var shape:Shape = new Shape(); 31 32 var gradientMatrix:Matrix = new Matrix(); 33 //定义一个渐变矩阵,用来设置填充效果.创建 Graphics 类的 beginGradientFill() 和 lineGradientStyle() 34 //方法所需的矩阵的特定样式。 35 gradientMatrix.createGradientBox(img.contentWidth,img.contentHeight, 0.5*Math.PI); 36 //使用线性填充,这里使用三种颜色,第三个参数表示透明度的变化范围,0.4 为起点,0.5是中间值,0.1是终点 37 // [0,125,255] 分别是三种颜色所占的百分比 38 shape.graphics.beginGradientFill(GradientType.LINEAR, [0,0,0], [0.4,0.5,0.1], [0,125,255], gradientMatrix) 39 40 shape.graphics.drawRect(0, 0, img.contentWidth,img.contentHeight); 41 42 shape.graphics.endFill(); 43 //将透明度运用在背景中 44 bd.draw(shape, null, null, BlendMode.ALPHA); 45 46 var bitmap:Bitmap = new Bitmap(bd) 47 48 var newImage:Image = new Image(); 49 //把Bitmap传给新的图片 50 newImage.source = bitmap; 51 52 newImage.x = img.x; 53 54 newImage.y = img.y + img.contentHeight ; 55 56 this.addChild(newImage) 57 } 58 59 ]]> 60 61 </mx:Script> 62 63 64 <mx:Image id="img" x="124" y="75" source="images/3.jpg"/> 65 66 </mx:Application>