Павло Чупірчук

 Перші комп’ютери  Нові горизонти  Персональні комп’ютери  Кожному  Мобільні пристрої  Де завгодно «Піраміда Маслоу». Наші дні

 Перші комп’ютери  Мови низького і високого рівня  Персональні комп’ютери  Кросплатформенність і орієнтованість на ОС  Мобільні пристрої  Native vs Web

 Різноманіття платформ  A давай створимо свою мобільну OS?  Змагання магазинів  І відкриємо свій магазин програмок?  Але без мережі – як без води

 Використання особливостей ОС  Економія трафіку  Робота без підключення  Швидкість роботи програми  Незалежність від ОС  Не потрібна інсталяція  Миттєві оновлення  Єдиний код, мова  Швидкість розробки програми

 Відкритий web-рушій  Вже є на більшості смартфонів і планшетів  В ядрі найпопулярніших браузерів  Chrome  Safari  Основа для багатьох програм  Mobile  Desktop

Studio Android deviceProject dir Java Script API Andrid API apk -file Resources html css java script Resources html css java script Resources html css java script Resources html css java script WebKit Android project

 Продукт Appcelerator Inc.  RIA для мобільних пристроїв  Android, iOS, Black Berry, Windows Phone  Набір специфічних JavaScript API  Titanium SDK + Studio  Free

 Папка Resources  Файли з кодом і зображення  Підпапки: android, iphone, mobileweb, ui…  app.js  Точка входу  tiapp.xml  Конфігурація проекту

if (Ti.version < 1.8) { alert('Sorry '); } //add a single variable to the global scope var globals = {}; //create a private scope to prevent further polluting the global object (function() { var AppTabGroup = require('ui/AppTabGroup').AppTabGroup, ListWindow = require('ui/ListWindow').ListWindow, AddWindow = require('ui/AddWindow').AddWindow; // Initialize local storage require('db').createDb(); … if (Ti.version < 1.8) { alert('Sorry '); } //add a single variable to the global scope var globals = {}; //create a private scope to prevent further polluting the global object (function() { var AppTabGroup = require('ui/AppTabGroup').AppTabGroup, ListWindow = require('ui/ListWindow').ListWindow, AddWindow = require('ui/AddWindow').AddWindow; // Initialize local storage require('db').createDb(); …

globals.tabs = new AppTabGroup({ title : 'Todo', icon : 'images/KS_nav_ui.png', window : new ListWindow({ title : 'Todo', backgroundColor : '#fff', navBarHidden : false, isDone : 0, activity : { onCreateOptionsMenu : function(e) { var menu = e.menu; var menuItem = menu.add({ title : "Add Task" }); menuItem.setIcon("images/ic_menu_add.png"); menuItem.addEventListener("click", function(e) { new AddWindow().open(); }); } }}) globals.tabs = new AppTabGroup({ title : 'Todo', icon : 'images/KS_nav_ui.png', window : new ListWindow({ title : 'Todo', backgroundColor : '#fff', navBarHidden : false, isDone : 0, activity : { onCreateOptionsMenu : function(e) { var menu = e.menu; var menuItem = menu.add({ title : "Add Task" }); menuItem.setIcon("images/ic_menu_add.png"); menuItem.addEventListener("click", function(e) { new AddWindow().open(); }); } }}) }, { title : 'Done', icon : 'images/KS_nav_views.png', window : new ListWindow({ title : 'Done', backgroundColor : '#fff', navBarHidden : false, isDone : 1 }) }); }, { title : 'Done', icon : 'images/KS_nav_views.png', window : new ListWindow({ title : 'Done', backgroundColor : '#fff', navBarHidden : false, isDone : 1 }) }); globals.tabs.open(); })(); globals.tabs.open(); })();

exports.AppTabGroup = function() { var self = Ti.UI.createTabGroup(); for (var i = 0, l = arguments.length; i < l; i++) { var tab = Ti.UI.createTab(arguments[i]); if (i === 0) { self.currentTab = tab; } self.addTab(tab); } self.addEventListener('focus', function(e) { self.currentTab = e.tab; }); return self; }; exports.AppTabGroup = function() { var self = Ti.UI.createTabGroup(); for (var i = 0, l = arguments.length; i < l; i++) { var tab = Ti.UI.createTab(arguments[i]); if (i === 0) { self.currentTab = tab; } self.addTab(tab); } self.addEventListener('focus', function(e) { self.currentTab = e.tab; }); return self; };

