И снова здравствуйте уважаемые! Наконец-то мы приступаем к разработке! Ура, Товарищи! Сегодня будет гораздо меньше текста и картинок и больше пищи для размышления и натурных эксперимеинтов тэт-а-тэт со своим компьютером, уже без моих статей. Но это только на сегодня, а в дальнейшем мы продолжим. Еще много интересного, так что не спешите отписываться. Уже через день-другой, хорошенько отдохнув, приступим к грызне гранита науки с новыми силами.
Итак, работа над мобильным приложением начинается с создания проекта. И хотя звучит это довольно громко, но на самом деле, всё довольно просто и легко. Вы смотрели детективы? Так же как следователь заводит новое дело, точно так же происходит и создание проекта. Следователь берёт папочку, подписывает её "Дело № ... Жулика Копчёного" и постепенно наполняет её разными материалами. Ну, как-то так... Проект создается очень просто. Открываем нашу среду.
И выбираем последовательно вкладки: "Файл >> Новый >> Значение по умолчанию". Сделали? -Отлично! Результатом этих действий будет следующее окно.
В этом окне две строки. В верхней прописан путь до папки где среда будет сохранять все ваши проекты. Этот путь можно поменять, если хотите. Думаю вы и сами с этим справитесь, подсказывать не буду. А во второй строке, нужно дать имя вновь создаваемому проекту. Проект, -это всего лишь папка, куда среда разработки будет складывать все ваши документы имеющие отношение к проекту. Исходный код, необходимые рисунки, макеты рабочих окон, звуковые файла и тому подобное. Важное замечание. Хотя среда может работать с кириллическими названиями файлов, но лучше давать имена всё же на английском. Это устоявшаяся программистская практика. Если вы работаете в команде, (а команды легко могут быть интернациональными), вашим иностранным коллегам будет проще разобраться в вашей писанине м коде. Так что привыкайте, пока не поздно. Если не знаете английского, можете писать на немецком, это тоже допустимо, на крайний случай, пишите транслитом. То есть латинскими буквами, русский текст например так: "moy_pervy_proekt".
А теперь откройте папку, куда среда сохраняет ваши проекты. У меня это здесь: "D:\Basic4android\projects". Видите, среда создала папочку с заданным нами названием? Она выделена курсором.
Давайте откроем эту папку и посмотрим из чего состоит наш проект. Это полезно в ознакомительных целях.
В папке ничего сверхъестественного нет. Там три рабочих файла и две служебные папки. Вот и всё. Назначение этих файлов и папок мы разберём позже, а теперь, самое долгожданное, кодинг! То есть РАЗ-РА-БОТ-КА!!!
Закрываем всё лишнее кроме нашей среды и видим:
На рисунке я выделил две области кода которые отвечают за работу нашего проекта. И обратите внимание, среда всё сделала за вас в автоматическом режиме! Всё отлично, -но что же делает наше приложение и как оно выглядит на телефоне? Сейчас всё расскажу и покажу! Чтобы посмотреть как выглядит наше приложение откройте вкладку "Конструктор >> Открыть конструктор". Куда нажать, показывает красная стрелка. Смотрите рисунок.
Ничего не произойдет. Помните, я говорил, что среда для конструктора открывает отдельное окно. И это очень удобно, если вы работаете с двумя мониторами. Можно вывести окно на второй монитор, чтобы не мешало. Но я прекрасно справляюсь и на ноутбуке с одним экраном. Второе окошко располагается здесь. Смотрите рисунок.
Второе открытое окно, окно конструктора, прячется за пиктограммкой B4A, на панели задач. Нажатие мышью, показывает, что спрятано два окна и немного увеличивает их, чтобы вы решили, какое вам нужно. Щелкаете на окне конструктора. Оно отмечено на рисунке выше красной стрелкой.
Откроется окно конструктора, в котором нам и предстоит работать в ближайшее время. На основное окно с кодом программы можно пока не обращать внимания. До тех пор, пока мы основательно не изучим работу с визуальным конструктором, к изучению самого языка БЕЙСИК, мы даже приступать не будем. Выше я уже говорил почему, позвольте повторю для тех, кто только подключился и читает этот урок в качестве первого.
Работать с визуальными компонентами просто и легко. Тут не нужно математического мышления (оно и при программировании нужно лишь в особо редких и сложных случаях). Нужно уметь перемещать компоненты (кнопки, флажки, надписи, переключатели, картинки)по макету формы и задавать им те или иные свойства (размеры, положение на экране, цвет, тип и размер шрифта) в окне свойств компонентов. Но освоив это нехитрое дело вы уже сможете зарабатывать как разработчик интерфейсов! Согласитесь, это хороший стимул в дальнейшем изучении! В интернете множество площадок, где вы можете продавать свои творения. Разработка интерфейсов похожа на работу в графическом редакторе. Если вы знаете, как работают в графическом редакторе, -то ответьте мне на вопрос. Когда и насколько объёмный программный код вы писали, для создания в вашем любимом фотошопе какой-нибудь картинки? Что, что вы говорите? Там не нужно писать никакого кода? -Я вас поздравляю! Для разработки интерфейса тоже не нужно писать никакой код! Но для этого нужно знать как работает визуальный конструктор. Поэтому давайте сейчас быстренько объясню, что где расположено и что за что отвечает. Смотрите рисунок ниже.
Самая главная область, обведена рамкой желтого цвета. Это зона разработки макета экрана вашего телефона/планшета. Сейчас мы не подключали никакого устройства, и среда по умолчанию выбрала размер экрана, закрасив его в темно-серый цвет. Темно розовый квадрат, -это макет кнопки на телефоне, нажав на которую, запустится наша программа и выведет сообщение "Hello World". Ползунок в левом верхнем углу этой области, это линейка масштабирования. Она нужна для удобства работы с макетом экрана разных размеров. Кружок со стрелками -это джойстик сдвига экрана вправо-влево и вверх-вниз. Область обведенная голубой рамкой, -это окно свойств выбранного компонента. Именно здесь мы будем задавать параметры для наших виджетов (графических элементов интерфейса)кнопок, надписей, картинок, переключателей и т.д. Область выделенная зеленым, -это дерево компонентов. Оно показывает иерархию размещения элементов, по аналогии со слоями в графическом редакторе. Розовая область, -область скриптов. Здесь прописывается поведение объектов: позиция на экране, занимаемое место и т.п. Подробнее работу всех инструментов мы разберём в следующих статьях.
Как видите, всё очень просто. Вы долго изучали эту статью, но создание самого проекта занимает буквально считанные минуты. Разработка же интерфейсов при должном навыке и сноровке вообще, плёвое дело.
В следующей статье, мы с вами посмотрим видео работы нашего приложения и поговорим о подключении телефона к компьютеру.
А теперь я прощаюсь с вами, надеюсь было интересно?