0 Replies Latest reply: Apr 15, 2011 6:38 AM by RaRaton RSS

    Zoom in/out problems

    RaRaton Community Member

      Hi,

      I have a canvas named landscapeZoomer. Inside of this canvas there is a VBox component named c_book, with a FlexBook inside attached dynamically.

       

      <Canvas id="landscapeZoomer" width="100%" height="100%" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                 x="0" y="0" clipContent="true" resize="landscapeZoomer_resizeHandler(event)"
                click="landscapeZoomer_clickHandler(event)" borderColor="#ff00ff" borderStyle="solid">
                <VBox id="c_book" width="100%" height="100%" verticalScrollPolicy="off" horizontalScrollPolicy="off"
                             x="{Math.floor((landscapeZoomer.width - c_book.width) / 2)}"
                             y="{contTituloBook.height + Math.floor((leftPanel.height - contTituloBook.height - contToolBars.height - c_book.height) / 2)}"
                             paddingTop="0" paddingLeft="0" paddingRight="0" paddingBottom="0"
                             visible="true" clipContent="false"
                             borderStyle="none" borderThickness="0">
                </VBox>
      </Canvas>

       

      I need to do zoom in/out where  I clicked over left or right page. I calculate the value of zoom to fit the clicked page to the width of landscapeZoomer.

      And I he created a point named pCen to center the zoom,  its x coordinate is sitting in the middle of page.

      When i clicking over one page, c_book is resized ok, but it's wrong positioned.

      I use a scale effect to this, but the center of the page is not positioned in the middle of landscapeZoomer canvas.

       

      protected function landscapeZoomer_clickHandler(event:MouseEvent):void
      {

       

      var pRef:Point = new Point(event.stageX, event.stageY);
      pRef = landscapeZoomer.globalToLocal(pRef);

       

      var centro:Number = landscapeZoomer.width / 2;
      var centroPagina:Number = c_book.width / 2;
      var pageLeft:Boolean = (pRef.x < centro)? true: false;
                     
      var scaleAux:Number = 1;
      var autoCenterTransform:Boolean = false;

       

      //Zoom out
      if ((c_book.scaleX != 1) || (c_book.scaleY != 1))
      {

               scaleAux = 1;

      }

      else

      {

      zoomPrefUsuario = landscapeZoomer.width / centroPagina;

      scaleAux = zoomPrefUsuario;

      autoCenterTransform = false;

       

      if (!pageLeft

               {

      var pCen:Point = new Point(centro + (centroPagina * 0.5), pRef.y);//centroPagina * 1.5, c_book.height * 0.5);
      pCen = landscapeZoomer.localToGlobal(pCen);//c_book.localToGlobal(pCen);
      c_book.transformX = pCen.x;
      c_book.transformY = pCen.y;

      }   
      else
      {

      var pCen:Point = new Point(centro - (centroPagina * 0.5), pRef.y);//centroPagina * 1.5, c_book.height * 0.5);
      pCen = landscapeZoomer.localToGlobal(pCen);//c_book.localToGlobal(pCen);
      c_book.transformX = pCen.x;
      c_book.transformY = pCen.y;

      }

      }

       

      scaleEffect = new Scale;
      scaleEffect.target = c_book;
      scaleEffect.scaleXTo = scaleAux;
      scaleEffect.scaleYTo = scaleAux;
      scaleEffect.autoCenterTransform = autoCenterTransform;
      scaleEffect.play();

       

      }