Мобильное приложение: особенности разработки на примере «Тестирование: Отчеты»

Публикация № 790070

Разработка - Мобильная разработка

мобильное приложение тестирование

В данной статье мы расскажем, с какими проблемами столкнулись и как их решили при создании мобильного приложения «Тестирование: Отчеты» для платформы 1С. Приложение доступно в google play + есть возможность посмотреть работу в демонстрационном режиме.

Рассмотрим основные моменты на наш взгляд по реализации мобильного приложения на платформе 1С. В качестве примера будем использовать приложение для просмотра данных по результатам тестирования для конфигурации «Тестирование 3.0».

Приложение доступно в Google Play (поиск выполняйте по словосочетанию «Тестирование 3.0: Отчеты» или по ссылке в конце статьи). Оно предназначено для отображения результатов тестирования на мобильном устройстве совместно с конфигурацией "Тестирование 3.0".

1. Демонстрационный режим

Для демонстрации работы и возможностей приложения мы добавили режим - «демо». В этом случае приложение для построения отчетов и графиков использует сохраненные заранее в макете данные и не требует соединения с сервером.

 

Технически данные для демонстрации хранятся в плоской таблице с двумя колонками «url» и «текстовые данные». Пример таблицы можно увидеть на рисунке ниже.

В функции выполнения запроса вставили проверку на наличие режима и при положительном условии сразу возвращаем данные из макета по соответствию url запроса. В случае отсутствия соответствия возвращается пустая строка, что может соответствовать ошибке.

Данный функционал удобно использовать при прототипировании интерфейса приложения, выполнения отладки, тестирования.

2. Авторизация

1С пока не поддерживает windows авторизацию в мобильном приложении, поэтому для обеспечения безопасности и подключения к серверу внутри сети предприятия мы используем VPN-канал (any-connect или другое приложение). Если без VPN, то рекомендуем обязательно использовать SSL.

На форме «Авторизация» мы реализовали сохранение настроек входа в приложение, что позволило упростить процедуру ввода необходимых данных. Доступны следующие комбинации:
а) сохраняются автоматически последние введенные данные после успешного входа и всегда отображаются при запуске (сервер, имя базы, логин, ssl);
б) при включении настройки «сохранять пароль» будет сохраняется пароль пользователя. 

3. Дизайн форм приложения

Мобильное приложение должно иметь дизайн, позволяющий комфортно обрабатывать информацию.

Шрифт не должен быть мелким, в таблицах не должно быть излишнее число колонок, число элементов управления должно быть минимальным (два блока оптимально). Глубина операции не должна быть излишней (кликабельность) - оптимально не более 3х.

Отображение форм должно быть простым, а не перегруженным и излишне сложным. Ниже на картинке приведен пример в сравнении «сложной» формы с «легкой».

Раскройте все опции сразу

Адаптируйте приложение к изменению положения экрана (вертикально или горизонтально). 

4. Получение данных

Мы используем для обмена информацией SOAP, REST сервисы. При разработке удобно использовать технологию REST (нет жесткого описания формата данных). 

Был выбран «JSON» формат для передачи данных. С ним довольно легко работать. Тип передаваемых данных всегда структура. У структуры обязательно определено несколько основных полей – «ТипОбъекта», «Проверка», «Дата». Свойство «ТипОбъекта» используется для идентификации режима отображения и может содержать следующие значение: График, Таблица, HTML.

Приведем пример кода для преобразования ответа сервера из формата «JSON» в стандартный тип данных 1С (см. справку для более подробной информации):

    ЧтениеJSON = Новый ЧтениеJSON;
    ЧтениеJSON.УстановитьСтроку( Строка );
    Данные = ПрочитатьJSON( ЧтениеJSON ,, ИменаСвойствСоЗначениямиДата );
    ЧтениеJSON.Закрыть();

5. Фоновое получение и обновление данных

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

