MACROMEDIA FLASH 8-DEVELOPING FLASH LITE 2.X, Develop Manual

Page 1: ...Developing Flash Lite Applications...

Page 2: ...edia Inc Opera browser Copyright 1995 2002 Opera Software ASA and its suppliers All rights reserved Macromedia Flash 8 video is powered by On2 TrueMotion video technology 1992 2005 On2 Technologies In...

Page 3: ...rking with Text and Fonts 31 About text in Flash Lite 31 Using input text fields 34 Font rendering methods in Flash Lite 38 Flash Lite rendering quality and anti aliased text 39 Embedding font outline...

Page 4: ...sh Lite error and warning messages Flash Professional Only 74 Selecting test devices and Flash Lite content type Flash Professional Only 76 Flash Lite content types Flash Professional Only 78 Determin...

Page 5: ...following new features to help developers create Flash Lite applications Flash Lite emulator The Flash Lite emulator lets you preview your content as it will function on an actual device The emulator...

Page 6: ...lash 4 ActionScript upon which Flash Lite 1 x ActionScript is based The Flash Lite sample applications demonstrate key concepts and best practices discussed or mentioned in the written documentation A...

Page 7: ...Tab navigation in Flash Lite works only with buttons and input text fields it is typically best used for simple user interactions such as menus For more information see Using tab navigation in Flash...

Page 8: ...to move a character on the screen and then press the Select key to perform another action such as make the character jump Flash Lite supports the following keys on mobile devices Five way keypad keys...

Page 9: ...tion in Flash Lite works with buttons and text fields When an input text field has focus and the user presses the Select key Flash Lite opens the device s generic text input dialog box in which the us...

Page 10: ...w the rightmost object with focus focus moves to the top and leftmost object The Up key moves focus to the next object on the left If there are no objects to the left of the current object with focus...

Page 11: ...tions defines the part of the button that responds to mouse clicks For input text fields the focus rectangle s bounding box is determined by the text field s dimensions You can disable the default foc...

Page 12: ...ut text field has focus but not when a button has focus Attach this code to each button on the Stage on rollOver _focusRect false on rollOut _focusRect true For more information about using input text...

Page 13: ...orts the Up and Down Arrow keys on the 5 way keypad On devices that support four way navigation Flash Lite supports the Up Down Left and Right Arrow keys On devices that support the SetSoftKeys comman...

Page 14: ...ion lets the user move a circle around the Stage by pressing the four arrow keys on their device You can find a completed version of this application key_catcher fla in the Samples folder on your hard...

Page 15: ...convert it to a movie clip 4 With the new movie clip selected in the Property inspector type circle in the Instance Name text box 5 Using the Text tool create a text field that contains the text key...

Page 16: ...13 but it offers some advantages Control over tab order Rather than tab order being determined by the Flash Lite player as with buttons you the developer can decide what object has focus and how it re...

Page 17: ...It contains a dynamic text field to display the menu item s label and a red background graphic The text field and background graphic extend across all frames in the movie clip s Timeline The following...

Page 18: ...ssage about the menu item that is currently selected 9 In the Timeline select the first frame on the layer named Actions 10 Open the Actions panel Window Actions and enter the following code Initializ...

Page 19: ...ariable and turn on highlight for new selection selectedItem tellTarget menu_ add selectedItem gotoAndStop over Update status text field with label of selected item currentLabel eval menu_ add selecte...

Page 20: ...imple menu using buttons and tab navigation Flash Professional Only on page 22 To create a button event handler script 1 Create a new document from the Flash Lite 1 1 Series 60 device template and sav...

Page 21: ...selected on the Stage open the Actions panel and enter the following code on press trace You pressed Button 2 on release trace You released Button 2 on rollOver trace Button 2 has focus on rollOut tra...

Page 22: ...nding button and when the user selects the menu item by pressing the Select key on their device For more information about handling button events in Flash Lite see Handling button events Flash Profess...

Page 23: ...ons vertically as the following image shows 7 In the Tools palette select the Text tool and create a text field along the bottom of the Stage This text field displays a short message when the user rol...

