最近在学rn，感觉还不错，尤其用法基本和前端一样，便于学习。这是我收藏的代码，仅供讨论。只不过刷新真他妈烦，，，有时候一直报错，还得多刷新几次。。
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, TextInput, View,Image, ScrollView} from 'react-native';
var Dimensions = require('Dimensions');
var screenWidth = Dimensions.get('window').width;
var imageData = [ 'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2263582212.jpg', 'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2265761240.jpg', 'https://img3.doubanio.com/view/movie_poster_cover/mpst/public/p2266110047.jpg'];
class ReactProjectTwo extends Component {
constructor(props) {
super(props);
this.state = {currentPage: 0};
}
render() {
return ({
this.onAnimationEnd(e) }} >
{this.renderImages()}{this.renderPagingIndicator()}); }
renderImages() {
let allImage = [];
for (let i = 0; i < imageData.length; i++) {
let item = imageData[i];
allImage.push(
); }
return allImage; }
onAnimationEnd(e) {
let offsetX = e.nativeEvent.contentOffset.x;
let pageIndex = Math.floor(offsetX / screenWidth);
this.setState({currentPage: pageIndex}); }
renderPagingIndicator() {
let indicatorArr = [];
let style;
for (let i = 0; i < imageData.length; i++) {
style = (i == this.state.currentPage) ? {color: 'orange'} : {color: 'white'}; indicatorArr.push(•); }
return indicatorArr;
} }
const styles = StyleSheet.create({
container: {
marginTop: 20,
backgroundColor: '#ffffff' },
scrollViewStyle: { backgroundColor: 'yellow', },
imageStyle: {
width: screenWidth,
height:200,
},
pagingIndicatorStyle: {
height:25,
width:screenWidth,
backgroundColor:'rgba(0,0,0,0.4)',
position:'absolute',
bottom:0,
flexDirection:'row',
alignItems:'center',
justifyContent: 'center', }});
AppRegistry.registerComponent('ReactProjectTwo', () => ReactProjectTwo);
转自：http://blog.csdn.net/xiangzhihong8/article/details/53709296