Реализовать это удалось, связав механизм фоновых заданий, хранилище настроек и обработчик ожидания. Логически процесс работы с фоновыми заданиями выглядит стандартно:
а) при открытии формы мы проверяем режим получения данных. Если асинхронно, то запускаем фоновое задание, в качестве ключа передаем имя формы.
б) запускаем фоновое задание и в хранилище настроек пишем признак того что задание запущено и не выполнено. Функция в фоновом задании по завершению в хранилище настроек записывает результат по переданному ранее ключу.
в) далее подключаем обработчик ожидания с минимальной длительностью в «0.1 с». (если канал хороший и данных не очень много, то синхронный режим справляется замечательно и быстрее чем с фоновым)
в) в функции при выполнении обработчика ожидания проверяем наличие в хранилище настроек признака выполнения по ключу.

Интерфейсно мы сначала активируем вкладку «знак загрузки» и показываем знак длительной операции, а потом по готовности данных переключаемся на вкладку с данными. Картинка ниже демонстрирует описанную схему.

6. Получение информации по изменению ориентации экрана

Для определения события изменения ориентации необходимо использовать функцию формы «ПриИзмененииПараметровЭкрана».

Для получения информации о текущем состоянии окна – вертикально или горизонтально используем функцию «ПолучитьИнформациюЭкрановКлиента». Приведем немного кода в качестве примера:

    Массив = ПолучитьИнформациюЭкрановКлиента();
    Если Массив.Количество() Тогда
        ИнформацияЭкранаКлиента = Массив[0];
        Если ИнформацияЭкранаКлиента.Высота<ИнформацияЭкранаКлиента.Ширина Тогда
            Результат = «Горизонтально»;
        Иначе
            Результат = «Вертикально»;
        КонецЕсли;
    КонецЕсли;

7. Использование таблиц и большого количества отображения данных

Фильтруйте данные, отображайте постраничный вывод – это позволит повысить отзывчивость приложения и упростит визуальную обработку информации пользователем.

На формах с таблицами используем фильтр с опциями: «все», «только ошибки», «только падения», «только пропуски».
Мы используем ограниченное количество колонок, все служебные поля обязательно скрываем. Подробную информацию выводим только в детализации.

8. Глобальные параметры, настройки

Практически всегда требуется использовать по отдельности или все вместе: какие-либо глобальные опции, настройки, сохранение значений реквизитов на управляемых формах (в мобильном приложении пока нет автосохранения реквизитов). Для решения всех этих задач совместно реализован механизм описанный в п.12. 

В нашем приложении мы используем глобальный параметр «Тестируемый клиент». В десктопном приложении, мы выводили его в верху формы, и пользователь мог спокойно выбрать его или изменить, но в мобильно приложении существует проблема размещения. Поэтому мы вынесли эту настройку, а изменение значения реализовали в отдельной форме. Перейти к нему возможно из пункта меню. 

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

9. Используем иконки вместо текста

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

В нашем приложении для информирования:

 - о результатах последнего теста используем следующую картинку:   (пропуск, успешно, в работе, ошибка, провал) 

 - о результатах сводке за последние 5 заданий - картинки в форме перехода от солнышка к тучкам

10. Использование цветов на диаграммах и графиках

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

Не стоит использовать произвольные цвета или обратные. К примеру, для понятия «да» использовать красный цвет или иной не подходящий, а для «нет» использовать зеленый.

11. Используем АБ-тестирование

Используйте АБ-тестирование для определения выбора варианта дизайна форм

12. Используем поле HTML

Иногда удобно использовать поле html для отображения информации. Мы в нашем приложении используем данный вариант в сводке по дефектам - для вывода общей информации по тестам с ошибками.

13. Сохранение настроек и параметров

Пока в мобильных приложениях нет функционала сохранения настроек на формах, реквизитов в формах и хранилища общих настроек. Поэтому для решения этого вопроса мы создали свое решение:
а) создали регистр сведений «ОбщееХранениеНастроек» (измерения: КлючОбъекта, КлючНастроек,Пользователь и ресурсы: Настройки (хранилище значения));

б) написали три функции в общем модуле «УправлениеОбщимХранилищемНастроек» – СохранитьНастройкиПользователя, ЗагрузитьНастройкиПользователя, УдалитьНастройкиПользователя (код функций тривиальный – запись значения в регистр сведений, чтение и удаление по параметрам);

Используем этот функционал практически везде: для сохранения настроек авторизации, передачи параметром от фонового задания инициатору и сохранению реквизитов, сохранения настроек отображения форм и др.

14. Демонстрация бета версии и сбор замечаний от первых пользователей

