Codestrong 2012 breakout session what's new in titanium studio

19
What’s New in 3.0 Carl Orthlieb Vice President of Engineering Appcelerator, Inc. @orthlieb [email protected]

Transcript of Codestrong 2012 breakout session what's new in titanium studio

Page 1: Codestrong 2012 breakout session   what's new in titanium studio

What’s New in 3.0

Carl OrthliebVice President of Engineering

Appcelerator, Inc.@orthlieb

[email protected]

Page 2: Codestrong 2012 breakout session   what's new in titanium studio

Our Biggest Release Ever

Over 1,000 enhancements

Increased productivity

Write less code, build richer apps

Page 3: Codestrong 2012 breakout session   what's new in titanium studio

• Beginner developers face challenges in getting from zero to app success

• Experienced developers lack tools to integrate Titanium into a high performing and scalable work environment

Titanium 3.0

Write less code, build richer apps

Page 4: Codestrong 2012 breakout session   what's new in titanium studio

• Alloy MVC framework

• Command Line Interface (CLI)

• “On-device” application debugging

• VoiceOver accessibility for Titanium apps

• Android action bar integration

• Install & update Modules within Titanium Studio

• Node.ACS integration

• Support for iOS 6/ Mountain Lion, Android 4.1

Titanium 3.0 at a glance

Write less code, build richer apps

Page 5: Codestrong 2012 breakout session   what's new in titanium studio

• Modern MVC framework

• Simpler, easily readable code

• Reusable widgets

• Reduces time from zero-to-app

• Write less code

• Create scalable apps

• Lower probability of runtime

errors

Introducing Alloy

Simple, reusable, fast

Page 6: Codestrong 2012 breakout session   what's new in titanium studio

"Window": { backgroundColor: '#fff'},"Label": { color: '#999', font: { fontSize:20, fontFamily:'Helvetica Neue' }, textAlign:'center'}

<Alloy> <TabGroup> <Tab title="Tab 1" icon="KS_nav_views.png"> <Window title="Tab 1"> <Label>I am Window 1</Label> </Window> </Tab> <Tab title="Tab 2" icon="KS_nav_ui.png"> <Window title="Tab 2"> <Label>I am Window 2</Label> </Window> </Tab> </TabGroup></Alloy>

// this sets the background color of the master UIView (when there are no windows/tab groups on it)Titanium.UI.setBackgroundColor('#000');var tabGroup = Titanium.UI.createTabGroup();var win1 = Titanium.UI.createWindow({ title:'Tab 1', backgroundColor:'#fff'});var tab1 = Titanium.UI.createTab({ icon:'KS_nav_views.png', title:'Tab 1', window:win1});var label1 = Titanium.UI.createLabel({

color:'#999',text:'I am Window 1',font:{

fontSize:20, fontFamily:'Helvetica Neue' },

textAlign:'center',width:'auto'

});win1.add(label1);var win2 = Titanium.UI.createWindow({ title:'Tab 2', backgroundColor:'#fff'});var tab2 = Titanium.UI.createTab({ icon:'KS_nav_ui.png', title:'Tab 2', window:win2});var label2 = Titanium.UI.createLabel({

color:'#999',text:'I am Window 2',font:{

fontSize:20, fontFamily:'Helvetica Neue' },

textAlign:'center',width:'auto'

});win2.add(label2);tabGroup.addTab(tab1); tabGroup.addTab(tab2); tabGroup.open();

The proof is in the code

Before After (with Alloy)

Sample App: 603 LOC Alloy, 2187 LOC Ti

Page 7: Codestrong 2012 breakout session   what's new in titanium studio

Simple, reusable, fast

Demo

Page 8: Codestrong 2012 breakout session   what's new in titanium studio

• Public pre-release: 8/29/2012

• 180 members in Google Groups

• Favorited by 269 people in github

• 53 potential contributors

https://github.com/appcelerator/alloy

Alloy status

Simple, reusable, fast

Page 9: Codestrong 2012 breakout session   what's new in titanium studio

• Use your own custom development

environment with Titanium

• Perform common operations

• Integrate into automation

harnesses

• Support continuous integration

loops on a build server

Advanced developers

Have it your way

Page 10: Codestrong 2012 breakout session   what's new in titanium studio

• Written in node.js

• Supported actions: create, build,

install, run, clean

• Supports mobile apps and modules

• Easily extensible

https://github.com/appcelerator/titanium

Command line interface (CLI)

Have it your way

Page 11: Codestrong 2012 breakout session   what's new in titanium studio

On Device Debugging

Page 12: Codestrong 2012 breakout session   what's new in titanium studio

• Support for iOS and Android in

views and other controls

• accessibilityLabel: succinct label

• accessibilityValue: state or value

of the control

• accessibilityHint: what happens

when the user interacts with the

control

Accessibility

Page 13: Codestrong 2012 breakout session   what's new in titanium studio

Accessibility: VoiceOver

Demo

Page 14: Codestrong 2012 breakout session   what's new in titanium studio
Page 15: Codestrong 2012 breakout session   what's new in titanium studio

• With ACS 2.0 we allowed you connect your mobile apps to over 20 pre-canned reliable services

• With ACS 3.0 we are extending this to allow you to build custom web services

Introducing Node.ACS

Page 16: Codestrong 2012 breakout session   what's new in titanium studio

• Code in the wildly popular Node.js

• Develop right alongside your mobile app in Studio

• Deploy to the ACS Cloud for instantly scalable reliable services

• Broker sensitive back-end integrations in a secure manner

• Offload processing from the device

Node.ACS

Page 17: Codestrong 2012 breakout session   what's new in titanium studio

• Alloy MVC framework

• Command Line Interface (CLI)

• “On-device” application debugging

• VoiceOver accessibility for Titanium apps

• Android action bar integration

• Install & update Modules within Titanium Studio

• Node.ACS integration

• Support for iOS 6/ Mountain Lion, Android 4.1

Titanium 3.0 at a glance

Write less code, build richer apps

Page 18: Codestrong 2012 breakout session   what's new in titanium studio

Features and Fixes

Page 19: Codestrong 2012 breakout session   what's new in titanium studio

Carl Orthlieb@orthlieb

[email protected]