Что такое PhoneGap?

Когда в далеком 2008 году компания Apple открыла магазин App Store, где стали предлагаться приложения для операционной системы iOS, этот сервис мгновенно стал популярен во всем мире. С тех пор Apple продала уже более 18 миллиардов копий программ, а аналогичные конкурирующие площадки были созданы практически для всех мобильных платформ. Исторически сложилось так, что для создания нативного приложения для той или иной платформы разработчик должен был уметь работать с конкретной интегрированной средой разработки (IDE), а также с тем или иным объектно-ориентированным языком, например, C++, Objective-C или Java. Я, например, имею базовое представление об Objective-C и Java, но мне гораздо ближе веб-технологии – HTML, CSS, JavaScript. Как было бы здорово, если бы я смог воспользоваться уже имеющимися навыками при написании нативных приложений! Так давайте же познакомимся с PhoneGap – платформой для написания приложений с поддержкой HTML5, которая позволяет создавать нативные приложения с использованием веб-технологий, а также предоставляет доступ к уникальным мощным API. Я пользуюсь PhoneGap уже пару лет, программирую нативные приложения для iOS, мои лучшие работы представлены в Apple App Store даже несмотря на то, что они написаны на стандартных веб-языках. Любой специалист, разбирающийся в HTML5 и обладающий глубокими знаниями CSS и JavaScript, может на собственном опыте убедиться, что веб-языки вполне могут потягаться в функциональном отношении со своими нативными аналогами (фактически на веб-языках не пишутся программы лишь одного типа – трехмерные игры). Еще одно преимущество этого подхода заключается в том, что PhoneGap не является платформо-специфичным. Это значит, что если у вас есть единая база кода (хотя бы на обычном HTML) – PhoneGap легко упакует его в нативном виде практически для любой мобильной платформы: например, Apple iOS, Google Android, Windows Phone 7 и т.д. Таким образом, вы приобретаете широчайшие возможности, поскольку значительно экономится время, затрачиваемое на кроссплатформенную разработку, а также не приходится изучать целый букет языков программирования. Итак, теперь мы в общих чертах представляем, что такое PhoneGap, и я предлагаю рассмотреть базовую настройку этой среды для Apple iOS (одной из наиболее популярных мобильных платформ). Наша цель – сделать так, чтобы по завершении настройки вы могли писать HTML-код, который мгновенно упаковывался бы в виде нативного приложения для iOS!

Требования

Перед началом работы у вас в распоряжении должны быть: • Mac с операционной системой Mac OS X (версия Snow Leopard или Lion); • Xcode (эту среду можно бесплатно скачать из Mac App Store); • Последняя версия PhoneGap.

Установка

Начнем с установки Xcode. Поскольку Xcode является основной средой разработки для операционных систем Apple Mac и iOS, эта программа довольно велика (1,7 Гб), но при этом ей не занимать мощности. После того, как вы скачаете Xcode из Mac App Store, в папке «Applications» (Приложения) на вашем компьютере появится ярлык под названием «Install Xcode» (Установка Xcode). Запустите установщик и следуйте всем указаниям мастера – оставьте все настройки такими, как они заданы по умолчанию. Справившись с этим, можете приступать к установке PhoneGap. Просто распакуйте его, перейдите в каталог «iOS», запустите установщик и дождитесь, пока он закончит работу (опять же, оставьте все настройки такими, какими они заданы по умолчанию). Ура! Теперь среда разработки настроена, и вы готовы создать в Xcode свой первый проект с применением PhoneGap (пока все просто, правда?).

Настройка проекта

Откройте Xcode и выберите в основном меню «New» (Новый), а потом «New Project» (Новый проект). Далее выберите из меню «iOS > Application» (iOS → Приложение) опцию «PhoneGap-based Application» (Приложение на базе PhoneGap). Далее укажите для вашей программы имя продукта (Product Name) и идентификатор компании (Company Identifier). Эти значения остаются на ваш выбор. После этого шага вам будет предложено выбрать место для сохранения вашего приложения. Теперь вы должны увидеть ваш проект в Xcode. Если попытаться запустить его на этом этапе (опция «Run»), система выдаст вам сообщение об ошибке вида «index.html was not found» (не удалось найти страницу index.html). Чтобы решить эту проблему, нужно скопировать в проект каталог «www». Перейдите в каталог вашего проекта в диспетчере (здесь он называется «Finder») или щелкните по проекту в Xcode правой кнопкой мыши (в левом навигационном окне), далее щелкните в диспетчере команду «show» (показать). ВАЖНО: перетащите каталог «www» в Xcode под именем проекта в левом навигационном окне (см. следующее изображение) Если все было сделано правильно, то вам будет предложено несколько опций (см. следующее изображение). Обязательно убедитесь, что выбрали опцию «Create folder references for any added folders» (Создать ссылки на все добавленные каталоги), после этого нажмите «Finish» (Готово). Теперь, если попытаться запустить ваш проект (команда «Run»), откроется содержимое файла «index.html», который уже заполнен – чтобы вы могли убедиться, что настройка PhoneGap прошла успешно. После этого проект можно редактировать как самое обычное веб-приложение. Чтобы привыкнуть к работе в Xcode, рекомендую внести какие-нибудь мелкие изменения в файл «index.html». Как только вы изучите эти основы, вы сможете перейти к более сложным операциям и попробовать добавить собственный код JavaScript. На данном этапе рекомендую познакомиться с jQuery Mobile – это очень мощный фреймворк, специально рассчитанный на работу с мобильными приложениями. Он отличается гибкостью и очень удобен в использовании. Вот и все. Вы пополнили ряды разработчиков под iOS. На самом деле все еще интереснее: теперь вы сможете портировать написанный вами код на любую другую платформу, которая поддерживается в PhoneGap! Источник: Introducing PhoneGap

Новый рекламный формат в наших телеграм-каналах.

Купить 500 символов за $150