Оформляем приложение и запускаем его использование в ограниченном кругу лиц. В результате получаем первые отзывы по юзабилити, недостатках и другие советы, и замечания. В этот круг могут входить коллеги (заинтересованные лица), можно дать жене, детям, тете или дяде (не заинтересованным лицам).

По результатам обратной связи мы уже изменили некоторый функционал и внесли доработки в интерфейс. Также будем ждать отзывов и советов сообщества.

 

Дополнительно

а) Конфигурация «Тестирование 3.0» с набором плагинов и обучающим материалом доступна на GIT hub: https://github.com/ivanov660/TestingTool-3/.
б) Мобильное приложение доступно по адресу: https://play.google.com/store/apps/details?id=ru.polyplastic.mobile.Testing.Reports.
 

Скачать файлы

Наименование Файл Версия Размер
Сборка МП ru.polyplastic.mobile.Testing.Reports-arm

.apk 27,10Mb
12.03.18
2
.apk 1.1.145 27,10Mb 2 Скачать

Специальные предложения

Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. Сурикат 307 14.03.18 22:52 Сейчас в теме
В статье вы упомянули о xUnit. А подскажите в каких случаях вы используете ваш фреймоврк, а в каких xUnit
Или в каких используете оба =)

Огромное спасибо за статью!
2. ivanov660 2158 15.03.18 09:42 Сейчас в теме
1. xUnit - мы используем для создания функциональных тестов (проверка функций и процедур, создания документов, заполнения документов и др.). Использование в процессе разработки программистом.
2. Обработку "Менеджер сценарного теста" - мы используем для создания и выполнения сценарных UI тестов. Проверки функционала пользовательского интерфейса в рамках выполнения какого-либо бизнес процесса. Чуть позже мы опубликуем статью пример использования данного функционала (пока в процессе написания видео-урока).
3. Soap UI - мы используем для проверки http,soap сервисов.
4. Конфигурация тестирование 3.0 используем для:
а) хранения результатов тестирования в базе. В текущий момент поддерживаются форматы Allure, JUnit (можно написать обработку загрузки на любой другой).
б) отображения результатов тестирования
в) запуск и управление регламентными заданиями выполнения тестов (можно провести аналогию с Jenkins, к примеру)
г) выполнения и отражения ручных тестов
д) в дальнейшем планируется доработать функционал оценки экономической составляющей автоматизированного тестирования (ROI, Расчет выгоды, Эффективность автоматизации)
е) еще появится функционал интеллектуального нагрузочного тестирования и многое другое...
5. Мобильное приложение - коннектор с конфигурацией "Тестирование" для получения представления результатов тестов на телефоне. Довольно удобно анализировать результаты выполненных тестов добираясь на работку в автобусе). В планах разработка МП для управления и мониторинга выполнения заданий.

P.S. На GIT HUB уже сейчас предложено достаточно обучающего материала для практической интеграции фреймворка.
Оставьте свое сообщение

См. также

Внешние компоненты. Мобильное приложение 1С Промо

Разработка внешних компонент Мобильная разработка v8::Mobile 1cv8.cf Абонемент ($m)

Пример применения технологии внешних компонент для мобильной платформы 1С (Android)

1 стартмани

17.02.2017    41467    flyer    35    

EGAIS Scan - приложение для ТСД

Терминал сбора данных Мобильная разработка Оптовая торговля Розничная торговля Учет ТМЦ Оптовая торговля Розничная торговля Учет ТМЦ v8 УТ10 УПП1 УТ11 КА2 Россия УУ Абонемент ($m)

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

1 стартмани

17.04.2019    5275    MrChe    2    

Внешние компоненты мобильной платформы 1С для ОС Андроид

Разработка внешних компонент Мобильная разработка v8::Mobile Абонемент ($m)

На трех простых примерах описана процедура разработки внешних компонент для Андроид. Статья написана по мотивам доклада на конференции INFOSTART 2018 EDUCATION.

31.01.2019    15642    IgorKissil    25    

Применение цифровой подписи при организации учёта ТМЦ и ГСМ

Защита и шифрование Управление бизнес-процессами (BPM) Мобильная разработка v8::Mobile v8::Бизнес-процессы 1cv8.cf Абонемент ($m)

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

1 стартмани

