react-native-animatable - 反应原生动画 api 不适用于 Android 手机
问题描述
所以,我试图使用react-native-animated
API 做一个淡入淡出动画,但不幸的是,当我尝试在我的 android 设备上渲染它时,它并没有得到动画。它只是没有动画任何东西,屏幕也是空白的,但一段时间后(比如 30-40 秒),文本显示没有动画。如果我不应用 Animated.View 而不是立即显示文本,或者您可以说内容的正常呈现。任何人都可以找到我在这段代码中做错了什么,或者我应该添加什么来使它工作。
反应原生动画版本:1.3.3
import React, { Component } from 'react';
import { Text, View, ScrollView } from 'react-native';
import { Card, } from 'react-native-elements';
import * as Animatable from 'react-native-animatable';
function History() {
return(
<View>
<Text style = {{margin:10}}>
Started in 2010, Eatsy quickly established itself as a culinary icon par excellence in Hong Kong. With its unique brand of world fusion cuisine that can be found nowhere else, it enjoys patronage from the A-list clientele in Hong Kong. Featuring four of the best three-star Michelin chefs in the world, you never know what will arrive on your plate the next time you visit us.
</Text>
</View>
);
}
class Test extends Component{
render()
{
return(
<ScrollView>
<Animatable.View animation="fadeInDown" duration={2000} delay={1000}>
<Card title ='Our History'>
<History />
</Card>
</Animatable.View>
</ScrollView>
);
}
};
export default Test;
解决方案
好的,现在我在浏览互联网几个小时后知道了解决方案,你只需要 像这样useNativeDriver='true'
在里面添加:<Animatable.View>
<Animatable.View animation="fadeInUp" useNativeDriver='true' duration={2000} delay={1000}>
推荐阅读
- azure - 为 Azure 应用服务应用程序实施 Cookie 横幅
- flutter - 在 null 上调用了 getter 'visible'
- spring - CORS spring 安全过滤器与 WebMvcConfigurer.addCorsMappings
- c# - System.ArgumentException:“设置 DataSource 属性时无法修改项目集合。” C# Windows 窗体
- python - 在套接字中检索空文本
- asynchronous - 如何链接 ObservableObject?
- typescript - 打字稿:在组合类型中合并相似键的类型
- flutter - 用于墨水池的 Flutter onTap
- redis - 应该如何正确使用nestjs-redis?有nestjs-redis的例子吗?
- javascript - HTML web 组件不使用 shadow DOM 样式