Similar presentations:
Приложение в формате мастера
1. Приложение в формате мастера
2. Цели и задачи
Цель: Реализовать приложение в формате Мастера (Wizard).Задачи:
-Должны быть Route guards.
-На каждом шаге мастера должна быть представлена цепочка
шагов
-При выполнении запроса должен блокироваться интерфейс и
появляться loader.
-Должны быть описаны типы используемых объектов.
3. Тема
- В качестве темы проекта была выбрана регистрация на турнир пошахматам и шашкам.
4. Структура приложения
Сервисы:- Mock-api service имитирует запросы к серверу. В нем
хранятся данные, такие как форматы турниров, тип
игры и т.д. Методы для отправки и получения данных.
- Wizard-state service – сервис для управления
состоянием мастера. В нем хранятся данные каждого
шага, сброс и обновление формы.
5. Структура приложения
Главная страница:- Стандартная главная страница с
перенаправлением на форму.
Страница мастера:
- Мастер. Это layout, на котором отрисовывается каждый
шаг. При переходе между шагами существует имитация
загрузки там, где у mock-api запрашиваются какиенибудь данные.
6. Работа приложения
- В моем приложении также присутствует полноценная адаптивность длямобильных устройств.
7. Работа приложения
Цепочка состоит из 4 шагов:1. Выбор дисциплины
2. Личные данные
3. Формат турнира
4. Проверка данных
Степпер:
- В приложении также реализован степпер. По
которому можно переходить назад по уже
пройденным шагам. Он отображает
заполненные, активные и заблокированные
шаги.
8. Работа приложения
Работа формы:- В форме есть обязательные валидируемые поля, без правильного заполнения которых, нельзя
перейти к следующим шагам.
- При изменении данных на N шаге, все последующие заполненные шаги будут сброшены.
9. Работа приложения
Защита маршрута:- Через адресную строку можно перейти на любой
заполненный шаг или первый незаполненный.
- При попытке перехода на недоступный шаг
пользователь остается на текущем шаге.
- При попытке перехода по несуществующему адресу
пользователя перенаправит на главную страницу.