Приклади mit app inventor 2. MIT App Inventor – кожен може створити мобільний додаток. Блоки App Inventor. Важливі поняття та принципи

Installing the Windows software for App Inventor Setup має дві частини:

Installing the App Inventor Setup software package. Цей крок є саме для всіх Android пристроїв, і для Windows XP, Vista, Windows 7, 8.1, і 10.
Якщо ви збираєтеся використовувати USB-кабель, щоб підключитися до вашого пристрою, то вам потрібно використовувати drivers for Windows для вашого Android телефону.

NOTE: App Inventor 2 не працює з Internet Explorer. Для Windows users, we recommend using either Chromeабо Firefox є вашим інструментом для використання з App Inventor.

Installing the App Inventor Setup software package

You must perform the installation from an account that has administrator privileges. Installing via a non-administrator account is currently not supported.

Якщо ви налаштовуєтеся на попередньої версії програми App Inventor 2 setup tools, ви будете потрібні для того, щоб налагодити цю версію. Натисніть на те, як на Update Inventor Setup Software.

Locating the Setup software

У більшості випадків, App Inventor повинен бути здатний до місцезнаходження програмного забезпечення на своєму сайті. Але якщо вона використовується для розміщення software, path to enter is C:\Program Files\Appinventor\commands-for-Appinventor. Якщо ви використовуєте 64-бітні машини ((How to tell if you"re on 64-bit Windows) , ви повинні type Program Files (x86) повторюють те, що Program Files. , Це було налаштоване в вашій місцевої директорії ще в C:\Program Files.

In this post I'm going to introduce you to the MIT App Inventor 2 software and I'm going to show you what you need to quickly get started building Android apps that interact and control your Arduino.

Here’s the contents that are going to be covered in this post:

Why MIT App Inventor 2 is a good choice?
Accessing MIT App Inventor 2
How to control Arduino with MIT App Inventor (Bluetooth)
MIT App Inventor Overview
Projects with MIT App Inventor
Android Apps для Arduino with MIT App Inventor 2

Introducing MIT App Inventor 2

MIT App Inventor 2 є простим і бездоганним сервісом для створення Android applications. Якщо ви збираєтеся запустити з MIT App Inventor, ви не хочете, щоб завантажити або завантажити будь-який програмний матеріал в комп'ютері, який є cloud-based, ви можете побудувати apps безпосередньо в вашому браузері (Chrome, Mozilla, Safari, Internet Explorer , etc).

Для того, щоб тільки вам потрібна мережа Інтернету для будівництва apps.

Why MIT App Inventor is a good choice?

MIT App Inventor 2 is intuitive and simple to use.
Ви не маєте досвідчених в програмуванні або дизайні, щоб побудувати чудові apps, які можуть використовувати stuff.
Creating the design is as easy as selecting and placing widgets in the smartphone screen.
Code is done with drag and drop puzzle blocks.

Anyone може дізнатися, як побудувати свої власні додатки з MIT App Inventor 2 з трьома днями практики.

Accessing MIT App Inventor 2

Найбільші Bluetooth модулі використовуються з Arduino є HC-05 bluetooth, HC-04 і HC-06.

Для більш докладної інформації про bluetooth module, ви можете check this blog post:

Bluetooth module works with serial data. Це означає, що Arduino sends information і Bluetooth module receives it via serial (and vice-versa).

Наступні цифри показують, що інформація проходить від Android app до Arduino.

Ваш smartphone sends information до Bluetooth module via Bluetooth. Then, Bluetooth module sends the information via serial communication to the Arduino. Цей фон також працює над іншим способом: Arduino sends information до Bluetooth module that sends it to smartphone via Bluetooth.

MIT App Inventor Overview

Це є хід-на-кінець тренування для того, щоб побудувати cool Android applications for Arduino, even with no prior experience! A collection of 8 + 1 Projects.

I hope you’ve found this post useful.

MIT App Inventor 2- середовище візуальної розробки, що дозволяє легко створити програму для Android пристроївнавіть не володіючи знаннями у сфері програмування.
Працює це середовище розробки прямо із браузера. Завантажувати та встановлювати нічого не потрібно. Отриманий результат можна переглядати на Android-пристрої. Готові програми можна розміщувати в Play Market. App Inventor 2 підтримує російську мову.
Відразу, при старті, з'являється можливість створити свою унікальну програму, наприклад програму, яка може керувати іншими bluetooth-пристроями (Проста Bluetooth машинка на Arduino), ну або гру на смартфон.
В онлайн редакторі MIT App Inventor 2 програми будуються на базі стандартних компонентів, які є основним елементом розробки додатків Android. В інтернеті наведено багато прикладів, як використовувати комбінацію блоків, компонентів, щоб вийти той додаток, який ми хочемо зробити.

Вікно конструктора
У цьому вікні налаштовується як виглядатиме програма (які елементи відображатимуться на екрані тощо). Подивившись на вікно конструктора, ви побачите, що воно складається з декількох областей:

palette (палітра) - область, де показані доступні компоненти. Палітра поділено на секції.
viewer (перегляд) - область, куди додаються компоненти і де ви працюєте з ними. У цій області можна подивитися, як ваш додаток буде виглядати на вашому смартфоні.
components (компоненти) - область, де показуються використовувані компоненти. Компоненти в цій області можна перейменовувати або видаляти, також зручна для їх редагування за допомогою Properties.
media (медіа) -область куди завантажуються використовувані картинки та аудіо.
properties (властивості) - область де редагуються властивості компонентів: колір, розмір тексту, шрифт та інше.

Вікно редактора блоків
У цьому вікні ми налаштовуємо поведінку нашого смартфона при впливі на нього будь-яких зовнішніх факторів. Наприклад, при натисканні на клавішу на екрані смартфона подається сигнал вітання або при зміні стану датчиків (акселерометра, датчика наближення тощо) гасне екран смартфона для економії енергії акумуляторної батареї.

Погодна станція в MIT App Inventor 2 – програма погодної станції для android телефонівстворене за допомогою онлайн сервісу.

Дана погодна станція описана у статті, де ми робили огляд роботи погодної станції, створювали скетч для arduino та пристрій погодної станції. Ну а сьогодні ми розберемося докладніше як створити програму для android і відобразити всі отримані дані з нашої погодної станції на телефоні.

Для створення програми погодна станція в MIT App Inventor 2 не знадобиться:

1. Фонове зображення розміром 540х960 пікселів (розмір фонового зображення залежить від розміру екрана пристрою)

2. Іконка програми для головного екрана 128х128 пікселів (у форматі PNG32)

3. Іконки кнопок у додатку у двох кольорах, розміром 80х80 пікселів

Коли ми підготували всі необхідні зображення для програми, можна розпочинати роботу в MIT App Inventor 2. Для початку нам знадобляться такі компоненти:

ListPicker1 – для запуску Bluetooth підключення, вибору доступних Bluetooth пристроївта режиму відображення стану підключення
Label3 – резервна для відображення додаткової інформації (тимчасово не працює, можна не додавати)
Label1 – для відображення даних з arduino
Label2 – для відображення напису (температура в кімнаті, температура на вулиці, тиск і т.д.)
HorizontalArrangement1 – режим вирівнювання елементів по горизонталі, у нашому випадку кнопок перемикання режимів)
Button1 – кнопка увімкнення режиму “температура на вулиці”
Button2 – кнопка увімкнення режиму “температура в кімнаті”
Button3 - кнопка включення режиму "тиск в мм.рт.ст."
Button4 – кнопка включення режиму “Вологість у %”
Button5 – кнопка відключення (невидима)
Clock1 – таймер
BluetoothClient1 – компонент для роботи з Bluetooth (отримання та надсилання даних)

Тепер перейдемо в режим блокового програмування в MIT App Inventor 2 Для початку пропишемо функціонал для ListPicker

потім для таймера

для отримання даних через bluetooth

для кнопок 1-4

для кнопки вимкнення

Після всіх пройдених етапів розробки тестуємо програму на телефоні, і перевіряємо працездатність.

Збільшити вбудовану функціональність App Inventor можна за допомогою веб-технологій та розширень. У мережі можна знайти платні та безкоштовні розширення (близько 200 на puravidaapps.com), але виникають питання, а наскільки складно створювати свої, що вони можуть дати і чи варто витрачати час на це чи краще зайнятися чимось іншим?

Усі компоненти та блоки, доступні в App Inventor, відносяться до вбудованих (внутрішніх), а розширення – до зовнішніх.

Вбудовані можливості надають цікаву функціональність для користувачів-початківців, задовільну для досвідчених і недостатню для програмістів. При цьому більшість користувачів вважають за краще завантажувати готові розширення, а не розробляти їх. З цього випливає простий висновок у тому, що розробка розширень може бути цікава, переважно, досвідченим користувачам та ентузіастам. Початківців цілком влаштують вбудовані можливості та наявні розширення, а програмістам займатися розширеннями не цікаво через необхідність виконання подвійної роботи. Навіщо витрачати час на створення та налагодження розширення обмеженої функціональності, а потім за допомогою нього створювати програму обмеженої функціональності, якщо можна відразу писати код на Java, користуючись усіма доступними можливостями Android Studio IDE та Android API?

Створювати розширення для AI нескладно, якщо є якийсь досвід програмування та розуміння основ ООП, але з вищевказаних причин цим серйозно займаються одиниці. Створювати функціональні розширеннянепрактично, а ось написання простих доповнень для розширення вбудованої функціональності або створення нової може здатися цікавим та корисним у плані практики заняттям. Але тут треба визначитись із підходом. Можна або слідувати концепції AI - візуальне програмуванняабо розширити її елементами текстового програмування.

Якщо сказати грубо, то App Inventor схожий на айсберг, верхівка якого помітна користувачам у вигляді вбудованої функціональності, а під водою знаходиться і недоступна значно більша частина. Це зроблено спеціально відповідно до призначення цієї IDE, що вимагає від користувачів мінімальних знань програмування. Закладена в App Inventor модель роботи не розрахована на велику функціональність. Додавання нових властивостей викликає зростання кількості блоків у геометричній прогресії. Наприклад, додавання властивості прозорості призведе до появи двох блоків для кожного віджету (для встановлення та повернення значення). Якщо таких віджетів 5, число блоків збільшиться на 10. Додали 10 властивостей, на виході отримали 100 блоків. Додатково до цього з'являться нові поля властивостей дизайнера. У цих умовах підхід "проста IDE + розширення" виглядає обґрунтованим, але не для тих, хто віддає перевагу хорошій функціональності "з коробки" без необхідності пошуку та встановлення доповнень.

Індивідуальне налаштування властивостей об'єктів та завдання жорсткого зв'язку блоків на етапі розробки програми, з одного боку, спрощує розробку та дозволяє уникнути великої кількості помилок, але призводить до виникнення статичних додатків. Якщо до одного блоку приєднано інший блок, це назавжди. Змінити властивість або вибрати інший об'єкт на етапі виконання програми можна лише в тому випадку, якщо ця можливість була закладена на етапі розробки. Для цього необхідно використати опосередкований доступ до об'єктів. Наприклад, можна створити список пар “назва об'єкта – об'єкт” для всіх об'єктів, а потім використовувати його у функціях для доступу до різних об'єктів. У цьому випадку приймаючий блок буде пов'язаний не з конкретним об'єктом, а зі списком, з якого потрібний можна отримати за його ключем-іменем.

Якщо до сказаного вище додати складнощі з реалізацією групових операцій, відсутністю віджетів, методів та інших нюансів вбудованої функціональності, стане зрозумілою причина появи AppyBuilder, Thunkable, Makeroid та інших., у яких збільшення функціональності реалізовано рахунок кількості компонентів. Більше компонентів – більше блоків. А ось за допомогою розширення можна збільшити функціональність якісно, наприклад, використовувати один блок для доступу до десятків властивостей десятка об'єктів. Ось це вже дійсно цікаво, оскільки доповнює візуальне програмування текстовими елементами для компенсації низки недоліків вбудованої функціональності AI.

Чи зможуть створювати розширення ті, хто слабо знайомий із програмуванням? Так, прості зможуть, скориставшись підходом "скопіюй і зміни", але певна підготовка все ж таки потрібна. Без неї буде незрозуміло, чому розширення не компілюється і що при цьому пишеться на екрані. Також слід сказати про те, що частина розширення, що працює з об'єктами Android, зручніше створювати та налагоджувати в Android Studio.

Розробка розширень підійде тим, кого в принципі влаштовує App Inventor, але хотілося б щось доповнити, поліпшити і спростити, а заразом і попрактикуватися в Java. Якщо це ваш випадок, то почнемо з розгортання середовища розробки.

ВКонтакті є група Розширення для App Inventor, де на відео та в текстовому вигляді дано покрокове керівництвостворення та налаштування робочого середовища, а також простий приклад, що повертає слово Test. Дублювати цей матеріал не має сенсу, а ось сам приклад розглянемо як швидке введення в тему.

package vlad; import com.google.appinventor.components.runtime.*; import com.google.appinventor.components.annotations.DesignerComponent; import com.google.appinventor.components.annotations.DesignerProperty; import com.google.appinventor.components.annotations.PropertyCategory; import com.google.appinventor.components.annotations.SimpleEvent; import com.google.appinventor.components.annotations.SimpleFunction; import com.google.appinventor.components.annotations.SimpleObject; import com.google.appinventor.components.annotations.SimpleProperty; import com.google.appinventor.components.common.ComponentCategory; import com.google.appinventor.components.common.PropertyTypeConstants; import com.google.appinventor.components.common.YaVersion; import com.google.appinventor.components.runtime.util.SdkLevel; @DesignerComponent(version = YaVersion.NOTIFIER_COMPONENT_VERSION, категорія = ComponentCategory.EXTENSION, description = "Тим є простий тест", nonVisible = true, iconName = "images/notifier.png") @SimpleObject(external=true) public final class extends AndroidNonvisibleComponent implements Component ( public TestExtension(ComponentContainer container) ( super(container.$form()); ) @SimpleFunction(description = "This function returns the \"Test\" string") public String Test() ( return "Test " ; ) )

Код розширення включає java-код класу і анотації, що починаються з символу @. Анотації використовуються для вказівки на те, що блок коду під ними повинен бути оброблений простим компілятором. Простий компілятор переглядає анотації та здійснює інтеграцію розширення в середу розробки App Inventor - створює для зазначеної функції блок (функції або властивості), поле редагування в дизайнері та виконує іншу роботу.

@DesignerComponent вказує на Загальні параметрикомпонента і те, що він відноситься до категорії розширень і є невізуальним (в даний час можна створювати лише невізуальні компоненти розширення)

@SimpleObject вказує на компонент, а поле external=true на те, що компонент є зовнішнім

@SimpleFunction вказує компілятор функцію, для якої потрібно створити блок. Якщо функція повертає значення, виїмка з'явиться в його лівій стороні. Якщо функція має параметри, відповідні їм виїмки будуть у правій стороні.

Вихідні коди класів можна переглянути в директоріях, що відповідають назвам пакетів:

com/google/appinventor/components/runtime – класи вбудованих об'єктів.
com/google/appinventor/components/annotations - класи інструкції
com/google/appinventor/components/common - класи загального користування
com/google/appinventor/components/runtime/util - класи утиліт

В даний час за допомогою розширення можна створити лише невізуальний компонент. Якщо необхідно створити візуальний компонент, що перетягується на робоче поле дизайнера, як і будову віджети, то для цього знадобиться своя локальна копія App Inventor.

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