Категории
(262)
(73)
(42)
SEO
(25)

Создание приложения для Android OS на платформе Titanium Appcelerator

18.07.2011
Автор:

Для начала общая информация о платформе Titanium Appcelerator.

Кроме десктопов, платформа Titanium Appcelerator предоставляет возможность написания приложений также для мобильных телефонов. Соответственно, разработку приложения можно разделить на 2 большие группы: Titanium Desktop и Titanium Mobile.

На сегодняшний день в Titanium Mobile можно писать приложения под телефоны с OS Android, BlackBerry и IPhone. Согласитесь, столь обширный выбор OS, под которые появляется возможность писать приложения, впечатляет. В статье пойдет разговор о написании приложения под OS Android.

Чтобы написать программу под Android, Вам, также, понадобятся знания JavaScript. Вся программа состоит из объектов, которые в нее помещены, причем каждый объект обладает уникальными свойствами и располагает присущими ему методами. Обширный перечень объектов предполагает возможность использования практически всего потенциала OS.

С использованием платформы Titanium Appcelerator для разработки приложения под Android вы получаете выигрыш в скорости (написание приложений на Java куда более затратно по времени, чем написание программы в Titanium с помощью JavaScript). Но быстродействие программ, написанных на Java, заметно выше. Таким образом, при выборе языка программирования мы сталкиваемся с извечной дилеммой: что важнее - быстродействие программы или оптимальные временные затраты на её написание?

Чтобы написать простейшее приложение, достаточно знать несколько объектов раздела Titanium.UI. Наиболее распространены такие:

  • Titanium.UI.Button(вывод кнопки)
  • Titanium.UI.ImageView(вывод изображения из файла)
  • Titanium.UI.Label(вывод текста)
  • Titanium.UI.ScrollableView(вид с полосой прокрутки)
  • Titanium.UI.View(обычный вид, контейнер)
  • Titanium.UI.Window(окно)

Давайте рассмотрим объекты более подробно.

Для начала разберёмся в правилах написания программы. Пожалуй, самым важным аспектом в написании веб приложения является корректное размещения самих объектов. Каждый объект играет уникальную роль и значим по своему.

Среди наиважнейших объектов - Titanium.UI.Window, и создаём мы его с помощью метода Titanium.UI.createWindow. Объект обладает целым списком свойств и методов, под которые мы можем задать объекту фоновый цвет (backgroundColor), прописать его заголовок (title), разместить его там, где нам нужно (left, right, top, bottom) и т.д. Вместе с тем, не стоит забывать о таких методах, как open (открыть окно), add (добавить в объект) и некоторых других.

Ниже подаём пример реализации:

var window = Titanium.UI.createWindow({ // создаем объект Window
   backgroundColor:'red', // окно у нас будет иметь красный цвет.
   title: 'My Root Window' // заголовок окна у нас будет 'My Root Window'
});
window.open(); // и обязательно открываем окно, поскольку без применения метода 'open' у нас программа ничего не выведет

Одним из наиболее часто применяемых объектов является Titanium.UI.ScrollableViewScrollableView представляет собой так называемый "контейнер" с полосой прокрутки. То есть, в объект помещаются другие объекты, и в случае если нам маловато места на экране, к ScrollableView можно подключить полосу прокрутки. Создать такой объект можно с помощью метода Titanium.UI.createScrollView.  Здесь также присутствуют определенные объекты и методы.

В примере указан вывод других объектов с помощью ScrollableView.

var view1 = Titanium.UI.createView({backgroundColor:'red'}); // создаем объекты View с 
var view2 = Titanium.UI.createView({backgroundColor:'green'}); // соответственным фоновым 
var view3 = Titanium.UI.createView({backgroundColor:'yellow'}); // цветом
var scrollView = Titanium.UI.createScrollableView({ // создаем объект ScrollableView
    views:[view1,view2,view3], // указываем содержание ScrollableView
    showPagingControl:true // также указываем, чтобы была видна полоса прокрутки
});
/*
Содержание ScrollableView мы указали при создании объекта.
Но, кроме этого, добавлять другие объекты в ScrollableView можно с помощью метода add.
В нашем случае, вместо указания содержимого в объекте, мы можем написать так:
scrollView.add(view1);
scrollView.add(view2);
scrollView.add(view3);
что будет тоже правильно.
*/
window.add(scrollView); // добавляем объект ScrollableView в наше окно
window.open(); // открываем окно

