2008年3月21日 @ 13:53
Graffiti - AS3 Bitmap Drawing Library
引用内容
Flash动画http://www.nocircleno.com/graffiti/
SourceCode
引用内容
Flash动画这个问题在Adobe Bug System已经有人提交了,原文地址:http://bugs.adobe.com/jira/browse/SDK-11241
官方的答复:只有嵌入的字体才可以旋转(Note that only embedded text can be rotated.).
英文字体无所谓,反正那么小,中文字体就惨了,动辄十几M,难道就没有其他方法了吗?答案是肯定的.
可以先把text组件生成Bitmap,然后再旋转Bitmap就可以了
源码:
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalScrollPolicy="off">
<mx:Script>
<![CDATA[
import mx.controls.Image;
import mx.core.UIComponent;
public function save2bmp():void{
var target:Image = new Image();
var bd :BitmapData = getBitmapData( UIComponent( txt ) );
target.source = new Bitmap( bd );
canvas.addChild(target);
canvas.setChildIndex(target, canvas.numChildren - 1);
}
private function getBitmapData( target :UIComponent ) : BitmapData
{
var bd : BitmapData = new BitmapData( target.width, target.height );
var m : Matrix = new Matrix();
bd.draw( target, m );
return bd;
}
]]>
</mx:Script>
<mx:Spacer height="200"/>
<mx:Canvas id="canvas" width="200" height="100" rotation="{HS.value}" click="canvas.setChildIndex(txt, canvas.numChildren - 1)">
<mx:TextArea id="txt" width="100%" height="100%" mouseFocusChange="save2bmp()"/>
</mx:Canvas>
<mx:HSlider id="HS" minimum="0" maximum="360" />
<!--<mx:Button label="save" click="save2bmp()"/>-->
</mx:Application>
From: http://www.jamesward.org/wordpress/2006/08/16/flex-paint-flex-display-object-to-png/#more-66
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:VBox width="300" height="300">
<mx:Canvas id="c" width="500" height="500" backgroundColor="#ffffff">
<mx:Label left="0" top="0" text="top left"/>
<mx:Label left="0" bottom="0" text="bottom left"/>
<mx:Label right="0" top="0" text="top right"/>
<mx:Label right="0" bottom="0" text="bottom right"/>
</mx:Canvas>
</mx:VBox>
<mx:Canvas id="p" width="500" height="500"/>
<mx:Button label="duplicate canvas">
<mx:click>
import flash.display.BitmapData;
var bd:BitmapData = new BitmapData(c.width,c.height);
bd.draw(c);
p.graphics.clear();
p.graphics.beginBitmapFill(bd);
p.graphics.drawRect(0, 0, c.width, c.height);
</mx:click>
</mx:Button>
</mx:Application>
Form: http://www.cynergysystems.com/blogs/page/andrewtrice?entry=flex_2_bitmapdata_tricks_and
Most seasoned flash developers know that the Bitmap API has been around in the Flash player since the relase of FP8. Those that know all about the Bitmap API appreciate it for its many benefits... Those that don't know about it, trust me, you appreciate it too... you just don't know it. In Flex 2, you can take advantage of the Bitmap API to implement some very powerful and useful techniques that simply are not possible in non-Flash-based web applications.
Some of you may be asking: What is the Bitmap API?
The Bitmap API refers to the flash player's functionality that renders every visual object within a swf as a bitmap (which gets cached), rather than redrawing the entire object every frame interval. Only objects that are marked as "dirty" will be redrawn. The amount of resources used to render each frame is significantly reduced, thus improving the runtime performance of swf files on the client machine. You can find some more information on the Bitmap API at:
private function getUIComponentBitmapData( target : UIComponent ) : BitmapData
{
var bd : BitmapData = new BitmapData( target.width, target.height );
var m : Matrix = new Matrix();
bd.draw( target, m );
return bd;
}

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
private function captureFullScreen() : void
{
var bd : BitmapData = getBitmapData( UIComponent( mx.core.Application.application ) );
targetImage.source = new Bitmap( bd );
}
private function captureHiddenDatagrid() : void
{
var bd : BitmapData = getBitmapData( UIComponent( hiddenDg ) );
targetImage.source = new Bitmap( bd );
}
private function getBitmapData( target : UIComponent ) : BitmapData
{
var bd : BitmapData = new BitmapData( target.width, target.height );
var m : Matrix = new Matrix();
bd.draw( target, m );
return bd;
}
]]>
</mx:Script>
<mx:Button
id="captureButton"
label="Capture Full Screen"
click="captureFullScreen()" />
<mx:Button
id="captureButton2"
label="Capture Hidden Datagrid"
click="captureHiddenDatagrid()"
x="153"/>
<mx:Image
id="targetImage"
x="10"
y="30"/>
<mx:DataGrid
x="99"
y="64"
id="hiddenDg"
visible="false">
<mx:columns>
<mx:DataGridColumn headerText="Column 1" dataField="col1"/>
<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>




http://www.51as.com/article.asp?id=50
使用Flex中,所有的UI组件显示其最终的内部表示都是bitmapData,所以使用BitmapData对象可以对任何Flex2 UI组件进抓图,一下是范例代码,代码很简单,其精髓就是使用了BitmapData.draw(source:IBitmapDrawable, matrix:Matrix = null,...)方法,所有的FLEX2 UI组件都是DisplayObject的子类,而DisplayObject实现了IBitmapDrawable接口:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
private function captureFullScreen() : void
{
var bd : BitmapData = getBitmapData( UIComponent( mx.core.Application.application ) );
targetImage.source = new Bitmap( bd );
}
private function captureHiddenDatagrid() : void
{
var bd : BitmapData = getBitmapData( UIComponent( hiddenDg ) );
targetImage.source = new Bitmap( bd );
}
/**********************************************************
This function is the real "meat" of this code snippet.
**********************************************************/
private function getBitmapData( target : UIComponent ) : BitmapData
{
var bd : BitmapData = new BitmapData( target.width, target.height );
var m : Matrix = new Matrix();
bd.draw( target, m );
return bd;
}
]]>
</mx:Script>
<mx:Button
id="captureButton"
label="Capture Full Screen"
click="captureFullScreen()" />
<mx:Button
id="captureButton2"
label="Capture Hidden Datagrid"
click="captureHiddenDatagrid()"
x="153"/>
<mx:Image
id="targetImage"
x="10"
y="30"/>
<mx:DataGrid
x="99"
y="64"
id="hiddenDg"
visible="false">
<mx:columns>
<mx:DataGridColumn headerText="Column 1" dataField="col1"/>
<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
来源:onflex.org
http://www.51as.com/article.asp?id=132

