- Узнайте о программировании, ориентированном на события
- Разберитесь в различных типах блоков в платформе Thunkable
Вот задания для этого урока:
СОБЫТИЯ
Мобильные приложения основаны на событийно-ориентированном программировании.
Событийно-ориентированное программирование Основано на событиях, а не на выполнении кода сверху вниз. Некоторые программы просто выполняют весь свой код сразу, но мобильные приложения работают в зависимости от того, как пользователь взаимодействует с ними.
Мобильные приложения работают на основе событияхЭто события, которые вызывают выполнение кода. Например, пользователь нажимает на кнопку. Событие - это когда пользователь нажимает на кнопку. А код, который запускается при наступлении этого события, называется обработчик события.
ОСТАНОВИТЬСЯ И ОБСУДИТЬ
Можете ли вы вспомнить, как вы взаимодействуете со своим телефоном и что он делает? Вот несколько, чтобы начать:
- Когда вы нажимаете на значок приложения, оно открывается.
- Когда вы нажимаете кнопку "Отправить" для текстового сообщения, он отправляет его и издает звук.
- Когда вы пытаетесь войти в приложение, оно запрашивает пароль.
Для начала давайте рассмотрим различные части платформы Thunkable.
В Thunkable есть два окна, с помощью которых вы создаете свое приложение. Нажав на Design в верхней строке меню (в левом верхнем углу экрана), вы перейдете в окно Designerгде вы разрабатываете пользовательский интерфейс. Сайт пользовательский интерфейс это все, с чем пользователь может взаимодействовать в вашем приложении. Это могут быть кнопки, панели навигации, текстовые поля, картинки и т. д.
ОКНО КОНСТРУКТОРА THUNKABLE
Список компонентов
Здесь отображаются все компоненты, которые вы добавили в приложение, организованные в иерархическом порядке по экранам.
Рабочее пространство
Вы перетаскиваете свои компоненты на телефон в центральную рабочую область. Вы можете контролировать расположение компонентов, а также их размер.
Добавить компоненты
Вы перетаскиваете визуальные компоненты с этой панели в рабочую область.
Панель свойств
Панель свойств позволяет задать свойства для каждого компонента. Свойства это различные характеристики, которые можно задать для каждого компонента, например его ширину, высоту и цвет. Выберите компонент на макете, а затем вы можете изменить любое его свойство на панели свойств.
Когда кто-то использует ваше приложение, он взаимодействует с вашим пользовательским интерфейсом, нажимая на кнопки, вводя текст и т. д. Вам предстоит решить, что должно делать ваше приложение, и запрограммировать его на выполнение этих действий.
РЕДАКТОР БЛОКОВ
При нажатии на кнопку "Блоки" вы попадаете в Редактор блоков в окно "Редактор блоков", где и происходит весь процесс кодирования. Вы перетаскиваете блоки с панели слева в рабочую область в центре экрана.
Слева находится палитра блоков. В верхней части находятся компоненты пользовательского интерфейса. Каждый компонент в вашем приложении имеет свой собственный набор блоков. Щелкните на компоненте, чтобы показать блоки, которые можно перетащить в рабочую область.
Рабочее пространство для кодирования
Это ваша рабочая область, куда вы перетаскиваете все блоки. Вы можете перемещать их, привязывать друг к другу. Вы также можете удалить ненужные блоки.
Основные блоки
Основные блоки - это стандартные блоки кодирования, которые можно использовать в вашем приложении. Они распределены по категориям в зависимости от их типа и выделены цветом.
Особенности приложения
Это невидимые функции, которые вы можете добавить в свое приложение. Вы можете нажать на одну из них, чтобы добавить ее, а затем задать свойства и перетащить блоки кода для этой функции.
УПРАВЛЯЮЩИЕ СОБЫТИЯМИ
Блоки обработчиков событий в Thunkable имеют золотой цвет и форму открытого блока, поэтому вы можете закрепить блоки внутри него. Эти блоки запускаются только при наступлении данного события.
При нажатии на кнопку
Вы уже использовали эту функцию. Когда пользователь нажимает определенную кнопку, вы хотите, чтобы приложение что-то сделало, например открыло другой экран или отправило сообщение.
При нажатии на элемент ListViewer
ListViewer похож на выпадающее меню, поэтому это событие происходит, когда пользователь выбирает элемент в списке. Приложение должно что-то сделать с элементом, на котором щелкнули.
Когда открывается экран
Это событие используется, когда вы хотите что-то сделать при первом запуске приложения или при переключении на другой экран. Вы можете задать переменные или обновить информацию из облака.
ФУНКЦИИ
Функции Это блоки кода, которые что-то делают. Они могут выполняться много раз в приложении. В Thunkable блоки функций окрашены в фиолетовый цвет. В некоторых языках функции называют методами или процедурами. Они что-то делают, поэтому их можно считать блоками действий.
Сказать
Эта функция позволяет приложению произносить или говорить любой текст, который вы хотите, чтобы оно произнесло.
Запуск таймера и воспроизведение звука
Компонент Timer может начать отсчет. А приложение может воспроизвести звук.
СЕТТЕРЫ И ГЕТТЕРЫ
Зеленые блоки относятся к свойствам компонента.
Светло-зеленые блоки называются геттерыпотому что вы получаете значение свойства.
Текст кнопки1
Текст будет получен и сохранен в переменной numberChoice.
Время таймера1 в секундах
Значение секунд таймера получается и сохраняется в тексте Lablel1, поэтому это значение отображается в метке.
Сеттеры Они имеют темно-зеленый цвет и могут быть привязаны к объекту с открытым слотом на конце. Это позволяет установить значение свойства.
Текст кнопки1
Текст кнопки Button1 установлен на слова "Нажмите на меня!".
Label1.Text
Текст Label1 устанавливается на значение Timer1 "Время в секундах".
Интервал миллисекунд таймера1
Для параметра IntervalMilliseconds (частота срабатывания) таймера Timer1 установлено значение 3000, или 3 секунды.
Совет для менторов
Лучшие практики: Напомните студентам, что это в точности похоже на реальное кодирование. Странная лексика (функции, геттеры, сеттеры), которую мы используем, - это именно то, что используют кодеры.
Наводящие вопросы для студентов: Можете ли вы вспомнить, какие повседневные функции вы выполняете? (Например: испечь пирог, почистить зубы - все, что имеет повторяющиеся шаги). Функции очень похожи на алгоритмы!
Советы для менторов предоставлены при поддержке AmeriCorps.
БЛОКИ ДАННЫХ
Когда вы используете блоки сеттеров, вы можете использовать другие встроенные блоки, которые представляют данные или информацию, которая может быть использована в вашем приложении. Некоторые примеры блоков данных, которые можно использовать, приведены ниже.
Числа
Числовые значения можно использовать в качестве данных в приложении. Эти блоки можно найти в ящике Math в разделе core палитры блоков.
Текст или строки
Текст, иногда называемый строками, можно использовать в качестве данных. Это буквы, слова и предложения, которые можно использовать в приложении. Блоки находятся в ящике Text раздела Core палитры блоков.
Boolean
Этот тип данных имеет только два возможных значения - true или false. Эти блоки могут задавать или проверять "состояние" чего-либо и будут использоваться в условных обозначениях, о которых вы узнаете больше.
ДЕЯТЕЛЬНОСТЬ: УЧЕБНИК ПО ЗВУКОЗАПИСИ
Следуйте видеоинструкции ниже
Затем следуйте приведенному ниже видеоролику Дэйва, чтобы использовать обработчики событий и функции для воспроизведения речи в вашем приложении.
ГЛАВНАЯ
В процессе деятельности вы использовали:
- Блоки обработчика событий
- Функциональные блоки
Давайте попробуем использовать некоторые блоки setter и getter, добавив их в приложение Soundboard.
Когда пользователь нажимает на любую картинку, чтобы воспроизвести связанную с ней речь, измените фоновый цвет экрана.
Вы можете изменить его на один определенный цвет, но затем вы не сможете легко вернуть его к исходному цвету, черному, поэтому вместо этого измените фон экрана на случайный цвет.
Подсказка: посмотрите в ящике "Цвет", чтобы узнать, как получить случайный цвет.
РЕФЛЕКСИЯ
Теперь, когда вы узнали немного больше о различных блоках кода, подумайте о решении вашего приложения:
ОБЗОР ОСНОВНЫХ ТЕРМИНОВ
- Пользовательский интерфейс - все в вашем приложении, с чем пользователь может взаимодействовать
- Конструктор - Окно, в котором вы можете добавлять компоненты в приложение и разрабатывать их внешний вид
- Редактор блоков - окно, в котором вы создаете блоки для своего приложения
- Событие - то, что происходит и вызывает выполнение кода
- Обработчик событий- блоки кода, которые сообщают вашему приложению, что делать при наступлении того или иного события
- Событийно-ориентированное программирование - программирование на основе событий, а не выполнение всего кода сверху вниз
- Функции - Блок кода, который выполняется и может быть выполнен несколько раз
ДОПОЛНИТЕЛЬНЫЕ РЕСУРСЫ
Ознакомьтесь с другими учебными пособиями Дэйва Вулбера по Thunkable на сайте draganddropcode.com
Студенческий посол Минакши Наир бесплатно курс "Thunkable на Udemy - еще один отличный ресурс!
