Developing Native Android Apps with Titanium

26,697 views

Published on

An introduction to techniques new and old for developing native Android applications

0 Comments
15 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
26,697
On SlideShare
0
From Embeds
0
Number of Embeds
5,714
Actions
Shares
0
Downloads
396
Comments
0
Likes
15
Embeds 0
No embeds

No notes for slide

Developing Native Android Apps with Titanium

  1. 1. Native Android Applications with Titanium Marshall Culpepper (@marshall_law) Kevin Whinnery (@kevinwhinnery) http://www.appcelerator.com | @appcelerator
  2. 2. Agenda Native Android Concepts and Terms Using Titanium APIs to participate in the native Android ecosystem Cross-platform JavaScript tips and techniques Code structure for cross-platform apps Questions and Answers http://www.appcelerator.com | @appcelerator
  3. 3. Concepts Application http://developer.android.com/reference/android/app/Application.html 1..n Activities Selected by OS w/ Intent filters SDK version compatibility Intent http://developer.android.com/reference/android/content/Intent.html Various fields/options Action (VIEW, EDIT, SEND, etc), Data (URI) Category (CATEGORY_LAUNCHER etc) Mime type (i.e. vnd.android.cursor.item/phone) Class name (i.e. com.mycompany.Activity) Custom key/value pairs Fully serializable data, used between Activities http://www.appcelerator.com | @appcelerator
  4. 4. Concepts Activity http://developer.android.com/reference/android/app/Activity.html Task Stack Inter-app + screen navigation App entry point Handle system+custom intents Can return values to other activities Service http://developer.android.com/reference/android/app/Service.html Long running background processes Part of an Application http://www.appcelerator.com | @appcelerator
  5. 5. Concepts PendingIntent http://developer.android.com/reference/android/app/PendingIntent.html Holds an Intent that will be executed at a later time by the system or another Activity NotificationManager http://developer.android.com/reference/android/app/NotificationManager.html http://developer.android.com/reference/android/app/Notification.html API for showing a system notification, i.e. status bar icon, sound, etc our API is currently undocumented, but will be coming shortly http://www.appcelerator.com | @appcelerator
  6. 6. App/Activity Life Cycle User launches app Intent is fired to app with: category: CATEGORY_LAUNCHER action: MAIN http://www.appcelerator.com | @appcelerator
  7. 7. How do I do that with Ti? Custom JS Activities/Services JS Activities can be simple (launched via URL) or complex (launched via intent filter from the system) JS Services currently only run when the app starts Doesn’t support full functionality of Android Services (yet) See http://developer.appcelerator.com/doc/mobile/android-simple-services Configured via tiapp.xml Everything else (mostly) follows a 1:1 mapping w/ official Android API All constants / create* methods live in Ti.Android i.e. Ti.Android.createIntent Access current activity with Ti.Android.currentActivity Activity.startActivityForResult supports a function callback for convenience See Documentation for Ti.Android http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.Android-module http://www.appcelerator.com | @appcelerator
  8. 8. tiapp.xml examples http://www.appcelerator.com | @appcelerator
  9. 9. JS Examples http://www.appcelerator.com | @appcelerator
  10. 10. Titanium+Android Demos http://www.appcelerator.com | @appcelerator
  11. 11. Cross-platform Strategy If possible, build and test your application for multiple platforms from the start Understand the cost of using platform-specific native UI elements Separate business logic and UI construction Smaller UI components are easier to maintain across platforms than large ones Test on many devices and resolutions http://www.appcelerator.com | @appcelerator
  12. 12. Some Tools of the Trade http://www.appcelerator.com | @appcelerator
  13. 13. Ti.Platform.osname http://www.appcelerator.com | @appcelerator A little extra sugar for branching based on OS...
  14. 14. Usage... http://www.appcelerator.com | @appcelerator use as a convenient way to branch logic based on operating system, or... ...a convenient way to choose a value based on operating system
  15. 15. Platform Resources http://www.appcelerator.com | @appcelerator Code files, images, or any other resource can be swapped out on a per-platform basis
  16. 16. Platform JSS http://www.appcelerator.com | @appcelerator
  17. 17. Dealing with multiple resolutions and densities http://www.appcelerator.com | @appcelerator
  18. 18. Terms and Concepts Resolution : The total number of physical pixels on a screen Density : the spread of pixels across an inch of the actual screen (DPI) http://www.appcelerator.com | @appcelerator When defining Android user interfaces, the top/bottom/left/right/height/width/font etc. values you use are based on RESOLUTION . SCREEN DENSITY can be used to determine density-appropriate visual assets to use.
  19. 19. Example http://www.appcelerator.com | @appcelerator Same Physical Size Resolution: 320x480 Resolution: 480x800 Medium Density (160dpi) High Density (240dpi) Smaller Physical Size Resolution: 240x320 Low Density (120dpi)
  20. 20. Many Screen Types http://www.appcelerator.com | @appcelerator http://developer.android.com/guide/practices/screens_support.html
  21. 21. Contrast with iOS iPhone layout is always based on a 320x480 point system, regardless of screen density/pixels Retina display devices (high density display) require high-res images (@2x) http://www.appcelerator.com | @appcelerator 320 “points” 480 “points”
  22. 22. Ignoring Densities Android property anyDensity=false will cause medium res images to be used, and will scale UI layout to match a 160dpi screen This is the default behavior in 1.5 Not always desirable - configurable in tiapp.xml http://www.appcelerator.com | @appcelerator
  23. 23. Multiple Resolutions Ti.Platform.displayCaps platformWidth platformHeight Based on available screen real estate, you may change the size or layout of your UI Use the available emulator skins and devices to test layouts on multiple resolutions Use top/bottom/left/right for sizing where possible http://www.appcelerator.com | @appcelerator
  24. 24. Multiple Densities Even if the available screen resolution is the same, higher density screens call for higher resolution assets Provide density-specific images in the ‘android/images’ resource directory http://www.appcelerator.com | @appcelerator
  25. 25. Structuring your Titanium application for cross-platform http://www.appcelerator.com | @appcelerator
  26. 26. Rich client applications (like Ti Mobile apps) should strive to be: event-driven and component-oriented component-oriented component-oriented component-oriented component-oriented http://www.appcelerator.com | @appcelerator
  27. 27. Interaction Events Interaction events you know: click swipe change focus blur http://www.appcelerator.com | @appcelerator
  28. 28. Custom Events Custom events you might not use (but should!) Custom events can be app wide Custom events can be specific to your app’s components (business events) http://www.appcelerator.com | @appcelerator
  29. 29. Being component-oriented helps us build cross-platform more easily. http://www.appcelerator.com | @appcelerator
  30. 30. Component-Oriented Your application is composed of a library of application-specific components you create The smaller the component, the easier it is to make each components work across platforms Encourages the encapsulation and reuse of UI components http://www.appcelerator.com | @appcelerator
  31. 31. Walkthrough: Tweetanium Component oriented construction Composed from a custom-built UI library, following the Titanium.UI component factory style Utilizes new features for localization, strategies for externalizing UI configuration Under construction, code posted next week Desktop version available as well http://www.appcelerator.com | @appcelerator
  32. 32. Questions? http://www.appcelerator.com | @appcelerator

×