2 Replies Latest reply on May 30, 2007 7:42 AM by JabbyPandaUA

    Rotate & Zoom Image

    flor66
      Hi,
      In the below example I have tried to insert the functionalities of zoom and rotate on an image, unfortunately from time to time the centre of the image gets lost. How to resolve this Problem?
      ------------------------------------------------------------------------------------
      <?xml version="1.0"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">
      <mx:Script>
      <![CDATA[
      import flash.events.*;
      private function onZoomW(event: MouseEvent) : void
      {
      zoomSlide.zoomHeightTo=zoomSlider.value/100;
      zoomSlide.zoomWidthTo=zoomSlider.value/100;
      ZoomRotateShow.play();
      }
      private function onZoom(value : Number) : void
      {
      zoomSlide.zoomHeightTo=value/100;
      zoomSlide.zoomWidthTo=value/100;
      ZoomRotateShow.play();
      }
      private function onRotate( value : Number ) : void
      {
      rotateSlide.angleTo=value;
      ZoomRotateShow.play();
      }
      ]]>
      </mx:Script>
      <mx:Parallel id="ZoomRotateShow">
      <mx:Zoom id="zoomSlide" target="{phoneImage}" duration="1" captureRollEvents="true" />
      <mx:Rotate id="rotateSlide" target="{phoneImage}" duration="1" />
      <mx:Move id="moveSlide" target="{phoneImage}" duration="1" />
      </mx:Parallel>
      <mx:Canvas id="c1"
      borderStyle="none"
      width="200" height="200">
      <mx:Panel id="panel"
      title="HSlider Control Example"
      height="100%" width="100%"
      paddingTop="10" paddingBottom="10"
      paddingLeft="10" paddingRight="10"
      top="0" horizontalAlign="center"
      verticalAlign="middle">
      <mx:HBox height="100%" width="100%" id="c2"
      horizontalAlign="center" verticalAlign="middle"
      autoLayout="true">
      <mx:Image id="phoneImage"
      source=" http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
      x="{c2.width/2-phoneImage.width/2}" y="{c2.height/2-phoneImage.height/2}"
      scaleContent="false"
      autoLoad="true" scaleX="1" scaleY="1" maintainAspectRatio="true"
      mouseWheel="onZoomW(event);" >
      </mx:Image>
      </mx:HBox>
      <mx:HSlider
      id="zoomSlider"
      minimum="0" maximum="200" value="100"
      snapInterval="1" liveDragging="false"
      change="onZoom(zoomSlider.value);"
      enabled="true" allowTrackClick="true" />
      <mx:HSlider
      id="rotateSlider"
      minimum="-180" maximum="180" value="0"
      snapInterval="1" liveDragging="false"
      change="onRotate(rotateSlider.value );"
      enabled="true" allowTrackClick="true"/>
      </mx:Panel>
      </mx:Canvas>
      </mx:Application>