我有一个react-native-reanimated
视图,当flex: 0
时,它的宽度为零,当flex: 1
时,它填充了可用宽度。
我希望平滑地动画过渡,使视图从0宽度动态地填充到可用宽度,同时也在其增长时动画任何元素:
[#1 first elem] -- [#2 elem i want to grow] -- [#3 elem that should be pushed animated because #2 grows animated]
字符串
在我的初始视图中,由于#2的宽度为零,因此它看起来像[#1] -- [#3]
。我想将#2的flex
从0
动画到1
,但它会立即动画到全宽,而不是平滑动画。我可以想象为什么会发生这种情况(因为flex是相对的,只要它是唯一的flex填充元素,非零值之间就没有区别),但不知道如何解决这个问题。
鉴于:
- 我的动画元素的整个宽度是动态的
- 动画元素后面的元素也需要在布局中推送 *animated
如何设置“重新动画视图”的动画,使其大小增大,并以动画方式推动布局中该视图后面的任何元素?
我用的是复活版3.4.1.
1条答案
按热度按时间bhmjp9jg1#
我已经结束了测量容器视图,第一个元素(动画/增长之前的元素),布局上的最后一个元素(动画/增长之后的元素),计算可用空间(容器-第一个元素的宽度-最后一个元素的宽度-任何填充等)并将元素的宽度动画到该值。