상세 컨텐츠

본문 제목

[AS] actionScript 풀스크린시 화면 사이즈 리사이징, 화면 설정 관련 StageDisplayState.FULL_SCREEN

ADOBE/ ActionScript

by AlrepondTech 2020. 9. 22. 19:09

본문

반응형

 

 

 

 

=================================

=================================

=================================

 

 

 

 

 

출처: http://nekyouto-tech.blogspot.kr/2012/07/as3-toggle-fullscreen.html

 

AS3 : Toggle Fullscreen

 

The other day, friends were asking me how to do full screen popup for flash. So here I am with a simple demo for creating a full screen swf popup. (Note: the full screen popup can only be trigger by a generic mouse click only.)

Time for some coding... The main as file for the swf - Main.as

package com.zcs

{

    import flash.events.Event;

    import flash.display.MovieClip;

    import flash.events.MouseEvent;

    import flash.display.StageDisplayState;

    public class Main extends InterfaceSetup implements IInterfaceSetup

    {

        private
        var _top_mc: MovieClip;

        private
        var _bottom_mc: MovieClip;

        private
        var _left_mc: MovieClip;

        private
        var _right_mc: MovieClip;

        private
        var _cover_mc: MovieClip;

        public
        function Main(): void

        {

            // constructor code

        }

        //Override the stage variables

        override public
        function setupStageEvent(event: Event): void

        {

            super.setupStageEvent(event);

            stageWidthF = 600;

            stageHeightF = 400;

            _top_mc = this.getChildByName("top_mc") as MovieClip;

            _bottom_mc = this.getChildByName("bottom_mc") as MovieClip;

            _left_mc = this.getChildByName("left_mc") as MovieClip;

            _right_mc = this.getChildByName("right_mc") as MovieClip;

            _cover_mc = this.getChildByName("cover_mc") as MovieClip;

            _cover_mc.buttonMode = true;

            _cover_mc.addEventListener(MouseEvent.CLICK, clickEvent);

            resizeEvent();

        }

        //Upon Screen Resize....

        override public
        function resizeEvent(event: Event = null): void

        {

            //Scale and position the MovieClip accordingly

            resizeSubFunc(_top_mc, "50%", "l", "0", "t", 1);

            resizeSubFunc(_bottom_mc, "50%", "l", "0", "b", 1);

            resizeSubFunc(_left_mc, "0", "l", "50%", "t", 1);

            resizeSubFunc(_right_mc, "0", "r", "50%", "t", 1);

            resizeSubFunc(_cover_mc, "0", "l", "0", "t", 1);

        }

        private
        function clickEvent(event: Event): void

        {

            toggleFullScreen();

        }

        private
        function toggleFullScreen(): void

        {

            //if normal size, go to fullscreen, else go to normal size

            if (stage.displayState == StageDisplayState.NORMAL) {

                stage.displayState = StageDisplayState.FULL_SCREEN;

            } else {

                stage.displayState = StageDisplayState.NORMAL;

            }

        }

    }

}

 

This is an simple as file that I have been using for reusing some screen resize functions - InterfaceSetup.as

package com.zcs