Page 24: ...select Sports on press status You selected Sports 12 Select the Weather button and type the following code in the Actions panel on rollOver status Press to select Weather on press status You selected...

Page 25: ...plication in the emulator Click the Down Arrow key on the emulator with your mouse or press the Down Arrow key on your computer s keyboard to navigate between menu options to select a menu item click...

Page 26: ...ee SetSoftKeys in Flash Lite 1 x ActionScript Language Reference Subsequently Flash Lite generates a PageDown event when the user presses the Right soft key and a PageUp event when the user presses th...

Page 27: ...ible Consequently in full screen mode applications you must create your own soft key labels as the following image shows To use the soft keys in an application 1 Create a new document from the Flash L...

Page 28: ...t and Right soft keys Your document s Stage should look like the following image 7 With the status text field still selected in the Property inspector type status in the Var text box 8 Create a key ca...

Page 29: ...l screen mode In this case the application uses the FullScreen command see FullScreen in Flash Lite 1 x ActionScript Language Reference to force the application to display in full screen mode Conseque...

Page 30: ...30 Creating Interactivity and Navigation...

Page 31: ...ring playback For example you might use static text fields to display page titles or labels For more information about creating a static text field see Text field example application Flash Professiona...

Page 32: ...outlines in SWF files on page 40 Text features in Flash Player not supported in Flash Lite 1 x Text fields in Flash Lite do not support the following features available in desktop versions of Flash P...

Page 33: ...r underscore or dollar sign 4 In the Timeline select Frame 1 on the layer named ActionScript 5 Open the Actions panel Window Actions and enter the following code nameVar George Washington 6 Test the a...

Page 34: ...first give an input text field focus and then press their device s Select key By default Flash Lite draws a yellow rectangle around the input text field that has focus The text input dialog box is mo...

Page 35: ...on see Text field example application Flash Professional Only on page 42 Types of input text fields Flash Lite supports single line multiline and password input text fields You specify an input text f...

Page 36: ...han can display The following image shows a device s input text dialog box for a single line input text field When a user edits a multiline input text field the device s input text dialog box expands...

Page 37: ...ble to enter numeric values in the text fields For more information see SetInputTextType in Flash Lite 1 x ActionScript Language Reference Input text fields and the focus rectangle By default Flash Li...

Page 38: ...at small point sizes such as 10 points or smaller This option requires that you include font outlines in the published SWF file for the selected font for more information see Embedding font outlines...

Page 39: ...ndering quality setting for more information see Flash Lite rendering quality and anti aliased text on page 39 This option requires that Flash embed font outlines in the published SWF file for more in...

Page 40: ...d s font appears the same on all target platforms but results in larger file size Flash Lite requires font outlines to render either bitmap no anti alias or anti aliased text For static text fields th...

Page 41: ...or Anti Alias for Animation from the Font rendering method pop up menu 3 Click the Embed button located next to the Font rendering method menu to open the Character Embedding dialog box 4 Select the...

Page 42: ...d example application 1 In Flash create a new document from the Flash Lite 1 1 Symbian Series 60 device template For more information about creating documents from device templates see Using Flash Lit...

Page 43: ...a message that contains the name the user enters in the input text field 12 With the new text field selected in the Property inspector type message in the Var text box select Dynamic from the Text Ty...

Page 44: ...e to test the application in the emulator a Press the Down arrow on the emulator s keypad to give the input text field focus b Press the Select key on the emulator to open the emulator s text input di...

Page 45: ...e in a text block you can get and set its value For example the following code scrolls the text field whose variable name is story_text down by five lines story_text scroll 5 The maxscroll property sp...

Page 46: ...oximately the size shown in the following image on the Stage 3 Select Multiline from the Line type pop up menu in the Property inspector 4 Select Dynamic Text from the Text Type pop up menu in the Pro...

Page 47: ...st Movie to test the application in the Flash Lite emulator Press the Up and Down Arrow keys on your keyboard or the Up and Down buttons on the emulator s keypad to scroll the text up or down For simp...

