Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 7 additions & 5 deletions DefaultViewPageIndicator.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

var React = require('react');
var ReactNative = require('react-native');
var PropTypes = require('prop-types');
var createReactClass = require('create-react-class');
var {
Dimensions,
StyleSheet,
Expand Down Expand Up @@ -41,16 +43,16 @@ var styles = StyleSheet.create({
height: DOT_SIZE,
borderRadius: DOT_SIZE / 2,
backgroundColor: '#80ACD0',
margin: DOT_SAPCE,
marginHorizontal: DOT_SAPCE,
bottom: 0,
},
});

var DefaultViewPageIndicator = React.createClass({
var DefaultViewPageIndicator = createReactClass({
propTypes: {
goToPage: React.PropTypes.func,
activePage: React.PropTypes.number,
pageCount: React.PropTypes.number
goToPage: PropTypes.func,
activePage: PropTypes.number,
pageCount: PropTypes.number
},

getInitialState() {
Expand Down
3 changes: 2 additions & 1 deletion Sample/android/app/src/main/AndroidManifest.xml
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
android:theme="@style/AppTheme">
<activity
android:name=".MainActivity"
android:label="@string/app_name">
android:label="@string/app_name"
android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
Expand Down
25 changes: 18 additions & 7 deletions ViewPager.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

var React = require('react');
var PropTypes = require('prop-types');

var createReactClass = require('create-react-class');
var ReactNative = require('react-native');
var {
Dimensions,
Expand All @@ -12,6 +12,7 @@ var {
PanResponder,
Animated,
StyleSheet,
ViewPropTypes,
} = ReactNative;

var StaticRenderer = require('react-native/Libraries/Components/StaticRenderer');
Expand All @@ -21,15 +22,15 @@ var DefaultViewPageIndicator = require('./DefaultViewPageIndicator');
var deviceWidth = Dimensions.get('window').width;
var ViewPagerDataSource = require('./ViewPagerDataSource');

var ViewPager = React.createClass({
var ViewPager = createReactClass({
mixins: [TimerMixin],

statics: {
DataSource: ViewPagerDataSource,
},

propTypes: {
...View.propTypes,
...ViewPropTypes,
dataSource: PropTypes.instanceOf(ViewPagerDataSource).isRequired,
renderPage: PropTypes.func.isRequired,
onChangePage: PropTypes.func,
Expand All @@ -49,7 +50,8 @@ var ViewPager = React.createClass({
getDefaultProps() {
return {
isLoop: false,
locked: false,
locked: false,
autoScrollInterval: 5000,
animation: function(animate, toValue, gs) {
return Animated.spring(animate,
{
Expand Down Expand Up @@ -86,7 +88,8 @@ var ViewPager = React.createClass({

this.props.hasTouch && this.props.hasTouch(false);

this.movePage(step, gestureState);
this.movePage(step, gestureState);
this.restartTimer()
}

this._panResponder = PanResponder.create({
Expand Down Expand Up @@ -142,7 +145,7 @@ var ViewPager = React.createClass({
}
}

if (nextProps.dataSource) {
if (nextProps.dataSource && nextProps.dataSource !== this.props.dataSource) {
var maxPage = nextProps.dataSource.getPageCount() - 1;
var constrainedPage = Math.max(0, Math.min(this.state.currentPage, maxPage));
this.setState({
Expand All @@ -163,11 +166,19 @@ var ViewPager = React.createClass({
if (!this._autoPlayer) {
this._autoPlayer = this.setInterval(
() => {this.movePage(1);},
5000
this.props.autoScrollInterval
);
}
},

restartTimer() {
if (this._autoPlayer) {
this.clearInterval(this._autoPlayer);
this._autoPlayer = null;
this._startAutoPlay()
}
},

goToPage(pageNumber, animate = true) {

var pageCount = this.props.dataSource.getPageCount();
Expand Down