Использование элемента Titanium.UI.View характерно для ситуации, когда мы размещаем объектов в программе. Проще говоря, элемент View предоставляет как бы контейнер, или же нечто напоминающее div тег. В контейнере мы можем редактировать вид всех остальных элементов, которые в него помещены. Среди наиболее востребованных свойств View - свойства положения и размеров, что не уменьшает роли свойства границы View, или же его фонового цвета.

В следующем примере написано создание объекта View:

var view = Titanium.UI.createView({ // создаем объект View
   borderRadius:10, // радиус углов 10 px. (округление углов)
   borderColor:'blue', // цвет границы синий
   borderWidth: 5, // толщина границы 5 px.
   backgroundColor:'red', //  цвет самого объекта красный
   width:50, // ширина 50 px.
   height:50 // высота 50 px.
});
window.add(view); // добавляем в окно
window.open(); // открываем окно

Следующим по важности элементом является Titanium.UI.Button, или просто кнопка. Специфика его в том, что в программе он необходим для выполнения неких действий. Используя элемент Button, Вы всегда будете иметь дело с событиями. События объекта (и все другие) задаются с помощью метода addEventListener. В самом же методе мы задаем параметр события. Самое распространенное событие - это, конечно же, Сlick, которое запускается одинарным щелчком по элементу (в нашем случае кнопке). Похожим по содержанию событием также является dblclick (происходит при двойном щелчке).

Рассмотрим реализацию объекта Button с реализацией метода addEventListener:

 var button = Titanium.UI.createButton({ // создаем объект Button
   title: 'Hello' // надпись на кнопке будет 'Hello'
});
button.addEventListener('click',function(e) // создаем событие которое будет срабатывать при клике ('click')
{
   Titanium.API.info("You clicked the button"); // при клике у нас будет выведено стандартное информационное окно с соответствененной записью
});

Titanium.UI.ImageView – элемент для вывода изображения. Само изображение можно задать в свойстве image. В свойстве можно задать url изображения, или же полный путь от файла, в котором написана программа. Также при создании элемента желательно указывать его точные размеры.

Чтобы объект ImageView был создан,> достаточно написать следующий скрипт:

var image = Titanium.UI.createImageView({ //  создаем объект ImageView,
    image:'myimage.png',  // где будет отображаться изображение из файл myimage.png
    width:'auto',
    height:'auto' // ширина и высота изображения будет подобрана автоматически
/*
также, если мы хотим указать изображение из интернета, нам достаточно вместо свойства image указать в свойстве url адрес изображения. 
Выглядеть будет так:
   url: 'http://a2.twimg.com/a/1310750171/phoenix/img/twitter_logo_right.png'
 
*/
});
view.add(image); // добавляем изображение в объект view

Ну и какая программа может обойтись без простейшего элемента Titanium.UI.Label? Элемент этот предназначен для вывода текста, в его свойствах, кроме этого, присутствуют размер шрифта, стиль и цвет текста. Не стоит забывать, что для телефонов с OS Android можно писать также и html текст. Использование html открывает для нас существенно большие возможности отображения текста.

Заключение

В статье мы рассмотрели особенности платформы Titanium Appcelerator, узнали о ее возможностях. Также были рассмотрены особенности программирования в Titanium Mobile и, в частности, самые распространенные объекты группы Titanium.UI.

1 vote, Rating: 5

Также по теме

1

В данном посте будут раскрыты основы создания среды для разработки Drupal проектов на основе Debian 6 "Squeeze". Имея даную площадку, каждый сможет попрактиковаться в настройке сервисов ОС,...

2

В предыдущей статье рассказывалось о создании инсталляционных профилей для Drupal 6. В данной...

3

В Drupal 7 API есть целый раздел, который посвящен темизации сайта. Все без исключения элементы сайта должны пройти...

4

При разработке иногда возникает необходимость исполнить такие действия/команды, для которых недостаточно прав или отсутствует доступ к некоторым директориям у пользователя, из-под которого запущен...

5

Одним из весомых преимуществ Drupal 7 перед его предшественниками есть его гибкость в отношении настроек и систем. Разработчики не обошли стороной и запросы к БД. В седьмом релизе они стали...

Need a quote? Let's discuss the project!

Are you looking for someone to help you with your Drupal Web Development needs? Let’s get in touch and discuss the requirements of your project. We would love to hear from you.

Join to peoples who already subscribe