Appcelerator iPhone/iPad Dev Con 2010 San Diego, CA

4,497 views
4,397 views

Published on

Jeff Haynie's Appcelerator presentation at the iPhone/iPad Dev Con held in San Diego, CA on September 28, 2010.

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
4,497
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
81
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide
































  • Appcelerator iPhone/iPad Dev Con 2010 San Diego, CA

    1. 1. iPhone/iPad Dev Con 2010 San Diego, CA ~ September 28
    2. 2. About Me Jeff Haynie @jhaynie http://blog.jeffhaynie.us http://github.com/jhaynie http://slideshare.net/jhaynie Serial Entrepreneur & Silicon Valley geek Objective-C hacker Co-founder and CEO, Appcelerator All around good guy
    3. 3. Massive Business Problem offers Significant Opportunity
    4. 4. Appcelerator We empower web developers by giving them the ability to create native iOS applications using JavaScript. Speed, Skills, Infrastructure, Processes, Tools, Libraries, Reusability...
    5. 5. Appcelerator by the numbers 72,000 Developers 4,750 Apps in Stores 1,100 New Apps/Mo
    6. 6. Not write once, run crappy everywhere Appcelerator isn’t a write once, run everywhere. This isn’t possible (if you want create application experiences for each device). Not a replacement for terrible UI design. Not a replacement for great developers. JavaScript FTW!
    7. 7. Appcelerator is native iOS Exposed native capabilities Optimization of your JS code Generation of native binding code (Obj-C) Compile your application using iOS SDK.
    8. 8. Appcelerator is native ✓ You still need a Mac and OSX ✓ You still need iOS SDK ✓ You still need provisioning profiles (ugh!) ✓ You still need Apple You still need a good app design and ... common sense. If your app is a bad idea or has bad design, Apple will still reject it.
    9. 9. Appcelerator Basic APIs are self-declarative Titanium.Media Titanium.UI Titanium.Network
    10. 10. Appcelerator Basics We use a factory pattern: var media=Ti.UI.createVideoPlayer(); window.add(media); media.play();
    11. 11. Properties var m = Ti.Media.createVideoPlayer ( { url: “foo.mpg” }); m.url = “bar.mpg”;
    12. 12. Garbage Collection We’ll handle retain/release cycles for you based on your JS references. Some objects allow you to help us, help you. media.destroy();
    13. 13. UI Framework Titanium exposes native UI through model/ view paradigm. Windows Views Widgets
    14. 14. Window / View / Widget relationships Windows are Views Widgets are Views Views are hierarchical Views contain views Windows can be opened or closed Windows can points to a local url
    15. 15. Layout Relative positioning / CSS-like top, left, right, bottom width: “50%”, height: “200” layout: “vertical”, “horizontal” zIndex: 199
    16. 16. JSS Like CSS, adapted for Titanium #foo { title: “Hello world”; width: 200px; height:40px; } var button = Ti.UI.createButton({ id:”foo” });
    17. 17. Common Properties A lot of the common CSS properties you’d expect: borderWidth borderColor backgroundImage fontFamily
    18. 18. Simple Example var win = Ti.UI.createWindow(); var b = Ti.UI.createButton({ title: “hello world”, width:200, height: 80 }); win.add(b); win.open();
    19. 19. Make the button go “quack” b.addEventListener(‘click’,function( ){ var m = Ti.Media.createSound({ url:”cricket.wav” }); m.play(); });
    20. 20. Simple Animations Grow the width over 3 seconds view.animate({ duration:3000, width:200 });
    21. 21. Complex 2D and 3D Animations Using matrix transforms var t=Ti.UI.create2DMatrix().rotate(20). scale(1.5); var a=Ti.UI.createAnimation(); a.transform = t; a.duration = 3000; view.animate(a);
    22. 22. Major API sets Media - audio, video Network - networking (sockets, web services) UI - user interface Database - database Geolocation - location services Utils - common utilities like md5, base64 XML - native XML Map - native maps
    23. 23. Web Services var xhr = Ti.Network.createHTTPClient(); xhr.onload = function() { Ti.API.info('in utf-8 onload for POST'); }; xhr.open("POST","http://api.appcelerator.net/ p/v1/echo"); xhr.send({"a":"€ ", "b":"aöbäcüd"});
    24. 24. Web Services with Complex Data (Image from Photo Gallery) Ti.Media.openPhotoGallery({ success:function(event) { xhr.send({media:event.media}); } });
    25. 25. iOS4 Backgrounding (new in upcoming 1.5) Ti.App.registerBackgroundService({ url:'bg.js' });
    26. 26. iOS4 Local Notifications (new in upcoming 1.5) Ti.App.scheduleLocalNotification({ alertBody:"Are you sure?", alertAction:"Launch!", userInfo:{"hello":"world"}, sound:"pop.caf", date:new Date(new Date().getTime() + 3000) });
    27. 27. What can you not do with Titanium? It’s not great for 3D immersive games. Plenty of casual / 2D games being built. For anything else, we have the Module SDK. Package your Titanium extension and distribute it. Great for extending and third-party APIs.
    28. 28. More new stuff in upcoming 1.5 Localizations L(“my_string”) Ti.Locale.getString(“my_string”) Due out in October
    29. 29. How about iPad? Split Views Popovers Nav Controllers (also in iPhone)
    30. 30. iPad SplitView example var sv = Ti.UI.iPad.createSplitWindow({ masterView:masterNav, detailView:detailNav, }); sv.open();
    31. 31. Can I hack on Appcelerator? Code is on github.com/appcelerator Licensed under Apache Public License (v2) developer.appcelerator.com
    32. 32. Other Appcelerator Products Titanium Analytics Web-based product that enables companies to understand their application usage, scenarios and users. Titanium+Geo Web-based product that enables geo- spatial analytics as well as integration into first-party and third-party data sources. Enables companies to apply location context to their analysis and forecasting.

    ×