Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

zooming in as3

Posted on 2009-05-19
4
Medium Priority
?
1,643 Views
Last Modified: 2012-05-07
The code below zooms on to a movieclip using a slider. The user may move the movie clip after he zoomed to see the part he wishes. My question is how can one make a zoom that zooms in to the point where the mouse is(moving the movieclip)
import fl.events.SliderEvent
zoomer.liveDragging=true
zoomer.addEventListener(SliderEvent.CHANGE,zoomDo)
zoomer.addEventListener(SliderEvent.THUMB_PRESS,centerP)
box.buttonMode=true;
box.addEventListener(MouseEvent.MOUSE_DOWN,startD)
box.addEventListener(MouseEvent.MOUSE_UP,stopD)
function centerP(e:Event)
{
	box.x=551;
	box.y=361;
}
function zoomDo(e:Event)
{	
	box.scaleX=zoomer.value/100
	box.scaleY=zoomer.value/100
}
function startD(e:Event)
{
	e.currentTarget.startDrag();
}
function stopD(e:Event)
{
	e.currentTarget.stopDrag();
}

Open in new window

0
Comment
Question by:DukeWendel
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
4 Comments
 
LVL 22

Expert Comment

by:rascalpants
ID: 24432042

you would find the position of the mouse useing _xmouse and _ymouse, and then you would position the center of the movieclip to that spot...

so something like this should work...


clip.x = mouseX - ( clip.width/2 ) ;
clip.y = mouseY - ( clip.height/2 ) ;


you might need to use box._xmouse and box._ymouse if the above does not work...


rp / ZA

0
 
LVL 22

Accepted Solution

by:
rascalpants earned 2000 total points
ID: 24433566

I created an example app for this question...

here is what I have in my FLA:

- I have a mask layer and under it i have...
- a movieclip named box_mc, that is the same shape as the mask
- a movieclip named map_mc that is much larger than the mask


basically, what happens is if you click anywhere in the masked area (on top of box_mc)  the checkPos function is called.  then we check the mouse position along with the map_mc position to create a shift number.  This is the number of pixels to shift the map_mc based on its location to the stage origin.

Then the code sets the map_mc to the position of where you clicked on it, and makes it the center of the box_mc, or viewable mask area.


if you have questions, let me know.


rp / ZA


// AS 3.0
 
box_mc.addEventListener( MouseEvent.MOUSE_DOWN, checkPos );
 
function checkPos( e:MouseEvent ):void
{
	var shiftX:int = mouseX - map_mc.x; 
	var shiftY:int = mouseY - map_mc.y; 
	
	map_mc.x = ( box_mc.x + (box_mc.width/2) ) - shiftX;
	map_mc.y = ( box_mc.y + (box_mc.height/2) ) - shiftY;
}

Open in new window

0
 

Author Closing Comment

by:DukeWendel
ID: 31582970
Thank you for the solution still not quite sure how to get it to the needed x and y gradually but your answer was good.
0
 
LVL 22

Expert Comment

by:rascalpants
ID: 24435246

you can tween it there...  use TweenMax:  http://blog.greensock.com/tweenmaxas3/

I really should have thought about adding that in there...  it is a much more elegant solution  ;)


attached is some updated code that uses TweenMax...



rp / ZA


 
// AS 3.0
 
import gs.TweenMax;
import gs.easing.*;
 
 
box_mc.addEventListener( MouseEvent.MOUSE_DOWN, checkPos );
 
function checkPos( e:MouseEvent ):void
{
        var shiftX:int = mouseX - map_mc.x; 
        var shiftY:int = mouseY - map_mc.y; 
        
        var newX:int = ( box_mc.x + (box_mc.width/2) ) - shiftX;
        var newY:int = ( box_mc.y + (box_mc.height/2) ) - shiftY;
      
        TweenMax.to( map_mc, .5, { x: newX, y: newY } );
}

Open in new window

0

Featured Post

Tech or Treat!

Submit an article about your scariest tech experience—and the solution—and you’ll be automatically entered to win one of 4 fantastic tech gadgets.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a very simple example to help those of you who are still migrating from AS2 to AS3 understand the redesigned event model in AS3. In AS2.0, event functions (that is, the function to be performed when an event is fired) were stored as a pro…
I have been doing hardcore actionscripting for some time; and needless to say I have faced a lot of problems in just understanding others' code rather than understanding what the code executes. A programmer's life can become hell when there are a lo…
In this tutorial viewers will learn how to create a basic shape tween animation in Flash including shape hints for smooth animation Open a new document in Flash: Draw a shape: Select another frame (how long you want the tween to be): Right click and…
The goal of the tutorial is to teach the user what frame rate is, how to control it and what effect it has on the video.

597 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question