exports.AddWindow = function() { var db = require('db'); var self = Ti.UI.createWindow({ modal: true, title: 'Add Item', backgroundColor: '#fff' }); //var itemField = … //var addButton = … self.add(itemField); self.add(addButton); return self; }; exports.AddWindow = function() { var db = require('db'); var self = Ti.UI.createWindow({ modal: true, title: 'Add Item', backgroundColor: '#fff' }); //var itemField = … //var addButton = … self.add(itemField); self.add(addButton); return self; }; var itemField = Ti.UI.createTextField({ width: '300dp', height: '45dp', top: '20dp', hintText: 'New Item', borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED, returnKeyType: Ti.UI.RETURNKEY_DONE }); itemField.addEventListener('return', function(e) { addTask(itemField.value, self); }); var itemField = Ti.UI.createTextField({ width: '300dp', height: '45dp', top: '20dp', hintText: 'New Item', borderStyle: Ti.UI.INPUT_BORDERSTYLE_ROUNDED, returnKeyType: Ti.UI.RETURNKEY_DONE }); itemField.addEventListener('return', function(e) { addTask(itemField.value, self); });

exports.AddWindow = function() { var db = require('db'); var self = Ti.UI.createWindow({ modal: true, title: 'Add Item', backgroundColor: '#fff' }); //var itemField = … //var addButton = … self.add(itemField); self.add(addButton); return self; }; exports.AddWindow = function() { var db = require('db'); var self = Ti.UI.createWindow({ modal: true, title: 'Add Item', backgroundColor: '#fff' }); //var itemField = … //var addButton = … self.add(itemField); self.add(addButton); return self; }; var addButton = Ti.UI.createButton({ title: 'Add', width: '300dp', height: '40dp', top: '80dp' }); addButton.addEventListener('click', function() { addTask(itemField.value, self); }); var addButton = Ti.UI.createButton({ title: 'Add', width: '300dp', height: '40dp', top: '80dp' }); addButton.addEventListener('click', function() { addTask(itemField.value, self); }); var addTask = function(value, win) { if (value === '') { alert('Please enter a task first'); return; } require('db').addItem(value); Ti.App.fireEvent('app:updateTables'); win.close(); }; var addTask = function(value, win) { if (value === '') { alert('Please enter a task first'); return; } require('db').addItem(value); Ti.App.fireEvent('app:updateTables'); win.close(); };

var platform = Ti.Platform.osname; if (platform !== 'android') { var addBtn = Ti.UI.createButton({ title:'+' }); addBtn.addEventListener('click', function() {new AddWindow().open();}); if (platform === 'mobileweb') { self.layout = 'vertical'; addBtn.height = 40; addBtn.width = 40; addBtn.top = 0; addBtn.right = 10; self.add(addBtn); self.add(tableview); } else{ self.rightNavButton = addBtn; } var platform = Ti.Platform.osname; if (platform !== 'android') { var addBtn = Ti.UI.createButton({ title:'+' }); addBtn.addEventListener('click', function() {new AddWindow().open();}); if (platform === 'mobileweb') { self.layout = 'vertical'; addBtn.height = 40; addBtn.width = 40; addBtn.top = 0; addBtn.right = 10; self.add(addBtn); self.add(tableview); } else{ self.rightNavButton = addBtn; }

 Єдина основа  Єдина мова JavaScript  Доступ до системних особливостей  Багато документації  Одночасна розробка  Не потрібно глибоко вникати в нюанси ОС  … o Обов’язкова реєстрація o Сертифікація o Прив’язка до онлайну o Застарілі версії SDK o Потрібно встановлювати SDK o …

ІнструментНеобхідні знання ПлатформиЦінаОсобливості Touch 2 HTML, CSS, JavaScript iOS, Android, Blackberry Free Інсталяція, локальний сервер HTML, CSS, jQuery Мобільні браузери FreeМобільні сайти HTML, CSS, JavaScript, XML Android, iOS, Mobile Web $15-$50 на місяць Drag and drop розробка (web) HTML and CSS iOS, Android, Windows Phone $79 на місяць або реклама Контент, програмування C++iOS, Android, WP. FreeEclipse, компіляція Ruby iOS, Android, WP, BB FreeMotorola

 Proxy objects “bridge”  Близькість до ОС  швидкість  функціональність PhoneGap  Web view  Простота і портативність  Native розширення  Не всі webkit-ти однаково корисні Titanium

  Хашими С. «Разработка приложений для Android»  T. Poulsen K. Whinnery «Building Mobile Applications with Titanium»  apps/ apps/  development-tools/ development-tools/  titanium-and-phonegap titanium-and-phonegap  of_mobile_marketing_and_tagging.aspx of_mobile_marketing_and_tagging.aspx