Как разработать приложение для андроид самостоятельно.

App Inventor от MIT – это, пожалуй, самый простой способ научиться этому, но если вы совсем не знаете, с чего начать, то начните с этого руководства, оно расскажет вам обо всех основах разработки собственного приложения для Android при помощи специального образовательного инструмента App Inventor.

кодинг под андроид

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

Данное руководство нацелено на тех, кто желает обучиться основам использования App Inventor, и написано оно было в надежде на то, что больше людей станут производить, а не только потреблять.

Содержание:

  1. Введение
  2. Системные требования
  3. Разработка
  4. Кодинг и тестирование
  5. Тестирование
  6. Шэйринг и продвижение
  7. Выводы

1. Введение

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

Для большинства технология, на которой основаны сотни и тысячи приложений – темный лес. Это что-то такое особенное, что знают и умеют только специально обученные программисты, которые заняли свою нишу и получают прибыль за исследования, разработку и продвижение всех этих приложений. Но что если у вас есть собственная идея для следующего «стартапа», или хотя бы идея для простенького, но очень полезного приложения, которое имеет право на жизнь, но при этом у вас нет ни малейшей мысли о том, как создавать его и при этом вы не желаете рассказывать свою идею незнакомому разработчику, чтобы тот украл ее и выпустил приложение от своего имени? Еще совсем недавно, если бы вы попали в такую ситуацию, то у вас был бы следующий выбор:

  • 1  Ничего не делать;
  • 2. Осмелиться доверить свою идею кому-либо еще, кто сможет разработать приложение;
  • 3. Развить собственные навыки в программировании.

Но сегодня у не-программистов тоже есть все шансы. Недавно, благодаря сотрудничеству между Google и MIT, процесс разработки мобильных приложений стал доступен практически любому, и сегодня вы тоже можете воспользоваться App Inventor – веб-платформой, которая делает 3 пункт из вышеприведенного списка доступным каждому!

1.1 Для кого это руководство?

С помощью этого бесплатного и open source ПО у каждого человека появляется возможность сделать свой вклад в цифровое сообщество. App Inventor делает процесс разработки мобильных приложений более визуальным, более интуитивным. Это очень простой и забавный способ для тех, кто заинтересован в научиться программированию, и в то же время довольно продуктивный инструмент для продвинутых программистов. Важно отметить, что несмотря на то, что проект находится совсем в начальной стадии – скажем, бета-версии, — данная платформа уже способна предложить объемный набор инструментов программирования различных уровней, и она идеально подходит для обучения. На самом деле, основное назначение данного инструмента, судя по высказываниям MIT/Google, это предоставить надежный образовательный инструмент людям, заинтересованным в программировании, будь то молодые энтузиасты, или специализированные классы в школах или университетах. Конечно же, целевая аудитория практически не ограничена.

  • 1.1.1 Наставники

В сегодняшним изобилием компьютерных технологий в наших жизнях, можно с уверенностью утверждать, что практически все современные учебные заведения дают ученикам и студентам прочную базу компьютерных знаний. App Inventor как раз идеально подходит для этого. Благодаря визуальному характеру работы с данной платформой, студенты без труда и очень быстро смогут «состряпать» свое первое приложение. К тому же, платформа предоставляет забавный и очень продуктивный метод обучения компьютерам для детей, а это в долгосрочной перспективе может

  • 1.1.2 Не-программисты

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

  • 1.1.3 Продвинутое программирование (Профессиональные программисты)

Платформы также можно использовать для нечто большего, чем для образовательных целей. Так как она предлагает все необходимые компоненты для создания продуманных приложений, вряд ли App Inventor можно называть несерьезным проектом. С помощью него программисты получают возможность создавать релевантные программы, включающие в себя следующие технологии:

  • GPS, определение направления устройства и его движения
  • SMS-сообщения
  • Сканирование штрих-кодов
  • WiFi, Bluetooth
  • Технологии распознавания речи и функции транскрибирования речи в текст
  • Технологии использования базы данных и подключения к веб-базам (при помощи облачных хранилищ)
  • Возможность воспроизведения аудио и видео медиафайлов
  • Интеграция с социальными сетями
  • Технология Mindstorms NXT от Lego

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

  • 1.1.4 Прототипирование

Возможно изначально Google/Mit и не предполагали о такой перспективе использования, но многие подметили, что этот инструмент абсолютно точно может идеально подойти различным консультантам и системным программистам, которым нужно быстро представить своим клиентам прототип приложения, чтобы получить общую оценку, — и все это благодаря визуальному редактору. Визуальный редактор даже позволяет вам создавать полноценные макеты без необходимости писать хотя бы одну строку кода.