{

    import flash.display.MovieClip;

    import flash.events.*;

    import flash.system.*;

    import flash.external.*;

    public class InterfaceSetup extends MovieClip implementsIInterfaceSetup

    {

        public
        var stageWidthF;

        public
        var stageHeightF;

        public
        function InterfaceSetup(): void

        {

            this.addEventListener(Event.ADDED_TO_STAGE, setupStageEvent);

        }

        //setup the stage after this is added to stage and listen for resize of flash file

        public
        function setupStageEvent(event: Event): void

        {

            this.removeEventListener(Event.ADDED_TO_STAGE, setupStageEvent);

            stageWidthF = 1024;

            stageHeightF = 768;

            stage.addEventListener(Event.RESIZE, resizeEvent);

        }

        //resize event

        public
        function resizeEvent(event: Event = null): void

        {

        }

        //sub resize function that requires the following variables

        //tempMC = the movieclip lo :P

        //tempPosX, the x position (ex: 0 || 50%)

        //Hdir, from l (left) or r (right)

        //tempPosY, the y position (ex: 0 || 50%)

        //Vdir, from t (top) or b (bottom)

        public functionresizeSubFunc(tempMC, tempPosX, Hdir, tempPosY, Vdir, scaleByScreen = 0): void

        {

            var strArray;

            if (scaleByScreen == 1) {

                tempMC.scaleX = (stage.stageWidth / stageWidthF) * 1;

                tempMC.scaleY = (stage.stageHeight / stageHeightF) * 1;

            } else if (scaleByScreen == -1) {

                tempMC.scaleX = (stage.stageHeight / stageHeightF) * 1;

                tempMC.scaleY = (stage.stageWidth / stageWidthF) * 1;

            }

            if (Hdir == "l") {

                tempMC.x = -1 * ((stage.stageWidth - stageWidthF) / 2);

                if (String(tempPosX).indexOf("%") != -1)

                {

                    strArray = String(tempPosX).split("%");

                    tempMC.x += (int(strArray[0]) / 100) * stage.stageWidth;

                } else {

                    tempMC.x += Number(tempPosX);

                }

            } else {

                tempMC.x = stageWidthF + ((stage.stageWidth - stageWidthF) / 2);

                if (String(tempPosX).indexOf("%") != -1)

                {

                    strArray = String(tempPosX).split("%");

                    tempMC.x -= (int(strArray[0]) / 100) * stage.stageWidth;

                } else {

                    tempMC.x -= Number(tempPosX);

                }

            }

            if (Vdir == "t") {

                tempMC.y = -1 * ((stage.stageHeight - stageHeightF) / 2);

                if (String(tempPosY).indexOf("%") != -1)

                {

                    strArray = String(tempPosY).split("%");

                    tempMC.y += (int(strArray[0]) / 100) * stage.stageHeight;

                } else {

                    tempMC.y += Number(tempPosY);

                }

            } else {

                tempMC.y = stageHeightF + ((stage.stageHeight - stageHeightF) / 2);

                if (String(tempPosY).indexOf("%") != -1)

                {

                    strArray = String(tempPosY).split("%");

                    tempMC.y -= (int(strArray[0]) / 100) * stage.stageHeight;

                } else {

                    tempMC.y -= Number(tempPosY);

                }

            }

            tempMC.x = Math.ceil(tempMC.x);

            tempMC.y = Math.ceil(tempMC.y);

        }

    }

}

 

A simple Interface file - IInterfaceSetup.as

package com.zcs

{

    import flash.events.Event;

    public interface IInterfaceSetup

    {

        // Interface methods:

        function setupStageEvent(event: Event): void;

        function resizeEvent(event: Event = null): void;

    }

}

 

Main HTML file - main.html

<html>

<head>

    <style type="text/css">
        <!--
        html {
            height: 100%
        }

        body {

            margin-left: 0px;

            margin-top: 0px;

            margin-right: 0px;

            margin-bottom: 0px;

            background-color: #000;

        }

        #flashContent {
            width: 100%;
            height: 100%;
        }
        -->

    </style>


    <!-- Include support librarys first -->

    <script type="text/javascript" src="jsScript/swfobject.js"></script>

    <script type="text/javascript" src="jsScript/swfforcesize.js"></script>

    <script type="text/javascript" src="jsScript/swfaddress.js?tracker=null"></script>


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

</head>

<body>

    <table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">

        <tr>
            <td align="center">

                <div id="flashContent">

                    <h1>You need at least Flash Player 10.0 to view this page.</h1>

                    <p><a href="http://www.adobe.com/go/getflashplayer">
                            <imgsrc="http: //www.adobe.com/images/shared/download_buttons/get_flash_player.gif"alt="Get Adobe Flash player" />
                        </a></p>

                </div>

                <script type="text/javascript">
                    function createSWF() {

                        var now = new Date();

                        now = Date.UTC(now.getYear(), now.getMonth(), now.getDate(), now.getHours(), now.getMinutes(), now.getSeconds());

                        var swfURL = "swf/main.swf?date=" + now;

                        var flashvars = {};

                        var params = {
                            bgcolor: "#FFFFFF"
                        };

                        //Need to set allowfullscreen to "true"

                        params.allowfullscreen = "true";

                        //By changing scale to "exactFit" will make the swf

                        //fill up all the spaces in the browser window

                        params.scale = "exactFit";

                        var attributes = {};

                        attributes.name = "flashContent";

                        swfobject.embedSWF(swfURL, "flashContent", "100%", "100%", "10.0.2", null, flashvars, params, attributes);

                    }

                    createSWF();
                </script>

            </td>
        </tr>
    </table>

