0

我在图像中的 react-native 应用程序中有一个视图。我已经为相应的视图添加了 css。为了使可视化清晰，绿色视图不在红色视图的顶部，而是红色视图在绿色视图之后。 在此处输入图像描述

用例 - 我想隐藏绿色视图，使红色视图以平滑过渡占据整个空间。

我一直在尝试使用Animatedreact-native 提供的事件调用隐藏绿色视图。我尝试在 translationY 上应用动画，但正如预期的那样，视图移出了可见区域，但实际占用的区域并没有减少。我试图将它应用于高度，然后我得到一个useNativeDriver: true在高度上不起作用的错误。所以我删除了它，行为突然从平稳变为极度滞后，并在过渡中停顿了很长时间。

Animated.timing(this.state.animation, {
            toValue: 94,
            duration: 100,
            easing: Easing.in,
            useNativeDriver: true
        })

现在，通过平滑过渡添加关于高度变化的动画似乎是不可能完成的任务。

我怎样才能达到我想要的行为？

react: 16.8.3
react-native: 0.59.8
4

1 回答 1

1

在您的情况下，它会产生性能问题，因为视图会相互影响。随着它的大小变化，它不应该影响另一个。这会导致一切都被再次渲染，渲染是最昂贵的过程。

你也试过react-native-reanimated吗？

于 2020-09-19T16:40:12.987 回答