Как работать в режиме блоков

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

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

Если в приложении несколько экранов, то клик по кнопке переведет в режим программирования текущего выбранного экрана

Внешний вид режима блоков описан в этой статье.

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

Виды блоков программирования

Блоки программирования делятся на встроенные и блоки компонентов. Ссылки на описания встроенных блоков можно найти на Карте изучения MIT App Inventor. Описания блоков есть в каждом компоненте.

Здесь же опишем основные виды и общий принцип их работы.

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

Блоки компонентов делятся на три вида: события, методы и свойства.

События

Блоки событий — это специальные блоки в App Inventor, которые реагируют на действия пользователя или изменения в программе. Они запускают определенный код, когда происходит какое-то событие, например:

  • встряхивание телефона,
  • нажатие кнопки,
  • изменение текста в поле ввода.

Окрашены в желтый цвет, как и блоки управления.

Методы

Блоки методов — это команды, которые выполняют определённые действия с компонентами приложения. Они позволяют управлять элементами интерфейса, обрабатывать данные и изменять свойства объектов во время работы программы. То есть они — те самые команды, которые запускаются с помощью событий.

Окрашены в фиолетовый цвет, как и блоки процедур (по сути, они и являются локальными процедурами).

Свойства

Блоки свойств в App Inventor позволяют получать и изменять параметры компонентов приложения. Делятся на два вида (и имеют две окраски):

  • изменение свойств (темно-зеленая заливка) — позволяют изменять свойства компонента;
  • получение данных свойства (светло-зеленая заливка) — позволяют получить текущее значение свойства компонента.

Системные (служебные) блоки

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

Не обязательно наличие всех видов блоков у компонентов. Например, у компонента Надпись есть только блоки свойств.

Процесс программирования

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

Как правило, последовательность следующая: происходит событие → выполняются определенные команды (методы и изменение свойств). На нашем сайте в проектах игр и приложений логика работы подробно разобрана.

Вроде бы все просто. Но для удобства использования на рабочем поле ещё есть несколько фич, делают программирование в MIT App Inventor более комфортным.

Контекстное меню

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

Общее контекстное меню

Общее контекстное меню предназначено для работы со всеми блоками сразу или программой в целом. Неактивные на данные момент пункты меню будут недоступны.

  • Paste (Вставить) — вставляет информацию из буфера обмена.
  • Undo, Redo (Отменить, Повторить) — отменяет или повторяет последнее действие.
  • Clean Up blocks (Очистить блоки) — автоматическое упорядочивание блоков.
  • Свернуть все блоки — сворачивает все блоки.
  • Развернуть блоки — разворачивает все блоки.
  • Select all blocks (Выделить все блоки) — выделяет все находящиеся на поле блоки.
  • Удалить *число* блоков — удаляет все блоки с поля.
  • Download Blocks as image (Загрузить блоки как картинку) — делает скриншот поля со всеми блоками и сохраняет в виде картинки.
  • Hide/Show Workspace controls (Скрыть/показать кнопки управления) — скрывает или показывает кнопки управления (Корзина, Рюкзак, масштаб, ошибки).
  • Упорядочить блоки по горизонтали/вертикали — выравнивает блоки по указанному направлению, не перемещая их при этом в одну линию, как Clean up blocks. Просто наводит порядок в имеющихся столбцах/строках.
  • Отсортировать блоки по категориям — сортирует блоки по категориям.
  • Enable/Diapble all blocks (Включить/выключить блоки) — активирует или выключает блоки на поле.
  • Show/Hide all comments (Показать/скрыть все комментарии) — показывает или скрывает комментарии к блокам. Комментарии обозначаются вопросительным знаком на блоке.
  • Copy all blocks to backpack (Скопировать все блоки в рюкзак) — копирует все блоки с поля в рюкзак.
  • Paste all blocks from backpack (Вставить все блоки из рюкзака) — добавляет на поле все блоки из рюкзака.
  • Enable/Diable workspace Grid (Показать/скрыть сетку) — показывает или скрывает сетку разметки рабочего поля.
  • Remove unused blocks (Удалить неиспользуемые блоки) — удаляет неиспользуемые блоки.

Контекстное меню блоков

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

  • Copy (Копировать) — копирует блок.
  • Создать копию — копирует и вставляет на поле выбранный блок.
  • Добавить комментарий — добавляет комментарий (наличие комментария обозначается вопросительным знаком на синем фоне).
  • Свернуть/развернуть блок — сворачивает/разворачивает блок.
  • Отключить/включить блок — активирует или деактивирует блок.
  • Удалить *число* блоков — удаляет блок и связанные блоки.
  • Download blocks as png (Загрузить блок в формате png) — выгружает блок в виде картинки в формате png.
  • Add to Backpack (Добавить в рюкзак) — добавляет блок вместе со связанными блоками в рюкзак.
  • Make Generic (Сделать общим) — превращает блок конкретного компонента в общий блок, который может относится к любому из компонентов заданного типа. Например, если в приложении несколько кнопок, чтобы не программировать нажатие каждой по отдельности, можно создать общий блок для всех кнопок. К примеру, проигрывать звук щелчка.
  • Справка — открывает документацию MIT App Inventor (на английском языке).

Режим блоков в App Inventor — это мощный инструмент для визуального программирования, который позволяет создавать мобильные приложения без написания кода вручную. Освоив основные принципы работы с блоками, вы сможете:

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

Режим блоков делает программирование доступным даже для новичков, но требует внимания к структуре кода. Со временем вы научитесь создавать чистые, эффективные и понятные проекты.