Frame to frame Tween transition with AS3

I have a button in "frame 1" that leads to "frame 2". The file has simple code:

myButton.addEventListener(MouseEvent.CLICK, gotoFrame02);

function gotoFrame02(event:MouseEvent):void {
    gotoAndStop(2);
}

The problem is no transition when the frame changes. Is it possible to apply Tween transition when the frame changes?

You can easily take bitmapData from the stage and fade the alpha away when put in a MovieClip.

Here's a github repo I made:

https://github.com/Abrahamh08/Frame-Transitions-AS3

Fade.as, import this file in a folder com in a folder videogamecheatsultra and fade frames with the function Fade.fadeIntoFrame():

package com.videogamecheatsultra
{
    import flash.display.Stage;
    import flash.display.BitmapData;
    import flash.display.Bitmap;
    import flash.events.Event;
    import flash.display.MovieClip;
    import flash.display.DisplayObject;

    /*
    This code fades a frame into the frame and/or Scene you define.

    Code by Cornelia Rose LLC (http://www.videogamecheatsultra.com)
    This file is not to be sold and not to be claimed as your file or your code.  Have a nice day!
    */
    public class Fade
    {
        public static function fadeIntoFrame(root, stage, frame:int, Scene:String = null, alphaPerFrame:Number = 0.05)
        {
            var data:BitmapData = new BitmapData(stage.stageWidth, stage.stageHeight, true, 0);
            data.draw(stage);

            var stageData:Bitmap = new Bitmap;
            stageData.bitmapData = data;

            var stageClip:MovieClip = new MovieClip();
            stageClip.addChild(stageData);

            if(Scene != null)
            {
                MovieClip(root).gotoAndStop(frame, Scene);
            }else
            {
                MovieClip(root).gotoAndStop(frame);
            }

            stageClip.x = 0;
            stageClip.y = 0;

            stage.addChild(stageClip);

            var highIndex:int = stage.getChildIndex(stage.getChildAt(stage.numChildren - 1));
            stage.setChildIndex(stageClip, highIndex);

            stageClip.addEventListener(Event.ENTER_FRAME, fadeTo);

            function fadeTo(e:Event)
            {
                e.currentTarget.alpha -= alphaPerFrame;
                if(e.currentTarget.alpha <= 0)
                {
                    e.currentTarget.removeEventListener(Event.ENTER_FRAME, fadeTo);
                    e.currentTarget.parent.removeChild(e.currentTarget);
                }
            }
        }

    }

}

frame1 :

stop();
myButton.addEventListener(MouseEvent.CLICK, gotoFrame02);
function gotoFrame02(event:MouseEvent):void {
    gotoAndStop(2);
}

frame2 :

stop();
import fl.transitions.Tween;
import fl.transitions.easing.*;
var myTween:Tween = new Tween(myButton, "x", Elastic.easeOut, 0, 300, 3, true);

refer this link for more. http://www.zedia.net/actionscript-3-tweens-tutorial/

It's not exactly possible, no. Moving from one frame to another using the timeline does just that, and because objects on the timeline (and their states) are not available to the code until you are already there you cannot easily look ahead to create a tween. I would say that you have two options, although I can't say which is the better without knowing what exists on the second frame.

1. Timeline animation

Rather than using gotoAndStop to go to a completely different state on frame 2, use gotoAndPlay, and then create the desired animation between the two states you want starting on frame 2. Place a keyframe at the end of your animation containing a stop().

2. Forget the timeline

ActionScript 3 is object orientated, and works best when you free yourself from the timeline. Create the contents of frame 2 as a symbol in the library and set the symbol to "Export for Actionscript". You can now attach this symbol and apply coded tweens to it when your button is clicked. For code based tweens I would strongly recommend using the free TweenMax library, or TweenLite if you have file size concerns. They are very easy to use, and much more efficient and more feature packed than the built in tweening classes. You can also use TimelineMax to group several tweens together and control them as a group.

For example:

import com.greensock.TweenMax;
import com.greensock.TimelineMax;

myButton.addEventListener(MouseEvent.CLICK, gotoFrame02);

var frame2State:Frame2State;

function gotoFrame02(event:MouseEvent):void 
{
    //remove listener for memory management purposes
    myButton.removeEventListener(MouseEvent.CLICK, gotoFrame02);
    //create instance of your next state from the library
    frame2State = new Frame2State();  //assuming that the class name you set for the symbol is Frame2State
    addChild(frame2State);
    //create timeline
    var timeline:TimelineMax = new TimelineMax({onComplete:onTimelineComplete});
    //add button fade down animation
    timeline.append(new TweenMax(myButton,0.4,{alpha:0}));
    //add content fade up animation
    timeline.append(new TweenMax(frame2State,0.4,{alpha:1}));
    timeline.play();
}

function onTimelineComplete():void
{
    //remove button
    removeChild(myButton);
    myButton = null;
}