Продолжение истории создания мобильного приложения NUMERO2 с помощью App Inventor.
Выбор данных из списка реализован в отдельном экране, в котором также предусмотрена операция удаления.
В верхней части экрана расположены три кнопки:
- Отмена – закрыть экран без сохранения выбора
- Выбрать – закрыть экран и передать результат выбора
- Удалить – удалить выбранную запись
В центре – список, который не только отображает данные о людях, но и позволяет производить поиск (фильтрацию) по вхождению.
Также для работы понадобятся не визуальные компоненты:
- TinyDB1 – работа с локальным хранилищем данных
- Noifier1 – уведомление для подтверждения удаления записи
Переменные
Начинаем с декларации переменных для хранения данных. Они необходимы для промежуточного хранения выбранного результата, а также для хранения основного списка с данными.
| Переменная | Тип | Назначение |
|---|---|---|
| BDate | Текст | Дата рождения в формате DD.MM.YYYY |
| Name1 | Текст | Фамилия |
| Name2 | Текст | Имя |
| Name3 | Текст | Отчество |
| NameList | Список | Список людей с указанием дня рождения |
| NameIndex | Число | Индекс выбранного в списке человека |
Добавляем блоки глобальных переменных, инициализируем их пустышками.
А при запуске экрана заполняем данными из хранилища:
Так вот, принятый мной не совсем оптимальный формат хранения данных обусловлен соблазном выполнить загрузку данных в визуальный компонент списка одной командой:
В следующем проекте я более тщательно продумаю этот момент, при необходимости создав для загрузки данных процедуру.
Выбор из списка
При выборе срабатывает событие, в обработчике которого нужные данные (дата рождения, фамилия, имя и отчество) извлекаются и помещаются в переменные:
До тех пор, пока пользователь не нажал кнопку “Выбрать”, данные никуда не уходят, а при нажатии они сохраняются в хранилище процедурой StoreData():
Сохранение данных немного отличается от того, которое используется в главной форме, так как необходимо записывать значение NameIndex – индекса выбранной записи. В любом случае на экране потребуется отдельный экземпляр этой процедуры, так как не существует “межэкранных” переменных или процедур.
Удаление
Для удаления необходимо сначала выбрать элемент (определить значение переменной NameIndex). Затем нажать кнопку “Удалить”, которая отображает уведомление с подтверждением:
Если пользователь подтвердит действие нажатием кнопки “Удалить”, то данные удаляются из списка NameList, сохраняются в хранилище и выполняется обновление визуального компонента:
И тут мы наблюдаем очередной косяк локализации: вместо “удалить элемент списка” отображается “заменить элемент списка”, что может очень сильно подпортить настроение желающим разобраться, как работает данный блок.
Закрыть и простить
Для того, чтобы закрыть экран выбора без изменения текущего выбора нажимаем кнопку “Отмена”.
Задача выполнена. Я предлагаю простить разработчикам неточности русского перевода. И в дальнейшем пользовать английским интерфейсом, так как что-то мне подсказывает, что в обозримом будущем никаких исправлений локализации не ожидается.
Итоги
Пройдя по тропинке создания реального приложения в среде разработки App Inventor, вы познакомились с основными элементами, на которые нужно уделить внимание:
- Экраны
- Переменные
- Списки
- Локальное хранилище
- Данные обрабатывать отдельно от представления данных
- Создание, редактирование и удаление элементов списка
Представленное на суд публики решение не совсем стандартное, возможно я вскоре добавлю описание “классического” экрана, в котором одновременно будет и поля редактирования и табица список.
И конечно же меня, как и многих подписчиков, интересует, как записывать данные в удаленную базу для совместного использования? Я работаю над этим вопросом. Пока могу лишь добавить, что простого решения не будет. Пробовал подключать Google-таблицы, но не смог победить обновленную систему безопасности. Работа через API своего веб-сервера выглядит убедительно, но очень сложно, опять же сначала нужно создать этот самый сервер и его API. Остаётся FireBase – готовое решение от Google…
Продолжение следует…