Итак, приветствуем вас в мире разработки приложений для Android-устройств. В этом руководстве я хочу рассказать вам об App Inventor – о системных настройках и основных аспектах онлайн среды разработки. Также здесь будет представлена простенькая программа типа “Hello, World!”, и обсуждение некоторых опций, доступных для дистрибуции новых приложений.

2. Системные требования

App Inventor – это онлайн среда разработки или Online Development Environment (ODE), это означает всё происходит прямо в веб-браузере. Так что, если вы являетесь обладателем более-менее современного компьютера, то считайте, что вы уже выполнили все системные требования. Если же нет, не стоит бояться. Процесс настройки будет очень понятным и простым.

2.2 Аппаратное оснащение и ПО

Сначала нужно убедиться в том, что ваша система поддерживается платформой, и что браузер имеет все необходимые поддержки, и что вы обладаете свежей версией Java. К тому же, рекомендую вам перепроверить, не включен ли какой-нибудь блокировщик скриптов в веб-браузере.

Чтобы начать работу, вам потребуется одна из следующих ОС:

  • Windows XP, Vista, 7
  • Mac OS/X 10.5, или выше.
  • NU/Linux (Debian 5, Ubuntu 8.04+)

Минимально, вам придется установить какой-нибудь из этих браузеров:

  • Firefox 3.6+
  • Chrome 4.0+
  • Apple Safari 5.0+
  •  IE 7+

2.3 Java

Что касается Java, то в официальной сводке написано, что вам нужно использовать Java 6 (то есть версию 1.6). На момент написания данной статьи, в интернете можно было скачать Java 7, но для нашей сегодняшней статьи я решил воспользоваться все же 6-й версией. Чтобы удостовериться в том, что на вашем компьютере поддерживается Java, пройдите на странице тестирования Java.

java

Если вам компьютер настроен правильно, то вы увидите надпись “Your Java is working…”. Если же нет, то вам нужно будет последовать инструкциям, представленным на сайте Java для настройки.

App Inventor также требует наличия в компьютере фреймворка Java Web Start, и ваш браузер должен поддерживать запуск Java-приложений. Насчет этого не стоит сильно беспокоиться, просто пройдите на страницу тестирования App Inventor Java Web Start, чтобы запустить текст. “Первая часть” теста запустится автоматически, когда вы загрузите страницу, и если браузер настроен правильно, то вы должны увидеть сообщение “Your browser appears to be configured properly.”.

проверка совместимости java

Чтобы запустить «Часть 2» конфигурации теста, на той же странице нажмите по кнопке “Launch” Эта приведет к открытию простого Java “блокнота”, который вы можете просто закрыть.

2.4 Аккаунт Google

Еще вам понадобится аккаунт в Google. Это необходимо потому, что ваши проекты, как минимум в процессе разработки, будут храниться в Google Cloud. Преимущество этого требования заключается в том, что вы сможете осуществлять доступ к своим проектам откуда угодно, где есть интернет. Если у вас есть аккаунт, то не забудьте авторизоваться в него. Если же нет, вы можете зарегистрироваться в Google по ссылке: http://gmail.com

2.5 Программное обеспечение.

Эта платформа бесплатная и распространяется по принципу open source, что означает, что использовать данное ПО можно бесплатно, скачав его с сайта App Inventor. В зависимости от вашей системы, выберите нужную ссылку ниже, и проследуйте дальнейшим инструкциям, приуроченным к вашей ОС.

2.6 Ресурсы

Перед тем, как продолжить, важно отметить некоторые иные ресурсы, которыми вы можете воспользоваться:

3. Разработка приложений для андроид

Разработку можно разделить на три фазы, которые могут (и желательно должны) проходить параллельно:

  • Разработка интерфейса
  • Программирование
  • Тестирование

Несмотря на то, что в нашем сегодняшнем руководстве мы будем реализовать эти фазы пошагово, в самом конце вы увидите, насколько удобно и важно то, что эти фазы могут следовать в любом порядке. Вдобавок, несмотря на то, что разработка приложения может быть привязана к мобильному устройству, так как у некоторых людей могут быть другие способы подключения к мобильным устройства и во избежание возможных проблем, мы воспользуемся эмулятором, включенным в ПО. Теперь, перед тем, как продвинуться дальше, убедитесь, что вы уже авторизовались в ваш аккаунт Google.

3.1 Hello World

Обычное приложение “Hello World”, которое я сегодня хочу вам представить, поможет мне рассказать вам о технике разработки кода, ввода, вывода, а также принципах взаимодействия с пользователем, чтобы вы могли поближе познакомиться с этой средой разработки.

Чтобы начать, перейдите на этот сайт и нажмите по кнопке “Invent”. Это перенесет вас в панель управления личными проектами. Нажмите по кнопке “New” в левом верхнем углу, чтобы начать новый проект, и задайте предпочитаемое название. Вы можете задать любое название, но для нашего руководства я буду использовать HelloCoolWorld (все в одно слово). Далее нажмите ОК.

