Реализовать собственный вид прокрутки анимированный заголовок: эффективный способ изменить макет при изменении размера?

Question

Я следил именно за этой статьей здесь , чтобы анимировать заголовок, изменяя размер прокрутки flatList (список комментариев, на Scroll Y, уменьшить заголовок).Это работает очень хорошо (иногда немного медленно, но это нормально).

Теперь я хотел бы изменить расположение макета при изменении размера: переход от одного к двум столбцам, когда заголовок становится меньше.Но мне кажется очень сложным для результативного результата.

Я думал о двух способах сделать это:

1. Использовать onLayout для заголовка, чтобы прослушать изменение размеравысота, в середине интерполяции высоты, измените класс стилей.Этот метод является дорогостоящим по производительности, поскольку он запускает прослушиватель onLayout каждый кадр, поэтому мое приложение очень глючит.

2. прослушивание ScrollY, в середине scrollY, изменить класс.Та же проблема, что и ранее, каждая прокрутка проверки кадра Y заставляет мою прокрутку работать очень медленно.

Есть ли у кого-нибудь более хорошая идея изменить макет представления при изменении размера?

Спасибо

edit: здесь пример события onlayout, которое вызывается много раз, вызывая затвор

gif пример

Answer 1

Вы должны использовать onLayout для этого.

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

Источник: https://facebook.github.io/react-native/docs/view#onlayout

Вызывается при изменении монтирования и макета