Flex 4. Is it possible to get canvas.captureimage from scrolling position and not from the top?
I'm making small image editor which crops/resize an image. Everything worked perfectly until very last moment. Canvas don't want to be captured from scrolling position: only from left top corner.
Question is: how can I use .captureimage of a canvas from scrolling position?
Thanks a lot in advance
import mx.controls.Image;
import mx.events.FlexEvent;
import mx.graphics.ImageSnapshot;
import mx.graphics.codec.JPEGEncoder;
import spark.events.TextOperationEvent;
public var aspectRatio:Number=new Number();
private var loader:Loader;
private var request:URLRequest;
private var loadBD:BitmapData;
public var cropBD:BitmapData= new BitmapData(732,144,false,0x00000000);
private function saveImageToFileSystem():void
{
var oldWidthSize:int;
var oldHeightSize:int;
imgCanvas.verticalScrollBar.alpha=0;
imgCanvas.horizontalScrollBar.alpha=0;
var posPoint:Point = new 开发者_JAVA百科Point(0,0);
var jPEGEncoder:JPEGEncoder = new JPEGEncoder(500);
oldWidthSize=imgCanvas.width;
oldHeightSize=imgCanvas.height;
imgCanvas.height=144;
imgCanvas.width=732;
tracer.text=imgCanvas.verticalScrollPosition.toString();
var imageSnapshot:ImageSnapshot = ImageSnapshot.captureImage(imgCanvas, 0, jPEGEncoder, true);
var fileReference:FileReference = new FileReference();
fileReference.save(imageSnapshot.data, "img123.jpg");
imgCanvas.verticalScrollBar.alpha=1;
imgCanvas.horizontalScrollBar.alpha=1;
imgCanvas.height=oldHeightSize;
imgCanvas.width=oldWidthSize;
}
protected function hslider1_changeHandler(event:Event):void
{
WidthEditor.text=myImage.width.toString(); //put image width into TextInput
myImage.width=WidthChanger.value; //resize picture
}
protected function windowedapplication1_initializeHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
}
protected function OpenBtn_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
//WidthChanger.maximum=myImage.width;
//imgCanvas.height=myImage.height;
var file:File = new File();
file.addEventListener(Event.SELECT, dirSelected);
file.browseForOpen("Select image");
function dirSelected(e:Event):void {
ImgAddress.text=(file.nativePath);
myImage.source=(file.nativePath);
WidthEditor.text="732";
myImage.width=int(WidthEditor.text);
WidthChanger.value=myImage.width;
}
}
protected function WidthEditor_changeHandler(event:TextOperationEvent):void
{
// TODO Auto-generated method stub
myImage.width=int(WidthEditor.text);
WidthChanger.value=myImage.width;
}
protected function OpenBtn_buttonDownHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
}
protected function ProgressBar_completeHandler(event:Event):void
{
// TODO Auto-generated method stub
}
protected function ResizeBtn_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
}
]]>
</fx:Script>
<mx:ProgressBar width="200" source="myImage" x="555.2" y="40" id="ProgressBar" complete="ProgressBar_completeHandler(event)"/>
<mx:Canvas id="imgCanvas" autoLayout="false" x="112.95" y="128.9" width="732" height="417" borderVisible="false" verticalScrollPolicy="auto" >
<mx:Image id="myImage" x="0" y="0" scaleContent="true"/>
</mx:Canvas>
<s:Button click="saveImageToFileSystem()" label="Save Image" x="116.2" y="10"/>
<s:HSlider change="hslider1_changeHandler(event)" id="WidthChanger" stepSize="1" minimum="1" maximum="3000" x="114.2" y="89" width="189"/>
<s:Button x="259.2" y="10" label="Open" id="OpenBtn" click="OpenBtn_clickHandler(event)" buttonDown="OpenBtn_buttonDownHandler(event)"/>
<s:TextInput x="337.2" y="10" id="ImgAddress" width="418"/>
<s:Label x="262.2" y="48" text="Label" id="tracer"/>
<s:Label x="116.2" y="69" text="Width:" fontFamily="Georgia" fontStyle="italic"/>
<s:TextInput x="312.2" y="82" width="64" id="WidthEditor" change="WidthEditor_changeHandler(event)"/>
<s:Label x="367.2" y="48" text="Label" id="tracer2"/>
<mx:Image width="732" height="144" id="CaptureSection" x="112.95" y="264.9"/>
<s:BorderContainer x="112.2" y="129.65" width="718" height="136" backgroundColor="#C7C8CA" backgroundAlpha="0.7" borderVisible="false">
</s:BorderContainer>
<s:BorderContainer x="112.2" y="408.65" width="718" height="124" backgroundColor="#C7C8CA" backgroundAlpha="0.7" borderVisible="false">
</s:BorderContainer>
</s:WindowedApplication>
Maybe you can use
var imageBitmapData:BitmapData = ImageSnapshot.captureBitmapData(yourcanvas);
var x:Number = yourcanvas.horizontalScrollPosition;
var y:Number = yourcanvas.verticalScrollPosition;
var w:Number = yourcanvas.width;
var h:Number = yourcanvas.height;
And then use imageBitmapData.copyPixel to get the part of the picture you want.
精彩评论