Loss of image quality when zooming in Flex Mobile application

i have a mobile application that i am creating in Adobe Flex (Flash Builder 4), and i am trying to create a zoom function. The one i have works, but the point is to be able to more easily read words that are in the image (the images are .jpg files). The images are 2550x3300 originally, but as soon as you zoom, the image quality reduces drastically, and nothing is readable.

My code for the zoom function is included below.

        protected function onZoom(e:Tra开发者_Python百科nsformGestureEvent, img:Image):void
        {
            img.transformAround(new Vector3D(e.localX, e.localY, 0), new Vector3D(img.scaleX*e.scaleX, img.scaleY*e.scaleY, 0));
        }

and this is the code for the image object:

<s:Image id="titlepage" includeIn="title_page" x="0" y="0" width="320" height="415" 
         gesturePan="onPan(event, titlepage)" 
         gestureSwipe="onSwipe(event)" 
         gestureZoom="onZoom(event, titlepage)" 
         source="@Embed('assets/myImage.jpg')"/>

Image quality would be improved by setting smooth to true for anti-aliasing.

<s:Image smooth="true" />

There are many ways to handle registration issues - you might be interested in Yahoo Astra utils DynamicRegistration class.

Maybe something like this?

    <fx:Script>
        <![CDATA[
            import com.yahoo.astra.utils.DynamicRegistration;

            protected function image_gestureZoomHandler(event:TransformGestureEvent):void
            {
                DynamicRegistration.scale(image,
                                          new Point(event.localX, event.localY),
                                          image.scaleX *= event.scaleX,
                                          image.scaleY *= event.scaleY);
            }
        ]]>
    </fx:Script>

    <s:Image id="image"
             smooth="true"
             gestureZoom="image_gestureZoomHandler(event)" />

I'm not positive on this, but I think the 'transform' functions creates a bitmap out of your Image which is why you're losing quality. Try using the 'smoothing' attribute on your image.

From there, it's simply scaling and moving your image incrementally. However, what I'm not sure about is if the localX/Y property is from the original place of touch, or of the new position on the container (ie. if you're pinch/zooming from the middle and it scales, will the point still be on the middle or slightly top left).

I'll try to test this out on my phone and see what I come up with.