|
Tutorials ActionScript 2.0 ActionScript 3.0 |
Fullscreen - AS3 Notes: This tutorial covers HTML changes as well. Flash requires an HTML to be in opened in your browser and load an SWF for it to go into full screen mode. 1. Create a - Flash File(ActionScript 3.0) 2. In the tool bar select the Rectangle Tool, and draw a rectangle on the stage. 3. Click on the rectangle with your Select Tool, the black arrow in the tool bar, and press F8. 4. Name the symbol btnObject, and make sure the type is Movie Clip. There are 3 types of symbols: Movie Clip - This is so you can make even more states for your button, complex animations, and other niffty things. Button - Inside the object are button states. Up (which is default), over (for mouse over), down (for if you click and hold on a button), and hit (the hit box area of the button). Graphic - This is just lock the object, and makes it easy to drag from the library, which you can't do with grouped objects. 5. In the Linkage section of the Convert to Symbol window, make sure there is a check mark in the Export to ActionScript check box, then click Ok. 6. A window with the title ActionScript Class Warning will pop up saying it is going to auto generate the movie clip to the stage when you publish it as a SWF, click Ok. 7. With the Movie Clip still selected, go to the Properties tab, and in the Instance name text box type Btn. 8. Now go to your Actions tab, you can do this by pressing F9, or going to Window - Actions in your menu bar. 9. In your Actions tab type: A. Btn.addEventListener(MouseEvent.CLICK, fullScreen);
Btn is just calling the instance name of your Movie Clip. addEventListener is telling flash to look for something to happen with the movie clip. MouseEvent is telling flash that the event listener is looking for a mouse event. CLICK it telling it that it is looking for the mouse to click. fullScreen is the function that is being called when the mouse is clicked on the movie clip. B. function fullScreen(event:MouseEvent):void {
function just declares you are starting a function. fullScreen is the name of the function. event:MouseEvent goes with the code above to link the two together. void this is saying we are not returning any values with our function. C. stage.displayState=StageDisplayState.FULL_SCREEN;
}
stage.displayState is just calling the display state of the stage for us to change it. StageDisplayState.FULL_SCREEN is changing the display state to full screen. Complete Code:
Btn.addEventListener(MouseEvent.CLICK, fullScreen);
function fullScreen(event:MouseEvent):void { stage.displayState=StageDisplayState.FULL_SCREEN; } 10. In your menu bar go to File - Save As to save your project. Name is fullScreen.fla, and click save. 11. Now go to File Publish to publish your file. 12. Go to where you saved your file at, and open fs.html in a text editor. 13. In the HTML you want to change all of the allowFullScreen and fullScreen values from false to true. This includes: Changing 'allowFullScreen', 'false' to 'allowFullScreen', 'true' between the script tags, to , and in the embed tag allowFullScreen="false" to allowFullScreen="true". 14. In your text editor, save the changes, typically with control S. 15. Now open your HTML files in your normal browser. Click on your button, and it should go full screen. Just remember to press ESC to close the full screen mode. |
|
|
|