3.1.1 Окно разработки

Перед вами должно появиться окно разработки сразу после того, как вы введете название приложения и нажмите ОК. С этого окна вы начнете работу,  а точнее создадите внешний вид, то, как оно будет представлено конечному пользователю.

создаем приложение

В левой панели на экране вы можете видеть Palette (Палитру), которая работает как и в других визуальных платформах, когда вы просто перетягиваете нужные компоненты на проект. Например, это могут быть текстовые блоки, кнопки, ярлыки, элементы соединения с базой данных, медиафайлы, или сенсорные объекты – все, что вам понадобится для работы вашего приложения. Компоненты группируются по функциональности – Базовые, медиа, анимация, социальные, сенсорные и так далее, — и клик по определенной группе раскрывает перед вами присущие данной группе компоненты. Вы заметите, что здесь представлено довольно много всего интересного, с чем захочется поэкспериментировать.

В центре перед вами будет расположена панель Viewer (Просмотр) с наброском экрана устройства под названием Screen1, куда вы и будете помещать объекты компонентов, формирующих приложение, будь то кнопки или текстовые блоки. Справа от этой панели вы можете видеть панель Components, которая предлагает вам список всех объектов вашего приложения, включая объект Screen1, а панель Properties (Параемтры) позволяет вам осуществлять доступ к и устанавливать определенные параметры объектов вроде шрифта, цвета или текста.

Сначала нам нужно создать способ, посредством которого пользователь сможет взаимодействовать с приложением, поэтому перетяните объект Button из palette на Screen1 в панели Viewer, и в параметр Text впишите “Click Me”, а затем переключите параметр Width (Ширина) на Fill parent (охватить весь родительский элемент).

скриншот

Дальше, конечно же, нам понадобится что-то, что будет происходить в тот момент, когда пользователь кликает по этой кнопке. Так что, давайте добавим объект Image (изображения) и Label (ярлык) на Screen1 по тому же принципу, по которому мы добавляли кнопку. Для Image1 мы можем установить изображение, кликнув по области ввода текста в параметре Picture и кликнув по Upload new (Загрузить новое).

загрузка содержимого

В открывшемся диалоговом окне нажмите кнопку Browse. Выберите какое-нибудь заранее скачанное изображение.

Установите параметр Visible (Видимость) на hidden (скрыть), а параметр ширины Width на Fill Parent, как мы это уже делали ранее.

ширина экрана

В панели Components выберите Label1. Установите его параметр Text на blank (пустой), TextAlignment (выравнивание текста) на center, а Width на Fill Parent.

Text

Теперь нам нужно добавить функциональности ко всем этим объектам при помощи Blocks Editor, который является Java-приложением.

4. Разработка кода и тестирование

На самом деле, кода здесь очень мало, и весь процесс сопровождается тестирование в реальном времени при помощи эмулятора (либо на Android-устройстве). Преимущество Blocks Editor заключается в том, что довольно большая часть «разработки кода» происходит за счет визуального процесса соединения различных элементов программирования – объектов, методов и параметров, — представьте, будто вы собираете частички паззла, в которых закодированы определенные функции и свойства. Это позволяет системе автоматическим образом проводить валидацию при соединении элементов. Все это позволяет вам создавать очень гибкие проекты.

4.1 Работаем с Blocks Editor

Нажмите на кнопку “Open the Blocks Editor”, расположенную в верхнем правом углу окна Design. Если перед вами появится диалоговое окно, в котором вас будут спрашивать о том, стоит ли сохранить файл или запустить его, смело запускайте его прямо в браузере.

эмулятор

Таким образом мы запускаем Java-приложение Blocks Editor. Эта программа гарантирует вам контроль над всем функционалом каждого компонента приложения.

4.2 Запускаем эмулятор

Нажмите по кнопке “New Emulator” в самом верху окна Blocks Editor. Это приведет к открытию эмулятора Android-устройства. Это может занять несколько минут. Скорость загрузки будет зависеть от способностей вашего компьютера. Перед вами появится окно под названием “Starting the emulator. Please be patient.” (пер. – Запускаем эмулятор. Пожалуйста, проявите терпение), в котором вам будет представлена некоторая полезная информация. Когда будете готовы, нажмите ОК. Как только все полностью подгрузится, перед вами появится окно, которое выглядит как мобильный телефон. Нажмите и потяните зеленую кнопку блокироваки слева-направо, чтобы разблокировать телефон.

Вернувшись в Blocks Editor, нажмите по кнопке Connect to Device… (Подключиться к устройству…) и из выпадающего списка выберите эмулятор. Опять же, это может занять какое-то время, пока компьютер подключится к устройству (эмулятору). Как только соединение будет успешно установлено, вы увидите небольшую зеленую иконку мобильного телефона в верхней части Blocks Editor. Вы также сможете видеть ваш проект в эмуляторе.

