You Are Here:

Community: Wiki

This page was last modified on 2 October 2007, at 18:32.

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

From Forum Nokia Wiki


Compatibility: Flash Lite 2.x

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

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
    Image: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:Image: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.

Download

You can download an example with source code here:

This Flash Lite 2.x application get and show informations about the 5 five latest Nokia devices. It use RSS feeds and XML Flash Lite methods. Latest_Nokia_Devices supporting portrait/landscape modes
Image:Nokia_Latest_Devices.jpg

Related Wiki Articles

No related wiki articles found

Rate This

 
Bookmark this page: DeliciousDiggFacebookGoogleYahooStumbleUponRedditDiigoTechnocratiTwitter  Share this page Share this page Print this Page Print this page Invite a friend Invite a friend
京ICP备05048969号    Email Newsletters Press Terms & Conditions Privacy Policy Sitemap Contact Us © 2009 Nokia 
RDF Facets: qdcZidentifierQSxhttpE3aE2fE2fwikiE2eforumE2enokiaE2ecomE2findeE78E2ephpE2fCS001256E5fE2dE5fE4caunchingE5fanE5finstalledE5fapplicationE5finE5fFlashE5fE4citeX qdcZtypeQUqfnZE45E78cludedFromGeneralE4cistingsQ qdcZtypeQUqfntypeZCommunityContentQ qdcZtypeQUqfntypeZE52esourceQ qdcZtypeQUqfntypeZWebpageQ qdcZtypeQUqfntypeZWikiContentQ qdcZtypeQUqmarsZManagedE52esourceQ qdcZtypeQUqwebZInformationE52esourceQ qdcZtypeQUqwebZPageQ qdcZtypeQUqwebZE52esourceQ qdcZtypeQUqrdfsZE52esourceQ qfnZtopicQUqfnTopicZflashQ qfnZtopicQUqfnTopicZflashE5fliteQ qfnZtypeQUqfntypeZCommunityContentQ qfnZtypeQUqfntypeZE52esourceQ qfnZtypeQUqfntypeZWebpageQ qfnZtypeQUqfntypeZWikiContentQ qmarsZlanguageQUxhttpE3aE2fE2fswE2enokiaE2ecomE2flanguageE2d1E2fenX qrdfZtypeQUqfnZE45E78cludedFromGeneralE4cistingsQ qrdfZtypeQUqfntypeZCommunityContentQ qrdfZtypeQUqfntypeZE52esourceQ qrdfZtypeQUqfntypeZWebpageQ qrdfZtypeQUqfntypeZWikiContentQ qrdfZtypeQUqmarsZManagedE52esourceQ qrdfZtypeQUqwebZInformationE52esourceQ qrdfZtypeQUqwebZPageQ qrdfZtypeQUqwebZE52esourceQ qrdfZtypeQUqrdfsZE52esourceQ
User Rating: qfnZuserE5FratingQNx5E2E0000X