Question

我正在制作小型图像编辑器，用于裁剪/调整图像大小。一切都运作良好，直到最后一刻。画布不希望从滚动位置捕获：仅从左上角开始捕获。

问题是：如何从滚动位置使用画布的.captureimage？

提前多多感谢

        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 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>

Answer 1

也许你可以使用

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;

然后使用imageBitmapData.copyPixel获取所需图片的一部分。

Flex 4.是否可以从滚动位置获取canvas.captureimage而不是从顶部？

1 个答案: