Auto play option

[renet]

Hello there,

is there a possibility to add an auto-play option to the slider?

I can't seem to find it in the documentation, so I assume this is not yet given. Useful features would be:

• a given interval of milliseconds that the slider waits until it moves to the next slide
• an optional pause function (after manual swipe/next action, during mouseover)
• a reset of the interval after a manual swipe/next action

Would you consider adding this as a feature? :)

Thanks & regards, René

[souporserious]

I definitely would :) I'd like to do it as an addon somehow so it doesn't bloat the library. I have some ideas for this that I will tackle as soon as I get a chance. For now, you should be able to build a "smart" component that sits above the slider and controls it automatically. I'll try and throw an example together ASAP.

[gabrielrtakeda]

Any progress on this issue? It would be great to handle it directly from the react-view-pager...

[aga5tya]

Anyone tried a similar approach, i'm trying to implement this outside the context of the lib, any pointers would really help my approach.

[sscaff1]

The following works and is very simple to implement:

import React, { Component } from 'react';
import { ViewPager, Frame, Track, View } from 'react-view-pager';

export default class Slider extends Component {
  componentDidMount() {
    this.interval = setInterval(() => this.track.next(), 2000);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  render() {
    return (
      <ViewPager>
        <Frame>
          <Track ref={t => (this.track = t)} viewsToShow={3} infinite>
            <View tag="img" src="/static/sample.jpeg" />
            <View tag="img" src="/static/sample.jpeg" />
            <View tag="img" src="/static/sample.jpeg" />
            <View tag="img" src="/static/sample.jpeg" />
          </Track>
        </Frame>
      </ViewPager>
    );
  }
}