Найти в Дзене

Раздел для родителей в детском приложении

Оглавление

Статья о том, как сделать раздел для родителей в деском приложении с проверкой возраста.

Из этой статьи вы узнаете:

  • Как и зачем проверять возраст
  • Как создать состояние для всего приложения и управлять им
  • Как создать всплывающее модальное окно проверки возраста
  • Как создать простые случайные примеры проверки возраста

Исходный код всех примеров для этой главы доступен на Git.

Этот подход можно использовать для Premium подписки приложения, а вместе проверки возраста показывать PayWall.

Как и зачем проверять возраст

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

  • Отправка, удаление и сохранение фото в галерею
  • Оформление подписки

В соответствии с пунктом 1.3 Kids Category документа о правилах аудита приложений App Store Review Guidelines для доступа в эти разделы необходимо создать Parental Gate

Самые популярные способы проверки возраста: простые арифметические операции, операции с фигурами, но бывают и забавные, например "Что делает видеомагнитофон?" с вариантами ответов.

💡 В моём приложении я буду использовать задачи на арифметику. Сколько будет 4+9, 4x4 или 25/5 с тремя вариантами ответов.

Как создать состояние для всего приложения и управлять им

Родительский режим включается по всему приложению, это состояние будет храниться на уровне приложения. И транслироваться по цепочке как Binding, чтобы можно было добавить переключающие кнопки и обновлять состояние приложения.

Есть два подхода к управлению приложением:

  1. Добавить отдельное состояние детский режим - родительский режим и отдельно управлять состоянием "Запрос разрешения"
    Плюсы - четкость разделения назначения каждого флага
    Минусы - нужно разбираться с 4 состояниями приложения в обработчиках кнопок
  2. Создать три состояния детский режим - запрос разрешения - родительский режим
    Плюсы
    - четкая последовательность смены состояний
    Минусы - нельзя проверить возраст без перехода в родительский режим
💡 Какой вариант выбрать? Я выберу вариант с тремя состояниями. Мне важно, чтобы родительский режим всегда выделялся цветом, а четкость назначения флагов в таком маленьком проекте не важна

Состояние будет храниться в enum, который будет работать как конечный автомат.
Метод
next будет переключать состояния по кругу:
Детский режим -> Проверка возраста -> Родительский режим.

Метод
cancel возвращает состояние из Проверка возраста в Детский режим. Другие состояния не меняются.

-2

Про переключение фонов кнопок и панелей я рассказывал в предыдущих статьях. Код выглядит так:

-3

Как создать всплывающее модальное окно проверки возраста

Отображение панели будет завязано на состояние запроса возраста

-4

Код примера

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

-5

Для отображения панели требуется 6 параметров: A, Оператор, Б и три ответа. Я разделил пример на три части, чтобы можно было знак операции сделать крупнее.

Отображаться панель будет если состояние приложения меняется на "Запрос разрешения". Эта же кнопка будет возвращать детский режим.

-6

Код примера

А сворачиваться панель будет по тапу на фон или нажатию на кнопку ответа. Правильный ответ продвинет состояние вперед методом next, а неправильный или тап на фон - cancel.

-7

Код примера

Как создать простые случайные примеры проверки возраста

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

Если взять любые случайные натуральные числа, их сложение и умножение всегда будет натуральным числом. Но с делением и вычитанием это не всегда так. Поэтому для создания примеров на вычитание/деление будет создаваться пример на сложение/умножение и инвертироваться - менять местами ответ и А.

Алгоритм создания операции такой:

-8

Код реализации

Создавать новый пример необходимо при отображении окна. При этом важно помнить, что SwiftUI может обновлять состояние View и пересоздавать всю структуру в случае внешних событий. Поэтому создавать пример необходимо в модификаторе onAppear панели.

-9

Код примера

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

-10

Заключение

В этой статье я рассказал о том, как добавить в приложении специальный режим для всего приложения. Он применим не только для родительского режима, но может использоваться и для Premium раздела приложения.

Все работающие примеры есть в проекте на Github, их можно скачать и запустить.

Пишите в комментариях интересующие вас темы для будущих статей, а чтобы их не пропустить - подписывайтесь на дневник.