Page 48: ...48 Working with Text and Fonts...

Page 49: ...I or MFi To play the device sound Flash Lite passes the sound data to the device which then decodes and plays the sound Flash Lite cannot synchronize device sounds with animation Flash Lite 1 0 suppor...

Page 50: ...orted format such as MP3 WAV or AIFF You then link the proxy sound to an external mobile device sound such as a MIDI file During the document publishing process the proxy sound is replaced with the li...

Page 51: ...ou then associate the device sound that you want to play with the proxy sound A completed version of the application named button_sound_complete fla is located in the flash_install_dir Tutorials and S...

Page 52: ...o Sound 10 Select the Down frame in the Sound layer and press the F6 function key to insert a new keyframe 11 With the new keyframe selected in the Timeline in the Property inspector select proxy wav...

Page 53: ...constraint One way is to attach the sound to the Down frame in a button symbol s timeline When the button has focus and the user presses the Select key on their device Flash Lite plays the sound in th...

Page 54: ...ication can contain the same sound represented in both MIDI and MFi formats You can play this Flash application both on a device that supports only MIDI and on a device that supports only MFi with eac...

Page 55: ...r part of the Sound Bundler window is a list of the files you added to the sound bundle The lower part of the window contains information about the sounds in the sound bundle including sound format si...

Page 56: ...und formats supported by Flash Lite 1 0 Native sound in Flash Lite 1 1 can play either as event sound or synchronized sound see Event and stream synchronized sound on page 50 The general workflow for...

Page 57: ...ile phones this limit is not less than 1 MB Because Macromedia Professional 8 does not provide a way to check a phone s runtime memory consumption Macromedia strongly recommends that you test all cont...

Page 58: ...ets the rendering quality to LOW _quality LOW For more information about SetQuality command see SetQuality in Flash Lite 1 x ActionScript Language Reference Limit the number of simultaneous tweens Red...

Page 59: ...ht balance of CPU versus file size and runtime memory requirements in your development Whenever possible do not use strokes on your vector shapes because it increases the number of rendered lines Sett...

Page 60: ...the Lossless PNG GIF option for images with simple shapes and a few colors This option compresses the image with lossless compression in which no data is discarded from the image 5 Click Test to deter...

Page 61: ...second Among devices that support Flash Lite as of this writing most play back Flash Lite content at about 8 to12 frames per second fps On devices with the slowest processors the frame rate can be as...

Page 62: ...62 Optimizing content for performance and file size...

Page 63: ...iew of Flash Lite testing features Flash Professional Only 63 Using the Flash Lite emulator Flash Professional Only 66 Flash Lite error and warning messages Flash Professional Only 74 Selecting test d...

Page 64: ...different test device and change the level of debugging information that the emulator generates The emulator displays debugging messages in the Output panel to help you troubleshoot problems with you...

Page 65: ...at features are available to your application such as supported audio formats ability to make network connections and other features When you test your application the emulator displays messages in th...

Page 66: ...rofessional Only on page 70 About screen size and available Stage size Flash Professional Only on page 72 Testing features not supported in the Flash Lite test window Flash Professional Only on page 7...

Page 67: ...rofessional Only The Test Device pop up menu in the emulator settings pane lets you select a different test device in which to preview your content The test devices listed in the Test Device pop up me...

Page 68: ...evice pop up menu says None Selected and Flash displays a warning message where the emulator normally appears To open the Device Settings dialog box and select your test devices without leaving the Fl...

Page 69: ...ng and Error Messages Flash Professional Only on page 85 When the Information debug option is selected the emulator also outputs the platform capabilities for the selected device and content type This...

Page 70: ...tate the entire emulator to view it as a user would actually view it on the device The following image shows the Flash Lite emulator after it has been rotated 90 in the counter clockwise direction To...

Page 71: ...he content as viewed in the Flash Lite emulator at normal magnification level The image on the right shows a portion of the same content zoomed to 400 To zoom in or out on the Flash Lite emulator do o...

