This document discusses philosophies and techniques for optimizing Flex applications for mobile devices. It covers topics like screen size and orientation, user input methods, application lifecycle management, performance optimizations like reducing memory usage and bitmap processing, use of layout managers like BasicLayout and ConstraintLayout, and mobile-specific views and components. Technical recommendations include preferring BitmapImage over Image, using ContentCache for images, FXG graphics, and view-based architecture.

1. Flex Mobile Tuning
www.flashr.org Flex Mobile Tuning 1

2. Flex for Mobile – što nas muči
 Filozofija
 Tehnika
www.flashr.org Flex Mobile Tuning 2

3. Filozofija - ekran
 veličina
 različite dimenzije
 <autoOrients>
 <autoOrients> i tipkovnica
 StageWebView
www.flashr.org Flex Mobile Tuning 3

4. Filozofija - input
 TextInput
 TouchEvent
 GestureEvent
Multitouch.inputMode =
MultitouchInputMode.GESTURE
MultitouchInputMode.TOUCH_POINT
 GPS
 Akcelerometar
www.flashr.org Flex Mobile Tuning 4

5. Filozofija – foto / video input
 Camera class
 CameraUI and CameraRoll klase
 MediaEvent i MediaPromise
www.flashr.org Flex Mobile Tuning 5

6. Filozofija – životni put aplikacije
 Rad u pozadini i izlaz
 “Manual” početak i kraj
 Battery low
 Android background behavior
 iOS background behaviour
www.flashr.org Flex Mobile Tuning 6

7. Filozofija – performanse
 Startup zadaci
 Rendering – BitmapData.draw()
 Memorija
 Background memory management
X = null
www.flashr.org Flex Mobile Tuning 7

8. Tehnikalije – itemRendereri
 LabelItemRenderer
 IconItemRenderer
createChildren
measure
drawBackground
layoutContents
data setter
www.flashr.org Flex Mobile Tuning 8

9. Tehnikalije – slikice
 BitmapImage ispred Image
 Images – ContentCache
 Multiresolution images
 PNG ispred JPG
 Styling
 FXG + ActionScript skinning
www.flashr.org Flex Mobile Tuning 9

10. Tehnikalije – Layouts
 Out:
 HorizontalLayout
 VerticalLayout
 In:
 BasicLayout
 ConstraintLayout
www.flashr.org Flex Mobile Tuning 10

11. Tehnikalije – BasicLayout
<s:BitmapImage id="icon" top="10" left="5" width="32"
height="32" />
<s:Label id="nameLabel" left="40" right="5" top="15"
bottom="15" fontSize="12"/>
<s:Label id="phoneNumberLabel" left="40" right="5"
top="30" bottom="15" fontSize="10"/>
www.flashr.org Flex Mobile Tuning 11

12. Tehnikalije – ConstraintLayout
<s:layout>
<s:ConstraintLayout>
<s:constraintColumns>
<s:ConstraintColumn id="leftPaddingColumn" width="5"/>
<s:ConstraintColumn id="iconColumn" width="32"/>
....
</s:constraintColumns>
<s:constraintRows>
<s:ConstraintRow id="topPaddingRow" height="10"/>
<s:ConstraintRow id="firstRow" height="16"/>
</s:constraintRows>
</s:ConstraintLayout>
</s:layout>
<s:BitmapImage id="icon" left="iconColumn:0" top="firstRow:0" width="32"
height="32"/>
<s:Label id="nameLabel" left="textColumn:0" right="textColumn:0"
top="firstRow:5" fontSize="12"/>
<s:Label id="phoneNumberLabel" left="textColumn:0" right="textColumn:0"
bottom="secondRow:2" fontSize="10"/>
www.flashr.org Flex Mobile Tuning 12

13. Tehnikalije – Groups
 Out:
 BorderContainer
 In:
 Group
 FXG grafika
www.flashr.org Flex Mobile Tuning 13

14. Tehnikalije – Views
 set data umjesto creationComplete
 Broj procesiranja
 Manje bindinga
 viewActivate server-side calls
 includeIn
 excludeFrom
www.flashr.org Flex Mobile Tuning 14

15. Tehnikalije – informacije
http://www.adobe.com/devnet/air/articles/considerations-air-apps-mobile.html
http://www.adobe.com/devnet/flex/articles/flex-mobile-performance-checklist.html
http://www.adobe.com/devnet/flash/articles/optimizing-mobile-performance.html
www.flashr.org Flex Mobile Tuning 15