25.10.2018    7213    ikekoval    2    

Hello world на metadata.js Промо

Инструментарий разработчика WEB Мобильная разработка v8 1cv8.cf Абонемент ($m)

Про браузерные offline-first приложения можно написать миллионы слов. Сэкономлю своё и ваше время и перейду сразу к делу. В статье не будет рекламы и агитации за новые технологии, не будет критики традиционных или попсовых решений. Рассмотрим по шагам разработку простейшей программы на metadata.js. Постараюсь сделать акцент не на том «как это сделано», а «почему сделано именно так»

1 стартмани

11.08.2016    56957    unpete    208    

Тестирование: Просмотр результатов тестов в предприятии 1С – Allure Skin

Инструментарий разработчика Тестирование и исправление v8 1cv8.cf Абонемент ($m)

В данной статье мы расскажем об инструменте, который позволяет просматривать результаты тестирования в удобном и наглядном формате: общий обзор, с историей выполнения, с полной детализацией; в разрезе тестируемого приложения и номера проверки.

1 стартмани

10.05.2018    20822    6    ivanov660    18    

Мобильный клиент + HTTP Сервис + Расширение конфигурации

Мобильная разработка v8 v8::Mobile 1cv8.cf Россия Абонемент ($m)

Пример использования Мобильного клиента, http сервиса и расширения. 10.04.2018 фирма 1С выпустила релиз 8.3.12.1412, с долгожданным мобильным клиентом. Платформа содержит еще ряд долгожданных функций, например возможность работы с расширением через хранилище, но разговор пойдет именно о Мобильном клиенте.

1 стартмани

16.04.2018    30310    dsdred    27    

Сборка мобильного приложения 1С под IOS

Мобильная разработка v8 v8::Mobile Абонемент ($m)

В статье представлена инструкция по сборке мобильного приложения 1С под iOS с использованием бесплатного аккаунта разработчика Apple.

1 стартмани

29.01.2018    27382    Isonic    51    

Google OAuth и мобильное приложение

Мобильная разработка Обмен данными 1С Внешние источники данных WEB v8 v8::Mobile 1cv8.cf Абонемент ($m)

Об аутентификации для работы с сервисами google из мобильного или настольного приложения

1 стартмани

29.08.2017    11412    stveans@gmail.com    3    

Мобильное приложение 1С и приложение Java. Совместная работа через Intent. Часть 1. Запуск приложения Java из 1С

Практика программирования Мобильная разработка v8::Mobile 1cv8.cf Россия Абонемент ($m)

Пишем два приложения - конфигурацию на мобильной платформе 1С и приложение Java Android Studio. На примере рассматриваем совместное использование двух приложений через Intent. Публикация состоит из 3 частей: Часть 1. Запуск приложения Java из 1С Часть 2. Получаем данные в 1С из приложения Java Часть 3. Отправляем данные в приложение Java из 1С.

1 стартмани

20.04.2017    27824    user621724_Dimav1979    20    

Push сообщения с использованием Firebase cloud message

Мобильная разработка v8::Mobile Абонемент ($m)

Используем новую технологию FCM, отправляем пуши на устройства на базе Android, инициируем вызов сервера клиентом с самого сервера.

1 стартмани

06.04.2017    38288    nbeliaev    92    

Интеграция типовой конфигурации с мобильным приложением

Практика программирования Мобильная разработка v8 Абонемент ($m)

В данной статье речь пойдет о том, как быстро наладить взаимодействие конфигурации УТ 11 из мобильной конфигурацией, написанной на 1С 8.3. В качестве примера мы вместе разработаем отчет «Валовая прибыль по месяцам», который сможем запускать из смартфона или планшета под управлением операционной системы Android 4.2. Взаимодействие между информационной базой и мобильным приложением будет осуществляется с помощью web-сервиса.

1 стартмани

16.09.2013    16433    akomar    9    

Пошаговая инструкция по созданию мобильного приложения для iOS (без xcode) с обменом через WEB сервисы Часть I.

Практика программирования WEB Мобильная разработка v8 1cv8.cf Россия Абонемент ($m)

Пошаговая инструкция по созданию мобильного приложения для iOS с обменом через WEB сервисы Часть I.

1 стартмани

12.05.2013    38871    amrec.ru    26