An introduction to Titanium
2 likes2,836 views
This document provides an introduction and overview of building mobile applications using Appcelerator Titanium. It discusses key aspects of Titanium like abstraction layers, supported programming languages, UI structures, and APIs for common mobile tasks. Titanium allows developing apps using JavaScript that can be deployed to platforms like iOS and Android, simplifying cross-platform development. The document demonstrates Titanium's capabilities and encourages exploring further documentation and open source resources.
An introduction to Titanium
- 1. An introduction to Titanium Enough to get you into trouble
- 2. Graham Weldon PHP developer for 11 years CakePHP core contributor Open source public speaker Love developing/teaching @predominant http://grahamweldon.com http://cakedc.com
- 3. The rise of mobile Making, distributing and selling mobiles apps can be a lucrative business Well designed, available apps are sought after Users prefer a service or product if it comes with a mobile counterpart Mobile Available Accessible Offline
- 4. Mobile history PDA’s Original Netbooks Symbian (Nokia domination) iMode (Success in Japan) WAP Java ME Android, iOS, Windows Phone, Meego, and more
- 5. Building for mobile Google Android Java Apple iOS Objective C Windows Phone .NET platform (C#, primarily) Blackberry Java
- 7. An abstraction layer is a way of hiding the implementation details of a particular set of functionality.
- 8. What is an abstraction layer?
- 9. Why use an abstraction layer? Simpler maintenance Only working with business logic and custom code One codebase, many platforms Quicker development Re-use existing knowledge Less re-training
- 10. I’m convinced! What can I use? NimbleKit (iOS) Adobe PhoneGap (Web container) Adobe Flex / Flash Appcelerator Titanium (Compiled to native) Corona (Lua) Rhomobile Web jQuery Mobile Sencha Touch Custom
- 14. Wait... Free? The platform and studio environment cost nothing You have all the tools you need to build applications Its also Open Source! http://github.com/appcelerator Whats the catch? Appcelerator is a company for profit Support Premium modules / extensions Custom development
- 15. Take advantage of existing skills Web Developers Use Javascript Learn and extend their knowledge Benefit their web skills Only the Titanium specific calls are different
- 16. Key advantages Write once Deploy everywhere Cut down on maintenance Simplify deployment to new platforms
- 18. Titanium Studio Build apps Debug Profile Code hinting Easy device testing Easy deployment
- 19. How does it work? Pre-Compiler Optimise, Analyse code Find and resolve dependencies Front End Compiler Convert to native code Package in JS engine for other stuff Platform Compiler Compiled with native tools Xcode + iOS SDK, Java + Android SDK
- 20. What does that mean? Its optimising your code Converting what it can to native device code Anything it can’t gets run through the JS Engine Makes it super fast Makes it super portable no matter the code
- 21. Javascript!
- 23. A perfect match Titanium is View driven Event based Perfect for Javascript Layered view hierarchy Similar to iOS
- 24. Organising and building your app
- 25. Resources The resources folder Holds all the important stuff Code Assets Platform specific whatsits
- 26. Platforms Sometimes platforms have differences You need to occasionally provide a different implementation Maybe some images for just that platform
- 27. iPhone folder appicon.png Icon for home screen *-Landscape.png Landscape splash image *-Portrait.png Portrait splash image Default.png Standard resolution Default@2x.png Double resolution (iPhone4+)
- 28. and of course... Android
- 29. app.js Code Context Separate context to keep things tidy and manageable ‘myVar’ in app.js Not accessible in win1.js Use globals sparingly win1.js
- 30. But I want global data, configs, etc.. Define configuration files Use the Titanium Include Ti.include(...); Separate different information Only include what you need
- 31. UI Structure
- 32. Tabbed Layout Very common iOS Examples: Twitter app, Foursquare, Commbank, Phone One window per tab Tab windows can open sub-windows Naturally they get a “< back” option Easy to use and understand No effort required!
- 36. Doh! Platform differences iOS has tabs at the bottom Android has tabs at the top iOS has a title by default for tabGroups Android doesn’t have a title for tabGroups More than likely your creative director wants everything to look the same on all platforms Disregarding previous user epxerience on specific platforms.
- 40. Custom Interfaces Possible. But requires some real work.
- 41. Manage your UI Interface stacking Order, and backtracking
- 44. Titanium makes it easy
- 45. Ti.Accelerometer addEventListener removeEventListener fireEvent Simulate accelerometer events
- 46. Ti.Geolocation Quick and easy Geo Current Position forwardGeocoder Address -> Coords reverseGeocoder Coords -> Address Add/remove listeners
- 47. Ti.Map Common interface for all devices Simple map integration Use with information from Ti.Geolocation Add custom pins / locations Switch map types Satellite / Standard / Hybrid
- 48. Ti.Analytics Monitor events Report on them later Gather info about behaviour Improve your application Challenge users
- 49. Ti.Contacts Access the Address Book Works on all devices One interface Integrate contacts Simplify information sharing Read only on Android :(
- 50. Ti.Database A simple to use database SQL compliant Install and update DBs Store local data Great for offline storage Sync later
- 51. Ti.Filesystem Read files Write files iOS restricted to sandbox (everyone is...) Android allows access to external media
- 52. Ti.Facebook Simple Facebook integration REST API (Deprecated) Graph API Login Store authorization Simple configuration Works everywhere
- 53. Ti.Gesture Track gestures add event listeners customise your app UX Events shake orientation change
- 54. Ti.Network Protocols TCP HTTP Bonjour Implement any protocol you like on TCP Connect your app Create a server
- 55. Ti.XML Easy to use parser Produce XML too Makes consuming services easy Includes things like rss atom oData
- 56. Yahoo! YQL My personal favourite Grab data from anywhere on the internet Query using XPATH Scrape websites (responsibly) http://developer.yahoo.com/yql/
- 57. Commercial Components There are a heap on the marketplace Some are reasonably priced Great way to get things done quickly You can sell your own components on the marketplace http://www.appcelerator.com/products/open-mobile-marketplace/
- 58. Also check Github Search repos for ‘Titanium’ Currently 706 results Components Full projects http://goo.gl/R69Ck
- 59. JSS
- 60. JSS: CSS style rules Not much information about it But very easy to use app.js app.jss Set almost any property Always clean before running your app!
- 61. app.js app.jss
- 62. app.js app.jss
- 63. Building your app Multiple platform support
- 66. < insert coding montage >
- 67. Thats it! Thanks! Graham Weldon http://grahamweldon.com @predominant Cake Development Corporation http://cakedc.com @cakedc