Page 72: ...ixels of available Stage area If a SWF file s Stage size is different than the available Stage size the Flash Lite player scales the content proportionately to fit within the available Stage area When...

Page 73: ...applications running on an actual device For example the emulator doesn t support the ability to initiate phone calls or SMS messages If you attempt to use a command or feature that isn t supported b...

Page 74: ...warning message in the Output panel alerting you as the following image shows For a full list of debugging messages and their descriptions see Appendix Flash Lite emulator error and information messa...

Page 75: ...cript Stuck The emulator has detected that certain ActionScript code in the SWF file is taking too long to execute As a result the emulator has stopped executing the ActionScript code 5 ActionScript P...

Page 76: ...load and install an updated list of devices and content types from the Flash Lite Device Updater page at www macromedia com go mobileupdate You can also click the Check for New Devices link located at...

Page 77: ...list of available devices on the left to the list of test devices on the right To add a single test device select it and click Add To select all the devices in a specific folder select the folder and...

Page 78: ...th Flash Lite 5 Click Make Default to make the currently selected content type and test devices the default device settings Flash automatically applies the default device settings to any new document...

Page 79: ...o play for the device s alarm KDDI and Vodafone Japan only Browser Uses Flash Lite to render Flash content embedded in mobile web pages and viewed in the device s web browser NTT DoCoMo KDDI and Vodaf...

Page 80: ...from Standby mode This is similar to the Wake Up Screen content type on other devices KDDI Casio devices only Screen Saver Uses Flash Lite to display the device s screen saver KDDI and Vodafone Japan...

Page 81: ...1 0 on page 53 DeviceSoundsOrdered A comma delimited list of device sound formats that the platform supports The order of the sound formats indicates what sound Flash Lite plays if a SWF file contain...

Page 82: ...ssed from the Flash Lite player to the device for playback Possible values NativeSound_PCM NativeSound_ADPCM and NativeSound_MP3 NavigationType Indicates the navigation mode supported by the platform...

Page 83: ...are handled mouseType Indicates what mouse events are supported by Flash Lite Valid values are as follows None No mouse events are supported Partial The press release rollOver and rollout events are s...

Page 84: ...84 Testing Flash Lite Content Flash Professional Only...

Page 85: ...owing table lists all the information messages that the Flash Lite emulator reports Error code Message Description FTPA002 FSCommand is ignored The emulator detected an fscommand function call which i...

Page 86: ...erty For more information see the entry for the specified property in Flash Lite 1 x ActionScript Language Reference FTPA009 startDrag and stopDrag are not supported The emulator detected a startDrag...

Page 87: ...lator detected that there was more than one fscommand so only the first command is processed the others are ignored FTPA020 The call to FSCommand with arguments command arguments was ignored because i...

Page 88: ...compressed with MP3 compression which is not supported by the selected content type on this device No modifications are made to the device specific SWF file this is just a warning FTPS024 MIDI sounds...

Page 89: ...device Test your SWF file on an actual device to see if the command functions as expected FTPS033 A call to loadVariables URL found limitations might apply The emulator detected a loadVariables funct...

Page 90: ...ion For more information see Modes of tab navigation on page 9 FTPS049 Four Way Navigation with wraparound is not supported for this device The currently selected test device and content type supports...

Page 91: ...content type on this device The emulator detected a MFI device sound with a Panasonic extension which is not supported by the selected content type on this device FTPS074 MFI sounds with Sharp extens...

Page 92: ...FSCommand2 SetSoftKeys to enable this key You pressed one of the soft keys on the emulator s keypad without first calling the SetSoftKeys command For more information see Using the soft keys Flash Pro...

Page 93: ...pplications with 66 rotating 70 warning and error messages 74 85 zooming 70 Flash Lite rendering quality and text fields 39 default rendering quality 39 font rendering methods about 38 applying to tex...

Page 94: ...oft keys SetSoftKeys command 26 using 26 sound about 49 compound 54 device 50 device and native 49 event and streaming 50 Sound Bundler utility 54 Sound Bundler utility using for compound sounds 54 St...