Как реализовать прокрутку меню на react-native?

Question

[Andrey Dyrkov]

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

На экране есть некая шапка, горезонтальное меню, и вертикальный список товаров с категориями.



Задачи:
1. при прокрутке экрана, когда верхний край экрана сравняется с верхним краем меню зафиксировать меню на экран;
2. при нажатии на элемент горезонтального меню проскроливать страницу до нужной категории товаров в списке товаров;
3. подсвечивать в горизонтально меню ту категории, которая сейчас ему видна.
4. шапка должна иметь поведение на подобие следующего



Я реализовал список, скролл до секции, отображение активной секции, но не могу нормально интегрировать это вместе с этой библиотекой https://github.com/bamlab/react-native-image-heade...

Проблема в двух ScrollView, при нажатии на секцию происходит скролл до элемента только в одном из ScrollView, а шапка так и остается видна, верхний ScrollView не перемещается.

Как вообще такое реализуется, реализовывали вы что-то подобное, есть ли оптимальное решение, которое не будет подлагивать?

Comments

[davidnum95]

А зачем тебе два скроллвью?

[Andrey Dyrkov]

davidnum95, да, я тоже об этом подумал, оставил одно scrolView, добавил стики, повесил событие на скрол, беру текущий отступ по "y" и ищу в данных от onLoaout какая секция сейчас активна. Работает хорошо, быстро к моему удивлению.