</body>

</html>

* Click here for the demo.
(Click on any part of the flash file to show the full screen popup.)
^ Click here for the source files of the demo.

 

 

=================================

=================================

=================================

 

 

출처: http://v2.scriptplayground.com/tutorials/as/Center-a-movieclip-on-stage-resize-in-AS3/

Center a movieclip on stage resize in AS3

Learn how to center a movieclip any time the stage updates. This example will be for when the user resizes the browser window, but you can adapt the technique to any number of actions.

View an Example of this article before you get started.

If you want to skip the overall article explanation here is the completed code.

Have you ever seen a web site that is 100% Flash? This of course being a web site that the entire browser contents is in fact a Flash movie. Well I am sure you have seen the effect a lot of them have when you resize the browser, you know, when the movie rebuilds or aligns itself any time the window is resized.

Well in this mini article I am going to show you a very quick and simple way to create this effect

Start off by creating a new movieclip instance, placing it on the stage and giving it an instance name of "mySampleMC".

Once you have the movieclip on the stage you can open the Actions panel (F9 on win, ALT+F9 on mac) to begin building the script

In the Flash editor you do not need to import the classes, however to use this code in an external editor or Flex you need to, so for completeness, lets do that

import flash.display.StageAlign; import flash.display.StageScaleMode; import flash.events.Event;

Now that the classes are imported, you can create the function that will do the resizing. This function will be called by the stage Event handler.

function resizeHandler(e:Event):void { mySampleMC.x = (mySampleMC.stage.stageWidth / 2) - (mySampleMC.width / 2); mySampleMC.y = (mySampleMC.stage.stageHeight / 2) - (mySampleMC.height / 2); }

The next step is to assign the resize event to the stage.

stage.addEventListener(Event.RESIZE, resizeHandler);

The last step is to add the proper resizing constraints to allow this event to fire off.

stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE;

Now you can publish the movie by going to File > Publish Settings and change the width/height to 100% or test the movie in the Flash editor. When you resize the movie you should see the clip center on the window, until you resize past the point of the clip, then it will disappear.

At this point the example is complete, however you may have noticed the movieclip is centered until the stage event is called. Normally this is a problem because the movie will start off not centered. That being said, ActionScript has a method of the EventHandlerdispatchEvent(). What this method lets you do is create an event on your own, without waiting for the assigned item to cause it.

The syntax of this method expects a new Event to be created, passing in the proper event name as an argument.

stage.dispatchEvent(new Event(Event.RESIZE));

You may be asking why you can't just call the resizeHandler function directly, and the truth is, you can. This is just a much cleaner and less "hackish" way to accomplish the calling of an event. You will see this dispatchEvent method used more for forcing custom errors in larger applications.

Here is the completed resize example for easy copy+pasting. I hope you enjoyed this and all the other tutorials on this site!

import flash.display.StageAlign; import flash.display.StageScaleMode; import flash.events.Event; function resizeHandler(e:Event):void { mySampleMC.x = (mySampleMC.stage.stageWidth / 2) - (mySampleMC.width / 2); mySampleMC.y = (mySampleMC.stage.stageHeight / 2) - (mySampleMC.height / 2); } stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; stage.addEventListener(Event.RESIZE, resizeHandler); stage.dispatchEvent(new Event(Event.RESIZE));

As a side note, I wanted to let the readers know I am in the process of wrapping up my book on Flash and PHP. Once it is available I recommend you pick it up, as the contents of the book is about working with Flash and PHP to develop real world applications while starting off with the fundamentals so anyone can follow the material. The book is available onAmazon as a pre-order.

 

 

=================================

=================================

=================================

 

 

반응형


관련글 더보기

댓글 영역