VKUI-компоненты
VKUI — это библиотека адаптивных React-компонентов. С её помощью вы можете создавать привлекательный интерфейс мини-приложений для мобильных устройств.
NPM: https://www.npmjs.com/package/@vkontakte/vkui
Документация: https://vkcom.github.io/VKUI
Figma: https://www.figma.com/@vk
Если вы используете библиотеку для создания шаблона, отдельно подключать VKUI не нужно.
Обратите внимание! Вашему мини-приложению доступна почти вся площадь экрана, поэтому для корректной работы навигации:
- •Используйте компонент
PanelHeader
на каждом экране приложения. Он должен содержать название приложения и значок Назад на тех экранах, где тот требуется. - •Не занимайте правый верхний угол
PanelHeader
— это место зарезервировано для нативного бара с кнопками Меню и Закрыть, который отображается всегда. - •Используйте стилизованный под платформу значок Назад. Для этого применяйте компонент
<PanelHeaderBack />
.
На устройствах с Android нажатие кнопки Назад вызывает в WebView событие history.back
. По нажатию этой кнопки официальное приложение сделает возврат на предыдущую страницу вашего приложения или закроет его, если вернуться невозможно. Поэтому для корректной навигации необходимо обрабатывать нажатие аппаратной клавиши в мини-приложении и реализовывать роутинг. Например при помощи библиотеки react-router
.