×
Namespaces

Variants
Actions
Revision as of 04:33, 5 October 2011 by hamishwillee (Talk | contribs)

Archived:How to make a Flash Lite application running in any screen orientation

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata
Compatibility
Platform(s): Flash Lite 2.x
Article
Created: soueldi (01 Jun 2007)
Last edited: hamishwillee (05 Oct 2011)

Some S60 3rd edition devices permit to switch between portrait and landscape orientations, natively (like N93, N95) or using a third party application.

By default, Flash Lite applications only support one screen size (defined in the Document Properties dialog box).

If an application is launched in a screen size other than that defined, flash player will resize the document and add borders on two sides of the application.

A Flash Lite application in portrait mode
The same application in landscape mode


Using external SWF files

  • Create two SWF files, one is your application optimized for portrait orientation, the other for landscape orientation.
    In this example, we will call them myApp_portrait.swf (240x320) and myApp_landscape.swf (320x240)
A frame optimized for portrait orientation
The same frame optimized for landscape orientation
  • Create a new Flash Lite application (myApp.swf)
  • Change the document length and width to their possible maximum value (here 320x320) using the Document Properties dialog box
    Square size.jpg
  • In the first keyframe of your myApp.fla file add this code:
stop();
 
fscommand2("FullScreen", true);
 
/* Set scaleMode to "noScale" setting: the SWF will not be scaled
when the size of the screen device changes*/

Stage.scaleMode = "noScale";
 
//Set the current alignment of the Flash movie to "Top Left"
Stage.align = "TL";
 
// Create a new movie Clip
this.createEmptyMovieClip("container",this.getNextHighestDepth());
container._x = 0;
container._y = 0;
 
//Detect the screen size and load the correct file
if (Stage.width == 240) {
container.loadMovie("file://E:/Others/myApp_portrait.swf");
} else {
container.loadMovie("file://E:/Others/myApp_landscape.swf");
}
  • Launch myApp.swf, your application will be adapted to the current screen orientation.

In your two swf's files, don't refer to the _root level. Change all your references to _root by the movie clip instance name given in the main SWF (here container)


Using a single SWF file

This method is similar to the preceding one, but instead loading external SWF files, it will load internal movie clips.

  • Create a new Flash Lite application (myApp.swf)
  • Change the document length and width to their possible maximum value (here 320x320) using the Document Properties dialog
  • In the first keyframe, add this code:
stop();
 
fscommand2("FullScreen", true);
 
/* Set scaleMode to "noScale" setting: the SWF will not be scaled
when the size of the screen device changes*/

Stage.scaleMode = "noScale";
 
//Set the current alignment of the Flash movie to "Top Left"
Stage.align = "TL";
 
//Detect the screen size and load the correct movieclip
if (Stage.width == 240) {
_root.attachMovie("portrait_mc","portrait",10);
 
} else {
_root.attachMovie("landscape_mc","landscape",10);
 
}
  • Create a movie clip:
    • Select Insert -> New Symbol... -> Select Movie Clip and give it a name
    • Select Export for ActionScript and set identifier to portrait_mc
Click to enlarge
    • In this movie clip create a layer called background. This layer have to be always in background.
    • In the first keyframe of the background layer, Draw a rectangle with this properties:Shape prop.jpg
      The fill color have to be the same as the document background color. (You can fill it with an another color during development, in order to see their borders.)
    • Create your application optimized for portrait orientation mode in this movie clip. Don't draw anything beside the background rectangle.
  • Repeat all this operations with a "landscape_mc" movie clip and a 320x240 size rectangle.
  • Launch myApp.swf, your application will be adapted to the current screen orientation.
60 page views in the last 30 days.
×