develping ios and android apps using appcelerator titanium
DESCRIPTION
TRANSCRIPT
![Page 1: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/1.jpg)
DEVELOPINGIOS & ANDROID APPS USINGTITANIUM
NHM TANVEER HOSSAIN KHANHASIN HAYDER
![Page 2: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/2.jpg)
WHY TITANIUM?
• EASY TO JUMP START
• DEVICE INDEPENDENT
• COMMON TOOLS
• NATIVE
• EXTESIVE DOCUMENTATION
![Page 3: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/3.jpg)
HOW TITANIUM FITS IN?
• SINGLE CODEBASE
• NATIVE UI
• LEARNING JQUERY FOR WEB
• FRIENDLY API
![Page 4: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/4.jpg)
DID YOU SAY JAVASCRIPT?
• AVAILABLE JAVASCRIPT EXPERT
• EASY TO GRASP
• EXISTING WEB APP DEV 2 MOBILE APP DEV
![Page 5: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/5.jpg)
DEVICE INDEPENDENT?
JS Code
Ti API
Native Bridge
Native!(Red Indian)
![Page 6: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/6.jpg)
DEVICE INDEPENDENT?
• Code in JavaScript!
• Use titanium JavaScript library
• Titanium JavaScript interpreter interprets and Call native methods.
• Just like $(‘#someId’) Or Natively document.getElementById(‘someId’)
![Page 7: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/7.jpg)
TITANIUM, THE GOOD, THE BAD & THE UGLY
EVERYTHING NATIVE JS/JSS DEVELOPMENT
EXTENSIBLE DEPLOYMENT IS FUN
BEAUTIFUL IDE
![Page 8: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/8.jpg)
TITANIUM, THE GOOD, THE BAD & THE UGLY
UI DESIGN IS PAIN
640 Lines
of code
![Page 9: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/9.jpg)
TITANIUM, THE GOOD, THE BAD & THE UGLY
NOT EVERYONE’s DOGFOOD
• GRAPHICS APPS
• GAMES
![Page 10: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/10.jpg)
TITANIUM, DESIGNING A SAMPLE UI
Ti.UI.createWindow({ backgroundColor:"#FFF"});
![Page 11: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/11.jpg)
TITANIUM, DESIGNING A SAMPLE UI
var win = Ti.UI.createWindow({ backgroundColor:"#FFF"});
win.open();
![Page 12: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/12.jpg)
TITANIUM, ADD A CONTAINER
var view = Ti.UI.createView({top:10,left:10,height:300,width:300,backgroundColor:"#AAA",borderRadius:10
});win.add(view);
![Page 13: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/13.jpg)
TITANIUM, ADD A CONTAINER
var view = Ti.UI.createView({top:10,left:10,height:300,width:300,backgroundColor:"#AAA",borderRadius:10
});win.add(view);
![Page 14: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/14.jpg)
TITANIUM, ADD A BUTTON
var button = Ti.UI.createButton({
title:"Click Me",top:10, left:10,
height:40, width:280});
view.add(button);
![Page 15: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/15.jpg)
TITANIUM, ADD A BUTTON
var button = Ti.UI.createButton({title:"Click Me",top:10, left:10,
height:40, width:280});
view.add(button);
![Page 16: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/16.jpg)
TITANIUM, ADD A BUTTON
button.addEventListener("click", function(){ alert("Welcome to JSCon"); });
![Page 17: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/17.jpg)
TITANIUM, ADD A BUTTON
button.addEventListener("click", function(){ alert("Welcome to JSCon 2011"); });
![Page 18: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/18.jpg)
TITANIUM, OPEN A DIALOG
var dlg = Ti.UI.createOptionDialog({title:"Delete?",options:["Yes","No"],cancel:1
});dlg.addEventListener("click", function(e){
alert(e.index);});
dlg.show();
![Page 19: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/19.jpg)
TITANIUM, ADD A BUTTON
var dlg = Ti.UI.createOptionDialog({title:"Delete?",options:["Yes","No"],cancel:1
});dlg.addEventListener("click", function(e){
alert(e.index);});
dlg.show();
![Page 20: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/20.jpg)
TITANIUM, LOTS OF UI ELEMENTS
![Page 21: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/21.jpg)
TITANIUM, ITS NOT ONLY ABOUT UI
• DATABASE
• WEB SERVICES
• MEDIA ELEMENTS
• NATIVE FEATUERS• ACCELEROMETER
• GEOLOCATION
• SOCIAL NETWORK
• MONETIZATION
![Page 22: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/22.jpg)
TITANIUM, ACCELEROMETER
Ti.Accelerometer.addEventListener('update', function(e){ alert("accelerometer - x:"+e.x+ ",y:"+e.y+ ",z:"+e.z ); });
![Page 23: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/23.jpg)
TITANIUM, GEOLOCATION
Ti.Geolocation.getCurrentPosition( function(e){ if (e.error) { alert(’Cant locate'); return; }});
![Page 24: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/24.jpg)
TITANIUM, FIND THE LOCATION
Ti.Geolocation.getCurrentPositio( function(e){ if (e.error) { alert(’Cant locate'); return; }});
![Page 25: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/25.jpg)
TITANIUM, FIND THE LOCATION
var longitude = e.coords.longitude; var latitude = e.coords.latitude; var altitude = e.coords.altitude; var heading = e.coords.heading; var accuracy = e.coords.accuracy; var speed = e.coords.speed;
![Page 26: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/26.jpg)
TITANIUM, DRAW THE MAP
var mapview = Ti.Map.createView({ mapType: Ti.Map.STANDARD_TYPE, region: {latitude: "23.7230556", longitude: "90.4086111", },});
![Page 27: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/27.jpg)
TITANIUM, HOW ABOUT AN APP?
?
![Page 28: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/28.jpg)
TITANIUM, HOW ABOUT VEHICLE TRACKER?
![Page 29: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/29.jpg)
TITANIUM, HOW ABOUT VEHICLE TRACKER?
![Page 30: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/30.jpg)
TITANIUM, HOW ABOUT VEHICLE TRACKER?
![Page 31: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/31.jpg)
TITANIUM, HOW ABOUT A GPS APP?
HOMEWORK
![Page 32: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/32.jpg)
TITANIUM, EVERYTHING SQLITE
SQLite Manager
![Page 33: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/33.jpg)
TITANIUM, INSTALL A DATABASE
Create or open an existing database - var db = Ti.Database.open(‘JSConf’)
Use database with your default data -var db = Ti.Database.install( ‘bundled/JSConf.db’, ‘JSConf’)
![Page 34: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/34.jpg)
TITANIUM, CREATE TABLE
db.execute(‘ CREATE TABLE IF NOT EXISTS topics ( id INTEGER, title TEXT, speakers TEXT, duration INTEGER, PRIMARY KEY(id) )’);
![Page 35: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/35.jpg)
TITANIUM, INSERT
var result = db.execute(‘ INSERT INTO topics (title, speakers, duration) VALUES (?, ?, ?, ?)‘, ‘Titanium’, ‘Hasin & Hasan’, 30);
![Page 36: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/36.jpg)
TITANIUM, INSERT
• Successful execution ? if (result.getRowsAffected() > 0)
• Last row id ? result.getLastInsertRowId()
![Page 37: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/37.jpg)
TITANIUM, UPDATE
var result = db.execute(‘ UPDATE topics SET title = ? WHERE id = ?‘, ‘Mobile app using titanium’, 1);
![Page 38: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/38.jpg)
TITANIUM, UPDATE
Successful execution ? if (result.getRowsAffected() > 0)
![Page 39: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/39.jpg)
TITANIUM, DELETE
var result = db.execute(‘ DELETE FROM topics WHERE id = ?‘, 1);
![Page 40: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/40.jpg)
TITANIUM, DELETE
Successful execution ? if (result.getRowsAffected() > 0)
![Page 41: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/41.jpg)
TITANIUM, RETRIEVE
var result = db.execute(‘ SELECT (id, title, speakers) FROM topics WHERE id = ?‘, 1);
![Page 42: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/42.jpg)
TITANIUM, RETRIEVE
Iterate through rows -
while (result.isValidRow()) { var title = result.fieldByName(‘title’); result.next();}
![Page 43: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/43.jpg)
TITANIUM, AJAX
var xhr = Ti.Network.createHTTPClient(); xhr.open('GET', 'url'); var params = {id:"1"}xhr.send(params); sendit.onload = function(){ var json = JSON.parse(this.responseText);
}
![Page 44: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/44.jpg)
TITANIUM, AJAX
var xhr = Ti.Network.createHTTPClient(); xhr.open('GET', 'url'); var params = {id:"1"}xhr.send(params); sendit.onload = function(){
var json = JSON.parse(this.responseText); }
![Page 45: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/45.jpg)
TITANIUM, MONETIZE USING iAD
adView = Ti.UI.iOS.createAdView({ width: 'auto', height: 'auto',});
![Page 46: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/46.jpg)
TITANIUM, MEDIA API
AUDIO• PLAY
• STREAM
• RECORD
VIDEO• PLAY
• STREAM
• RECORD
IMAGE• CAPTURE
• DISPLAY
![Page 47: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/47.jpg)
TITANIUM, WEB SERVICES AND SOCIAL NET
• YAHOO SERVICES
![Page 48: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/48.jpg)
TITANIUM, PUSH NOTIFICATION
URBAN AIRSHIP• PUSH NOTIFICATION
• IN APP PURCHASE
• SUBSCRIPTIONS
![Page 49: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/49.jpg)
TITANIUM, DEPLOY
• TEST DEVICES
• REAL CUSTOMERS
![Page 50: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/50.jpg)
TITANIUM, GENERATING CERTIFICATE
![Page 51: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/51.jpg)
TITANIUM, DEVICE TESTING
![Page 52: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/52.jpg)
TITANIUM, DISTRIBUTE
![Page 53: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/53.jpg)
TITANIUM, DESKTOP
• HTML/CSS
• DIFFERENT LANGUAGE• PHP
• PYTHON
• RUBY
• JAVASCRIPT
• CROSS PLATFORM
![Page 54: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/54.jpg)
TITANIUM, WUNDERLIST
![Page 55: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/55.jpg)
TITANIUM, PACKAGE DESKTOP
![Page 56: Develping iOS and Android apps using Appcelerator Titanium](https://reader034.vdocuments.site/reader034/viewer/2022051313/5493c5e7b47959424d8b4949/html5/thumbnails/56.jpg)
THANK YOU, QUESTIONS?
?