Flex 画面快照截图及显示实现代码

在软件开发过程中经常会有对画面进行快照截图的需求,例如把画面当前显示的状态捕捉下来保存成图片。接下来讨论如何在flex中对画面进行截图,画面截图完成后怎样再显示到画面上。

一、对指定画面进行快照、截图。
在Flex SDK中flash.display包下面有两个类Bitmap和BitmapData。在flex中可以通过两个类对图片进行操作。BitmapData类中有一个draw方法这个方法的第一个参数是进行画面截图的源对象,这个对象必须实现IBitmapDrawable接口。而DisplayObject类实现了这个接口,DisplayObject是所有可见控件的先祖类,也就意味着所有在flex可以看到的画面、控件都可以用draw方法来进行快照截图。
具体的代码如下:
复制代码 代码如下:

private var bmpImage:Bitmap = null;
private function onClick():void
{
//创建一个大小和截图对象一致的图片
var bmpData:BitmapData = new BitmapData(source.width,source.height);
//进行快照截图,其中第二个参数Matrix是对图片进行变换用的,例如旋转缩放等。
//如果图片不需要变换可以用new Matrix()或者null都可以。
bmpData.draw(source,new Matrix());
//创建Bitmap对象
bmpImage = new Bitmap(bmpData);
}

BitmapData对象不能直接显示到画面上,所以需要把BitmapData对象封装到Bitmap中,按下截图按钮后,Panel的快照就生成了,保存到了Bitmap对象中。
效果图片:
效果图A
二、将捕获到的截屏图片显示到画面上。
接下来就是把Bitmap对象显示到画面上,这里需要借助UIComponent类。由于直接把Bitmap对象加到Canvas等容器中,运行时会出错,因为容器中添加的子对象必须是UIComponent的子类,而Bitmap不是,所以需要UIComponent类来封装一层。然后把UIComponent对象加入到Canvas容器中,这样图片就显示出来了。
代码如下所示:
复制代码 代码如下:

private function onShow():void
{
//创建一个UIComponent对象
var uic:UIComponent = new UIComponent();
//将Bitmap对象加入到UIComponent对象中
uic.addChild(bmpImage);
//将UIComponent对象加入Canvas中
showImage.addChild(uic);
}

先按下截图按钮进行截图操作,然后按下显示按钮把截图显示到Canvas中。效果如图所示。
效果图B
三、以下是这个程序的完整代码:
复制代码 代码如下:


fontFamily="宋体" fontSize="12" width="831" height="448">




















四、总结。
虽然可以用Bitmap和BitmapData类进行截图和现实,但是flex不能直接读写文件。图片的保存还需要后台程序的配合来完成。

以上就是Flex 画面快照截图及显示实现代码的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » Flex