Multi platform development using titanium + alloy
2 likes4,182 views
The document discusses multi-platform mobile development using Appcelerator's Titanium and Alloy frameworks, emphasizing their ability to create native mobile apps across various platforms like iOS and Android. It highlights the ease of UI element creation using JavaScript, contrasting it with traditional development methods. The author, a former Titanium trainer with a passion for technology, encourages developers to explore Titanium and provides resources for getting started.
![Objective-C (iOS)
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[myButton setTitle:@"Click Me!" forState:UIControlStateNormal];](https://image.slidesharecdn.com/multi-platformdevelopmentusingtitaniumalloy-130929115632-phpapp01/85/Multi-platform-development-using-titanium-alloy-9-320.jpg)
Multi platform development using titanium + alloy
- 2. About me Have been using Titanium since late 2009 Former Titanium trainer in the Caribbean and Latin America Obsessed with cross-platform mobile develoment Love Javascript hacking and technology startups I'm a hacker in constant training
- 3. About Appcelerator and Titanium JavaScript SDK to develop native, cross-platform mobile apps 500,000+ developers worldwide Titanium is free and Open Source Supports iOS, Android, Blackberry 10, Tizen and Windows in the works The Appcelerator Platform is the enterprise-grade suite of products based on Titanium
- 5. Is a Web-app cross-platform? Let's use Facebook® as example
- 9. Objective-C (iOS) UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect]; [myButton setTitle:@"Click Me!" forState:UIControlStateNormal];
- 10. Java (Android) Button myButton = new Button(this); myButton.setText("Click Me!");
- 17. UI DEFINITION: INDEX.XML <alloy> <tabgroup id="win"> <tab title="Tab 1" icon="KS_nav_ui.png"> <window title="Tab 1"> <label class="mylabel">I am Window 1</label> </window> </tab> <tab title="Tab 2" icon="KS_nav_views.png"> <window title="Tab 2"> <label class="mylabel">I am Window 2</label> </window> </tab> </tabgroup> </alloy>
- 18. UI STYLING: INDEX.TSS "Window": { backgroundColor: "#fff" }, "Label": { width: Ti.UI.SIZE, height: Ti.UI.SIZE, color: "#000", font: { fontSize: 20, fontFamily: 'Helvetica Neue' }, textAlign: 'center' }, "#win":{ top: 0, left: 0 }, ".mylabel":{ color: "#000" }
- 19. Running on iOS 6
- 20. Running on iOS 7
- 26. INDEX.XML
- 27. INDEX.TSS
- 28. INDEX.JS
- 30. View the Source https://github.com/appcelerator/KitchenSink/tree/master/Resources
- 32. More cool stuff from Appcelerator ACS - Appcelerator Cloud Services Node.ACS Command-line interface (CLI)
- 33. Get started today! Runs on Mac, Windows and Linux iOS development requires a Mac Requires installation and configuration of all native tools (Xcode, Android SDK manager, etc) Download Titanium Studio from my.appcelerator.com Start hacking!
- 34. Thank you! Questions? Follow me on Twitter: @ricardoalcocer Github: /ricardoalcocer