reactNative 文字上下滚动走马灯组件
reactNative 文字上下滚动走马灯组件
installnpm install react-native-marquee-words --save
Usageimport React, { Component } from 'react';
import {
View,
Text
} from 'react-native';
import Marquee from 'react-native-marquee-words'
export default class Mall extends Component {
render(){
return
<Marquee
data={['单笔订单满29元且距离门店3公里内免费配送', '单笔订单满39元且距离门店5公里内免费配送']}
duration={1000}
delay={2000}
toValue={40}
renderItem={(e, i) => (
<View style={{ height: 40, justifyContent: 'center' }} key={i}>
<Text style={{ fontSize: 10, color: '#816626' }}>{e}</Text>
</View>
)}
style={{ flex: 1 }}
/>
}
}
props
data：数据源
duration：动画执行时间
delay：动画停留时间
toValue：滚动高度，和renderItem 视图高度一致使用
renderItem：滚动视图
style：滚动视图外部样式
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
