Виктор кинько
ZoomHandler для React Native
Для проекта Sivik Zenith-3D требовалось отобразить на экране отчёты сход-развала с возможностью приближения экрана. Для реализации такого поведения было произведено исследование библиотек, по результатом которого найдена библиотека react-native-easy-gestures.
Виктор Кинько
Android-разработчик
Она представляет из себя новый компонент Gestures, который управляет нативными параметрами вложенного view через жесты пользователя и поддерживает приближение, поворот и перетаскивание содержимого.
Проблема заключалась в том, что для данной задачи требовалась модификация библиотеки, чтобы достичь требуемого поведения.
Проблема заключалась в том, что для данной задачи требовалась модификация библиотеки, чтобы достичь требуемого поведения.
Оно включает следующие функции:
• отключение возможности поворота содержимого,
• фиксация содержимого посередине экрана (с помощью Gestures можно было утянуть содержимое за рамки экрана),
• поддержка приближения по двойному нажатию,
• поддержка свайпа контента (нативное поведение ScrollView, при котором после резкого движения по экрану включается прокрутка содержимого по инерции),
• поддержка смены ориентации экрана.
• отключение возможности поворота содержимого,
• фиксация содержимого посередине экрана (с помощью Gestures можно было утянуть содержимое за рамки экрана),
• поддержка приближения по двойному нажатию,
• поддержка свайпа контента (нативное поведение ScrollView, при котором после резкого движения по экрану включается прокрутка содержимого по инерции),
• поддержка смены ориентации экрана.
После создания обертки над библиотекой было вынесено решение выделить её в отдельный модуль для более простого использования в будущем. Также для данного модуля было произведено усовершенствование, приносящее следующие функции:
• поддержка styles для контейнера содержимого,
• возможность настройки минимального и максимального приближения,
• возможность настройки количества уровней для приближения через двойное нажатие,
• общее усовершенствование стабильности, особенно для содержимого размером меньше, чем экран.
• поддержка styles для контейнера содержимого,
• возможность настройки минимального и максимального приближения,
• возможность настройки количества уровней для приближения через двойное нажатие,
• общее усовершенствование стабильности, особенно для содержимого размером меньше, чем экран.
Результатом работы стала удобная библиотека для приближения в react-native https://www.npmjs.com/package/
react-native-border-zoom-view, выложенная на NPM.
react-native-border-zoom-view, выложенная на NPM.
Спасибо за внимание!