Could someone help me how to achieve zoom in feature on mouse hover in adobe flash.
I am using Action script 3. I Imported an image to stage and converted to symbol then gave a instance name "ZoomTutorial'. I am stuck after that as i have no experience in action script.
Thanks in advance!
There is a similar question
In you're case you want to scale the object X and Y proportional. To do so you could attach two events on the object ( MovieClip I guess ) you want. The events should be
"mouseOver"
"mouseOut"
The script could be something like that:
var zoomAmount:Number = 0.5;
mc.addEventListener(MouseEvent.MOUSE_OVER, zoom);
mc.addEventListener(MouseEvent.MOUSE_OUT, zoomOut);
function zoom(event:MouseEvent):void {
image1.scaleX += zoomAmount;
image1.scaleY += zoomAmount;
}
function zoomOut(event:MouseEvent):void {
image1.scaleX -= zoomAmount;
image1.scaleY -= zoomAmount;
}
Related
I need the answer to what seems like it should be a very obvious question, yet I can't find it anywhere:
How do you stop a function in Flash AS3? For basic example, when I push a button, the function starts working. When I press the button again, the function stops.
More specifically, how can I tailor this to an if/boolean (or similar) statement so that when/while the variable is true, the function starts working. Once the variable goes false, the function stops. When it goes true again, the process repeats.
The code in issue is this panning function that another user helped create for me.
if(Zoomed == true) {
MovieClip.y = stage.stageHeight / 2;
MovieClip.x = stage.stageWidth / 2;
addEventListener(MouseEvent.MOUSE_MOVE, panFunction);
function panFunction(me: MouseEvent): void {
MovieClip.x = stage.stageWidth / 2 - (stage.mouseX - stage.stageWidth / 2);
MovieClip.y = stage.stageHeight / 2 - (stage.mouseY - stage.stageHeight / 2);
}
}
As you can see, I want it so that when the boolean function 'Zoomed' is true, the function activates and the panning feature works. The problem is that when I go back to Zoomed == false, the function is still running. I am looking to find out how to stop this from happening.
I have tried a 'while' loop but it ultimately just freezes the animation (likely because its a moving image and it's trying to render every frame with this code).
Summarising: I need a way for a function to be able to be toggled on and off. Alternatively, being able to add it and remove it when it's needed/not needed should work the same. Any help on this would be a great help, thanks!
What you need to do is remove the event listener when you no longer want panning.
Something like this, which assumes you change the value of zoomed on a click:
var zoomed:Boolean = false; //a var to store whether we are currently zoomed
//change the zoom on mouse click
addEventListener(MouseEvent.CLICK, zoomClick);
function panFunction(me:MouseEvent): void {
mc.x = stage.stageWidth / 2 - (stage.mouseX - stage.stageWidth / 2);
mc.y = stage.stageHeight / 2 - (stage.mouseY - stage.stageHeight / 2);
}
function zoomClick(me:MouseEvent):void {
zoomed = !zoomed; //toggle the zoomed value
if(zoomed){
//we're zoomed, so add the panning mouse move listener
addEventListener(MouseEvent.MOUSE_MOVE, panFunction);
//do whatever else you need to when first zoomed.
}else{
//no longer zoomed, remove the mouse move listener
removeEventListener(MouseEvent.MOUSE_MOVE, panFunction);
}
}
Some notes, the word MovieClip is not a good instance name, as it may conflict the class name MovieClip, I'd recommend renaming it mc or something else to avoid potential problems later on.
Also, avoid inline functions (functions declared/contained within other functions), they can be especially problematical when attached to event listeners and are a good way to introduce memory leaks into your program.
I'm having a serious problem that is getting me nervous:
I've made a button _btn that includes ROLLOVER and ROLLOUT animations with coding (an nested movieclip instance called barra that increases to half alpha when you hover over and decreases when you hover out).
[Here it should go a descriptive image but I'm new and I need 10 reputation. I'll appreciate your help]
This works perfectly but the problem occurs when I move my cursor very quickly from one point to another, with the button in between. It seems that the ROLLOUT function is not detected, so the ROLLOVER animation keeps working (and if you look carefully, the animation stops for a few seconds and then continues).
[Here it should go another descriptive image too]
This is the code in the Actions layer:
//Funciones ROLL OVER
function _btnOver(event:MouseEvent):void {
_btn.buttonMode = true;
_btn.addEventListener(Event.ENTER_FRAME,_btnFadeIn);
}
function _btnFadeIn(event:Event):void {
_btn.barra.alpha += 0.1;
if (_btn.barra.alpha >= 0.5)
{
_btn.removeEventListener(Event.ENTER_FRAME,_btnFadeIn);
}
}
_btn.addEventListener(MouseEvent.ROLL_OVER,_btnOver);
//Funciones ROLL OUT
function _btnOut(event:MouseEvent):void {
_btn.addEventListener(Event.ENTER_FRAME,_btnFadeOut);
}
function _btnFadeOut(event:Event):void {
_btn.barra.alpha -= 0.1;
if (_btn.barra.alpha <= 0.2)
{
_btn.removeEventListener(Event.ENTER_FRAME,_btnFadeOut);
}
}
_btn.addEventListener(MouseEvent.ROLL_OUT,_btnOut);
Click here if you want to download the FLA and SWF files, so you can see the problem clearly.
I barely know how to use ActionScript 3 (my only programming knowledge is Processing) and I don't have time now to learn it from head to toe, but I've researched about the problem and it's still not clear.
With tutorials and guides, I managed to learn how to create and understand this code, and I think the problem might be in the functions of the events ROLL_OVER and ROLL_OUT, which contain the addEventListener of the ENTER_FRAME events (where the animations actually are), respectively. But I don't know exactly what I have to do to fix it, what should I add or change.
I would be really glad if someone could help with this, I'm frustrated! What do you recommend me to do?
Thanks in advance
(PD: I don't understand most of the programming language. If you can be as clear and direct as possible, I'll really appreciate it)
Apparently your troubles lay in incoherent animation sequence by using enter frame listeners. You are running two independent listeners, both altering alpha of a single object, this creates a conflict, only one will work (you can determine which if you add both at once and trigger events, the resultant alpha value will indicate which listener changes it last) and you apparently expect one to do a fade in while the other to do a fade out. Instead, you should use one listener (probably even persistent) and give your object "target alpha" property as well as delta to change alpha per frame. An example:
var bbta:Number=0.2; // btn.barra's target alpha
_btn.addEventListener(Event.ENTER_FRAME,_btnFade);
function _btnFade(e:Event):void {
var a:Number=_btn.barra.alpha;
if (Math.abs(a-bbta)<1e-8) return;
// no sense of setting alpha with minuscule difference
const delta:Number=0.1; // how fast to change per frame
if (a>bbta) {
a-=delta;
if (a<=bbta) a=bbta;
} else {
a+=delta;
if (a>=bbta) a=bbta;
}
_btn.barra.alpha=a;
}
function _btnOver(event:MouseEvent):void {
_btn.buttonMode = true; // move this elsewhere, if you don't cancel buttonMode
bbta=0.5; // set target alpha, the listener will do a fade-in
}
function _btnOut(event:MouseEvent):void {
bbta=0.2; // set target alpha, the listener will do a fade-out
}
I edited some code in here, basically i am checking hover state onLoop function, so you can change your settings on here
import flash.events.Event;
var isRolledOver:Boolean = false;
//Funciones ROLL OVER
function _btnOver(event:MouseEvent):void {
isRolledOver = true;
}
function _btnOut(event:MouseEvent):void {
isRolledOver = false;
}
_btn.addEventListener(MouseEvent.ROLL_OVER,_btnOver);
_btn.addEventListener(MouseEvent.ROLL_OUT,_btnOut);
this.addEventListener(Event.ENTER_FRAME,onLoop);
function onLoop(e){
if(this.isRolledOver){
if(_btn.barra.alpha < 0.5) _btn.barra.alpha += 0.1;
}
else{
if(_btn.barra.alpha > 0.5 || _btn.barra.alpha > 0) _btn.barra.alpha -= 0.1;
}
}
I added the sample fla in case
I am completely new using Flash and I am doing a project to enhance my skills.
I wonder if there's a way to connect a button doing 2 different things.
I created a slide button that goes on X axis only using Gesture (Touch) and also I created a movie clip showing a map progressing (changes) I would like to connect them, something like every single frame this button goes on this slide it also plays one frame inside the movie clip and return of course.
I think I made myself clear, as it goes along the axis it plays the movie clip.
is there a way to approach for this idea?
ps:
It looks very advanced
MySprite.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
MySprite.addEventListener(TouchEvent.TOUCH_END, onTouchEnd);
MySprite.addEventListener(Event.ENTER_FRAME, fixer);
function onTouchBegin(e:TouchEvent) {
e.target.startTouchDrag(e.touchPointID);
trace("touch begin");
}
function onTouchEnd(e:TouchEvent) {
e.target.stopTouchDrag(e.touchPointID);
trace("touch end");
}
function fixer(e:Event) {
e.currentTarget.x = [int here];
if(runIt){
e.currentyTarget.x += speed;
}
}
I have about 50 symbols that I want to make draggable. Nothing fancy, just the ability to click it and drag it to a different location.
I found as3 code for doing so but when I paste it into my file it gives me errors:
**Error** Scene=Scene 1, layer=Units, frame=1:Line 9: The class or interface 'MouseEvent' could not be loaded.
function mouseDownHandler(evt:MouseEvent):void {
That code is:
// Register mouse event functions
fighter_uk.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
fighter_uk.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
fighter_uk.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
fighter_uk.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
// Define a mouse down handler (user is dragging)
function mouseDownHandler(evt:MouseEvent):void {
var object = evt.target;
// we should limit dragging to the area inside the canvas
object.startDrag();
}
function mouseUpHandler(evt:MouseEvent):void {
var obj = evt.target;
obj.stopDrag();
}
I'm using flash pro 8, so I tried finding as2 code but couldn't find it.
Also, is there an 'easy' way to code all 50 objects?
I think you're trying to compile AS3 code with AS2 compiler. Try changing your compilation settings to target AS3.
Also you may need to include the class import at the top of your code:
import flash.events.MouseEvent;
To drag 50 objects, add them all on the same container sprite and add the listener to the container sprite only:
var holder:Sprite = new Sprite();
for ( var i:int = 0, l:int = 50; i < l; i++ ) {
var dragee:YOUR_CUSTOM_OBJECT = new YOUR_CUSTOM_OBJECT();
holder.addChild(dragee);
}
addChild(holder);
holder.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
holder.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
holder.addEventListener(Event.MOUSE_LEAVE, mouseUpHandler);
var currentDragee:YOUR_CUSTOM_OBJECT = null;
function mouseDownHandler(evt:MouseEvent):void {
currentDragee = evt.target as YOUR_CUSTOM_OBJECT;
if ( currentDragee !== null ) {
currentDragee.startDrag();
holder.addChild(currentDragee); // bring current to front position
}
}
function mouseUpHandler(evt:Event):void {
if ( currentDragee !== null ) currentDragee.stopDrag();
currentDragee = null;
}
YOUR_CUSTOM_OBJECT being the object class you need to drag. Hope it helps!
This page seems to have the answers you are looking for (AS2 drag and drop). If you've already seen it, you'll need to explain why it's not good enough for your needs.
If you want to drag/drop multiple instances in AS2, you can still add the code to the movieClip symbol, export it from the library and load the instances up using attachMovie (all 50 of them). If they are all different, then attach the code as necessary to the clips themselves, or to some function elsewhere that will capture all the clicks and decide what was clicked. This is all very doable in AS2.
Remember you can use your onClipEvent(load) function to set up a lot of the initial lifting.
Here's a sample I made in AS2 for making a node tree. It's all draggable (mouse drag) and zoomable (with mouse Wheel). You can add nodes by clicking on the little down arrow in the node box. Each node is listening for the mouse.
You'll want to look at this section for the most part:
// Enable drag on button press
on (press)
{
startDrag(this);
}
// Stop the drag on release of mouse button
on (release)
{
stopDrag();
}
Besides this, I'm not really sure how your setup looks, so I hope this helps get the ball rolling. (Check the link, there's lots of little gems in there).
Flash Professional 8 only supports ActionScript 2 & 1
You can follow this official URL and learn how to do that in ActionScript 2, but I extremely recommend you to work with ActionScript 3.
I am building a simple flash game in AS3 and I was wondering if I could use code similar to "hitTestPoint()" except it applies to a shape and not a symbol?
The maze is simply a line shape, so if the ball moves off the shape then the game is terminated. Is this possible?
Thanks,
Peter
Simple enough. Just test if the maze is found at the current location of the ball.
function test():Boolean {
// First we get the absolute coordinates of the ball
var loc:Point = ball.localToGlobal(new Point(0,0));
// Next we collect all the DisplayObjects at that coordinate.
var stack:Array = getObjectsUnderPoint(loc);
var found:Boolean = false;
// Now we cycle through the array looking for our maze
for each (var item in stack) {
if (item.name == "mazeShape") {
found = true;
}
}
return found;
}
If you're really interested in whether the mouse (and not the ball) is off the maze, just replace the first line with this:
var loc:Point = new Point(mouseX, mouseY);
Depending how your game looks, you could also use coordinates for this.
Just tell the game if Player > 100 Y it is off the game it's limits = Restart.
It might won't be the most solid solution but it is definetely a way to solve it as I don't believe there is a function for it, please do correct me if I am wrong.
The AS3 Collision Detection Kit will let you detect hits based on color if separating the maze into smaller symbols is not appropriate.