FITC Android for Flashers


Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

FITC Android for Flashers

  1. 1. Android for Flash (Lite) Developers Weyert de Boer 14 September 2009, FITC Mobile 2009, Toronto Sunday, September 6, 2009
  2. 2. About Me Weyert de Boer Interaction Designer Co-Author of books about Flash Lite and AIR Flash Lite since Early 2005 Worked on Flash-based UIs for Motorola, T- Mobile and Vodafone Sunday, September 6, 2009
  3. 3. The Application This session is about a Flash Lite application converted earlier this year to Android. It’s a simple application where you can get a list of articles and photos near the current location using the GPS. And my experience about the conversion process. Sunday, September 6, 2009
  4. 4. The Application Sunday, September 6, 2009
  5. 5. Live! Sunday, September 6, 2009
  6. 6. Going Native? Why? Why not wait until next month for the Flash Player 10 ? Sunday, September 6, 2009
  7. 7. The Good, the Bad and The Ugly Sunday, September 6, 2009
  8. 8. The Good Developer oriented instead of designer Flex-like ready-to-use components library (like buttons, listviews, grids etc). You can easily reuse your pngs/image assets of your Flash Lite apps Good on-device debugging support instead of Flash’s black box Better memory management compared to Flash Easy access the hardware of the mobile device. Sunday, September 6, 2009
  9. 9. The Bad Compared to Flash the animation support is limited and basically only supports code-based tweens and film roll like frame-by-frame animations. No timeline! Way of designing interfaces using layouts has a learning curve User interfaces are limited to 16-bit colours and use 565 dithering. No real interface or layout designer comes with the SDK only a limited viewer. Sunday, September 6, 2009
  10. 10. The Ugly A nasty bug in the Android 1.5 / Cupcake can cause a lot of lost time. If you ever used transparent colour (#00000000, rgba) in your layout. Blacks (#000000) is not black any more, you should use #000001. Sunday, September 6, 2009
  11. 11. Android Fundamentals AndroidManifest.xml Activities Intents Broadcast receivers Sunday, September 6, 2009
  12. 12. AndroidManifest.xml AndroidManifest.xml describes the elements of the Android application, which permissions are needed? Which screens/activities does the application have? Sunday, September 6, 2009
  13. 13. Activities An activity is a single, focused thing that the user can do. Almost all activities interact with the user, so the Activity class takes care of creating a window for you in which you can place your user interface. Sunday, September 6, 2009
  14. 14. Intents An intent describes what you would like to do. For example, an intent can be that you want to view a page in the browser or pick a person from the address book. A specific interaction moment. Intents are the way to show the activity. Sunday, September 6, 2009
  15. 15. Broadcast receivers A way to receive events or notifications from the Android system. This way your application can be notified when the user is back, like when he disabled the keyboard lock, or when a SMS message has been received. Sunday, September 6, 2009
  16. 16. Interfaces from the Flasher’s Eye Android’s version of the movieclip is the View or ViewGroup (can contain children) and the building blocks for UI components. Views are responsible for drawing and handling key events similar to the movieclips Sunday, September 6, 2009
  17. 17. Designing interfaces You can use a declarative xml format to define your screens (so called layout xmls) or code up yourself in Java (similar to Flex MXML) Android comes with nice layout mechanism to organize child views with. You need to use the setContentView()-method to load layouts defined in xml files into an activity. Sunday, September 6, 2009
  18. 18. Examples in the Application Sunday, September 6, 2009
  19. 19. Menu Screen ImageButton ImageView Sunday, September 6, 2009
  20. 20. Photos Screen GridView PhotoItem layout Sunday, September 6, 2009
  21. 21. PhotoItem in Flash Frame Overlay Photo Background Sunday, September 6, 2009
  22. 22. PhotoItem in Android Background Photo Frame Overlay Sunday, September 6, 2009
  23. 23. Warning! Code snippets will be shown now! Little timesavers for starters Sunday, September 6, 2009
  24. 24. Tips and Tricks Timesavers, things every Flash Lite developer wants to know when starting with Android development. Sunday, September 6, 2009
  25. 25. Android’s GetURL As by most other things in Android you have to use an intent. Opening a page in the default web browser of the device. Intent i = new Intent( Intent.ACTION_VIEW, Uri.parse("") ); startActivity(i); Sunday, September 6, 2009
  26. 26. Showing a different screen or activity Intent mainIntent = new Intent(MainMenu.this, ArticlesScreen.class); startActivity(mainIntent); Sunday, September 6, 2009
  27. 27. Activity in fullscreen Opening an activity window in fullscreen without status bar and application title bar can be hidden by code or by theme XML <activity android:style="@android:style/ Theme.NoTitleBar.FullScreen" /> Java Code this.requestWindowFeature(Window.FEATURE_NO_TITLE); getWindow().setFlags WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); Sunday, September 6, 2009
  28. 28. Disabling automatic screen rotation You can disable the automatic screen rotation by specifying the screen orientation for the activity in the AndroidManifest.xml or setting it to “nosensor”. <activity ... android:screenOrientation= "potrait" /> <activity ... android:screenOrientation= "nosensor" /> Sunday, September 6, 2009
  29. 29. Android’s attachMovie() You can create new views by using the LayoutInflater which creates all the views of a declared layout in code. A nice trick to make new instances of complex views. LayoutInflater inflater = (LayoutInflater) context.getSystemService( Context.LAYOUT_INFLATER_SERVICE ); view = inflater.inflate(R.layout.photo_listitem, null ); Sunday, September 6, 2009
  30. 30. Where is my trace()? You can use the Log-class for a similar feature as trace(). The log messages end up in the Logcat or Console panels in Eclipse. And yes, this works in the emulator and on real devices import android.util.Log; .... Log.w("name", "my logmessage"); Sunday, September 6, 2009
  31. 31. Giving views a name in layout xml file You can specify an identifier or name to a view in the layout xml file via android:id attribute. <TextView android:id="@+id/summary" /> Sunday, September 6, 2009
  32. 32. Android’s way of this[“photo1”] You can easily obtain child views of a layout by using: (ImageButton) findViewById(; Sunday, September 6, 2009
  33. 33. Hiding view from the screen You can hide a view by setting the visibility of the view to View.GONE which means the view disappears from the screen and doesn’t take up space in the layout process while View.INVISIBLE will. myView.setVisibility(View.GONE); myView.setVisibility(View.INVISIBLE); Sunday, September 6, 2009
  34. 34. Loading and showing photos on demand Android mainly supports the image file formats PNG, JPG and GIF. You can load an image in ImageView by using the BitmapFactory class and the Bitmap class. 1. Download the photo from the Internet 2. Convert to photo to a Bitmap-instance myBitmap = BitmapFactory.decodeByteArray( ba, 0, ba.length ); 3. Set the bitmap on an image view instance myImageView.setImageBitmap( myBitmap ); Sunday, September 6, 2009
  35. 35. Android’s Scale9 Android’s version of Flash’s Scale9 is called NinePatch and allows to do the same trick in a bit different way. Sunday, September 6, 2009
  36. 36. Questions? Sunday, September 6, 2009