4.3 Разрабатываем код и тестируем его при помощи Blocks Editor и эмулятора

В Blocks Editor выберите вкладку My Blocks и нажмите по Button1. Перед вами откроется вкладка с методами данного объекта, а также здесь будут представлены параметры, которые вы можете применить к объекту, и настроить таким образом, чтобы получить желаемый функционал.

редактор

Для примера, перетащите метод Button1.Click из этой вкладки на рабочую область справа.

сделать кнопку

4.3.1 Добавляем картинку

Нам нужно, чтобы когда пользователь нажимал на кнопку, в приложении появлялось изображение, а также сообщение “Hello Cool World!”, которое мы выставим в качестве ярлыка. Итак, давайте перетащим набор Image1.Visible на метод из вкладки Image1, и поместим его в Button1.click.

Вы заметите, что теперь у нас остался пустой элемент стыковки (сокет), к которому мы можем что-нибудь прикрепить. Итак, вернитесь во вкладку Built-In в верхнем левом углу экрана, и во вкладке Logic выберите True и прикрепите его к сокету Image1.Visible путем перетаскивания.

Теперь мы можем протестировать приложение, переключившись на эмулятор и кликнув по кнопке Click Me.

тестирование

4.3.2 Добавляем сообщение

Нам также нужно, чтобы под изображение показывалось сообщение. Вернувшись ко вкладке My Blocks в Block Editor, как мы уже делали с изображение, перетаскиваем набор Label1.Text на метод из вкладки, и помещаем его в объект Button1.Click. Вернувшись во вкладку Built-In, откройте вкладку Text и перетяните Text на объект Button1.Click. Нажмите по полужирному тексту в этом элементе, и впишите туда “Hello Cool World!”.

добавляем текст

Вернувшись в эмулятор, мы повторяем тестирование. Теперь при нажатии по кнопке перед нами появляется еще и сообщение.

текст под картинкойЭто, конечно же, можно отпраздновать, так как только что вы разработали свое первое мобильное приложение! Оно очень простое, но ведь и учиться нужно с малого. Чем дальше – тем более сложные и комплексные продукты вы сможете разрабатывать. Продолжайте исследовать, и наслаждайтесь процессом!

5. Тестирование

Здесь в принципе не о чем рассказывать, так как в платформу включен java-эмулятор, который позволяет нам разрабатывать и тестировать одновременно. Это очень удобно и продуктивно, так как вы можете сразу видеть внесенные изменения, и сразу же определять недочеты, которые можно быстро исправить.

6. Продвижение приложения(рекламирование)

Представление вашего продукта на рынке мобильных приложений подразумевает некоторый процесс так называемой «упаковки». Здесь вам нужно будет упаковать детище в специальный формат приложений для Android — .apk.

6.1 Управление версиями

Важно правильно указывать версии, если вы хотите рекламировать и распространять свое приложение. Это реализуется на странице Design, при помощи параметров VersionCode и VersionName у Screen1. VersionCode – это целое значение, которое следует увеличивать при выходе каждого крупного и мелкого обновления. VersionName может быть чем угодно, но обычно здесь указываются две цифры, разделенные точкой – первая цифра отвечает за основную версию вашего приложения, а вторая – за версию исправлений и дополнений.

6.2 Чтобы все о нём узнали!

Чтобы поделиться вашим приложением с пользователями Android, нам для начала нужно создать .apk-файл, кликнув по кнопке Package for Phone в окне Design.

раскручиваем приложение

Как только ваш пакет будет готов, вы сможете сохранить его на компьютер.

архив apk

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

6.2 Google Play – Android-маркет

Чтобы приложение попало в Google Play, сначала убедитесь, что вы правильно выставили версию, и указали правильное название, как было отмечено в разделе 5.1. Как только вы разберетесь с версиями, и скачаете ваше приложение на компьютер, как было показано в разделе 5.2, вы будете готовы для загрузки приложения в Google Play… по крайней мере, почти готовы.

добавление приложение в гугл плей

Вам нужно будет зарегистрироваться как разработчику в Google Play и уплатить незначительный сбор, чтобы иметь возможность публиковать приложения. Просто следуйте инструкциям по ссылке, и уже скоро вы станете новоиспеченным разработчиком.

7. Завершение

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



Comments

  1. Ответить

  2. By Николай

    Ответить

    • By admin

      Ответить

  3. By Гришка

    Ответить

    • By Правосудие

      Ответить

  4. By Slavqa

    Ответить

  5. Ответить

  6. By Михаил

    Ответить

  7. By Сергей

    Ответить

  8. Ответить

  9. By Алексей

    Ответить

  10. By Алексей

    Ответить

  11. Ответить

  12. Ответить

  13. By Иван

    Ответить

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>