2. Создание проекта
Внимание! Материал обновляется, предыдущую версию можно найти здесь: http://geektimes.ru/post/107308/.
Хотелось бы иметь приложение для редактирования web документов в концепции WYSIWYG, что-то на подобии Mozilla Thimble, но найти такое в Google Play не удалось.
Так как в ai2 реализована работа с текстовыми файлами, возникло желание написать такое приложение самому.
Схема размещения компонентов приложения
Mozilla Thimble вылядит так:
То есть, один из вариантов размещения компонентов такой:
Здесь "Путь до файла" и "HTML код" - текстовые поля для ввода пути до редактируемого файла и редактирования кода.
Кнопка "Открыть" открывает файл по введённому пути, "Сохранить&обновить" - сохраняет изменения в файл и отправляет его в компонент "Браузер".
Текстовые метки "Статус бар 1" и "Статус бар 2" понадобятся для отображения различной информации.
Создание проекта в AppInventor (ai2)
Переходим на сайт http://appinventor.mit.edu/, жмём большую кнопку Create! в правом верхнем углу и логинимся с помощью учётной записи Гугл:
Далее нужно разрешить доступ App Inventor к аккаунту.
После всех процедур появится окно приветствия с описанием текущей версии, в котором жмём Continue.
После этого появится ещё одно окошко, в котором жать нечего, поэтому ждём мимо него.
Система сразу предложит создать новый проект, что и сделаем: вводим название (без пробелов, латиницей и цифрами) и жмём OK.
Общие замечания по работе
Открывшееся после ввода названия проекта окно содержит несколько элементов:
модель экрана телефона с открытой программой (Viewer, в центре левее),
структурированный список доступных компонентов (Palette, колонка слева),
список используемых на данный момент компонентов (Components, по центру справа),
список загруженных медиа-файлов - картинки, звуки (Media, под списком компонентов),
свойства выбранного компонента (колонка справа).
В только что созданном проекте используется только один компонент Screen.
Работа строится так:
настраиваются свойства первого компонента - начального экрана программы Screen1 (надпись в заголовке, ориентация экрана, название приложения, версию и т.д.),
нужный компонент перемещается на экран программы - хватается мышью, перемещается и отпускается в нужном месте на экране создаваемой программы (drag'n'drop),
настраиваются его начальные свойства (в колонке справа),
когда всё готово переходим к программированию работы каждого компонента нажав кнопку Blocks .
Обратно к дизайну всегда можно вернуться нажав Designer .
Из текущего проекта можно выйти в любой момент нажав кнопку "My projects".