FLEX:调整Image大小后,imageRotate通常不起作用

时间:2013-03-27 09:37:34

标签: flex

请帮帮我ㅠㅠ

我正在制作ImageEditor。但我对图像旋转功能有疑问。

当我加载图像然后旋转它时,旋转功能非常有效。

但在调整大小(宽度,高度)加载图像后,旋转工作可笑......

Pixed Image的宽度,高度,仅旋转图像的内容..

结果,图像质量下降......

这是截图。

哦..我无法发布图片..因为声望限制......: - <

http://blog.naver.com/hago89n/150164439917

请访问我的博客并确认屏幕截图..

你能理解我的问题吗?

嗯..代码在这里

//调整大小按钮单击处理程序

private function btn_resize_clickHandler(event:MouseEvent):void
{
        image.width = parseInt(ti_width.text.toString());
    image.height = parseInt(ti_height.text.toString());
}

//旋转按钮单击处理程序

private function btn_rotateCCW_clickHandler(event:MouseEvent):void
{//Rotate Counter ClockWise
    var o_rotateimage:RotateImage = new RotateImage();
    o_rotateimage.rotateCCW(image);
}

//在RotateImage.as中旋转函数

public function rotateCCW(image:Image):void
{
    m = new Matrix();    
    m.rotate(Math.PI/2);
    m.tx = image.height;
    var bd:BitmapData = new BitmapData(image.height as int, image.width as int);
    bd.draw(image, m);
    image.source = new Bitmap(bd);
}

1 个答案:

答案 0 :(得分:0)

我认为你应该对两个操作进行矩阵转换。 如果您只是更改Image对象的大小,它在所有情况下都无法正常工作。

以下是this示例的代码。

//应用

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600">

<fx:Script>
    <![CDATA[
        import com.imageeditor.RotateImage;

        [Embed(source="/assets/img/chart.png")]
        [Bindable]
        public var chartPng:Class;

        private var o_rotateimage:RotateImage = new RotateImage();

        private function btn_resize_clickHandler(event:MouseEvent):void
        {
            o_rotateimage.scale(image, int(ti_width.text)/image.width, int(ti_height.text)/image.height);
        }

        private function btn_rotateCCW_clickHandler(event:MouseEvent):void
        {
            o_rotateimage.rotateCCW(image);
        }
    ]]>
</fx:Script>

<s:VGroup x="10" y="10">
    <s:HGroup>
        <s:TextInput id="ti_width" text="300" width="40"/>
        <s:TextInput id="ti_height" text="200" width="40"/>

        <s:Button label="Resize" click="btn_resize_clickHandler(event)"/>
        <s:Button label="Rotate" click="btn_rotateCCW_clickHandler(event)"/>
    </s:HGroup> 
    <s:HGroup width="800" height="600" horizontalAlign="center" verticalAlign="middle">
        <s:Image id="image" source="{chartPng}" width="600" height="400"/>
    </s:HGroup>

</s:VGroup>
</s:Application>

// RotateImage.as

package com.imageeditor
{
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.geom.Matrix;

import spark.components.Image;

public class RotateImage
{
    private var m:Matrix;

    public function rotateCCW(image:Image):void
    {
        var w:int = image.width;
        var h:int = image.height;

        m = new Matrix();    
        m.rotate(Math.PI/2);
        m.tx = image.height;
        var bd:BitmapData = new BitmapData(image.height as int, image.width as int);
        bd.draw(image, m);

        image.width = h;
        image.height = w;

        image.source = new Bitmap(bd);
    }

    public function scale(image:Image, kx:Number, ky:Number):void
    {
        var w:int = image.width;
        var h:int = image.height;

        m = new Matrix();  
        m.scale(kx, ky);

        var bd:BitmapData = new BitmapData(w*kx as int, h*ky as int);
        bd.draw(image, m);

        image.width = w*kx;
        image.height = h*ky;

        image.source = new Bitmap(bd);
    }
}
}