×
文章路径: Flex > C-DRAWS

C-DRAWS画图程序(四):结束

发表于3年前(Dec 12, 2014 10:32:51 PM)  阅读 759  评论 0

分类: Flex C-DRAWS

标签: c-draws 画图 保存 复制 打开 粘贴

这一节将作为C-DRAWS的结束,比较匆忙,原因我在上一节已经说了。主要讲下复制、粘贴,打开,保存。

看复制方法:

//复制
private function copy():void {

var sketch:Sketch;
var bit:BitmapData;
bit = ImageSnapshot.captureBitmapData(graph);
if(graph.getChildByName(DrawCanvas.CUT_RECTANGLE)==null) {
Clipboard.generalClipboard.setData(ClipboardFormats.BITMAP_FORMAT, bit, true);
return;
}
sketch = graph.getChildByName(DrawCanvas.CUT_RECTANGLE) as Sketch;
graph.hideSketch();
var bit2:BitmapData = new BitmapData(sketch.width,sketch.height);
bit2.copyPixels(bit, new Rectangle(sketch.x,sketch.y,sketch.width,sketch.height), new Point(-1,-1));
graph.removeSketch();
Clipboard.generalClipboard.setData(ClipboardFormats.BITMAP_FORMAT, bit2, true);
}

如果没有选择框的话,将复制整个画布,否则将复制选择框里面的内容。 ImageSnapshot.captureBitmapData(graph)该方法能把Flex中的组件转换成位图数据格式,而Clipboard.generalClipboard.setData(ClipboardFormats.BITMAP_FORMAT, bit, true)则是操作系统剪贴板数据。bit2.copyPixels(bit, new Rectangle(sketch.x,sketch.y,sketch.width,sketch.height), new Point(-1,-1))这个方法能把指定矩形的位图数据复制出来,可以看出这个方法有个很大的局限性,就是复制区域只能是矩形,网上有位兄弟写的复制代码能复制任意形状,我加入了我工程,但是没有使用,有兴趣的朋友可以去研究一下,在com.cangzhitao.util.cut.DisplayObjectTransformer里。

剪切的话,这里其实跟复制是一样的,只是多了一步操作,用画布颜色一样的矩形将选择框填充。

看粘贴代码:

//粘贴
private function paste():void {
if(Clipboard.generalClipboard.formats[0] == ClipboardFormats.BITMAP_FORMAT) {
var bitmapData:BitmapData = BitmapData(Clipboard.generalClipboard.getData(ClipboardFormats.BITMAP_FORMAT));
var bitmap:Bitmap = new Bitmap(bitmapData);

var image:Image = new Image();
image.load(bitmap);
var sketch:Sketch = ShapeFactory.getShape(ShapeType.IMAGE);
sketch.width = bitmap.width;
sketch.height = bitmap.height;
sketch.bitMapData = bitmapData;
sketch.style.alpha = 0;
sketch.draw();
graph.addChild(sketch);

}
}
C-DRAWS里面定义了一种专门用来保存位图的图形ImageShape,复制进来的图形,打开的图片都以ImageShape类型保存。

打开图片:

//打开图
private function openFile(file:File):void {
cursorManager.setBusyCursor();

//读入到ByteArray
var bytes:ByteArray = new ByteArray();
var fileStream:FileStream = new FileStream();
fileStream.open(file, FileMode.READ);
fileStream.readBytes(bytes, 0, fileStream.bytesAvailable);
fileStream.close();

//加载到内存中
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
loader.loadBytes(bytes);

graph.isChange = false;
cursorManager.removeBusyCursor();
}

private function imageLoaded(event:Event):void {
event.target.removeEventListener(Event.COMPLETE, imageLoaded);
var bitmap:Bitmap = Bitmap(event.target.loader.content);
//建立image对象
var image:Image = new Image();
image.load(bitmap);
graph.addChild(image);

graph.width = bitmap.width;
graph.height = bitmap.height;
}

首先我们内容读到ByteArray数组里,然后用Loader加载进内存, 然后再加入graph里展现出来,这里还漏了一步,我们应该把他建立成一个ImageShape对象加入到graph里面

最后看保存代码:

//把图保存到指定路径
private function saveFile(file:File):void {
cursorManager.setBusyCursor();

graph.cancelSelected(null);

var bit:BitmapData = ImageSnapshot.captureBitmapData(graph);
var image:PNGEncoder = new PNGEncoder();
var bytes:ByteArray = image.encode(bit);

var fileStream:FileStream = new FileStream();
fileStream.open(file, FileMode.WRITE);
fileStream.writeBytes(bytes);
fileStream.close();
graph.isChange = false;
fileTitle = file.name;
cursorManager.removeBusyCursor();
}
得到画布的位图数据后,我们必须对他进行图形编码,Flex提供有两种编码,一个是PNGEncoder,一个则是JPGEncoder。PNGEncoder编码速度较快,保留的信息完成,缺点则是文件较大,而JPGEncoder正好相反。

好了,就到这儿了。C-DRAWS结束了,虽然不圆满,个人能力还是有限。附上工程源码:

/upload/2014/11/12/C-DRAWS_final_source.rar

发表评论