0

I am trying to make my home page like instagram. so like instagram, I want to play video only when scrollview reach that video and video will play automatically.

I have tried this code

<ScrollView ref={ref => this.scrollView = ref}
    horizontal={false}
    automaticallyAdjustContentInsets={true}
    onMomentumScrollEnd={() => this.handleScrollEnd()}
    contentContainerStyle={{flexGrow: 1}} 
    style={{height: '100%'}} 
    onContentSizeChange={this.handleSize} 
    >
    <View style={style.mianContainer}>
    {
        this.state.publicPost.map((item, index) => {
            return(
                <Video
                    ref={ref => this.state.post_id = ref}
                    source={{ uri: this.state.postData.videos[0] }}
                    resizeMode={'cover'}
                    repeat={true}
                    muted = {true}
                    style={style.postImage}
                    onLoad={() => {
                        //this.state.postData.id.seek(2);
                        this.setState({ imageLoader: false });
                    }}
                />
             );
        })
    }
    </View>
</ScrollView>

I am trying with measure function to get position of video but can't idea how to match with current screen frame.

thanks!

Priya
  • 1,410
  • 14
  • 22
  • You can trace scroll until it reaches center point and you can play video ! – Firdous nath Mar 04 '19 at 05:13
  • I have list of videos, so how to decide to which one play? – Priya Mar 04 '19 at 05:22
  • Then track the video component until it reaches center of the screen ! check this to measure offsets [here](https://stackoverflow.com/questions/30096038/react-native-getting-the-position-of-an-element) – Firdous nath Mar 04 '19 at 05:26
  • I am not getting your point, can you please give me some sample code for this? – Priya Mar 04 '19 at 05:31
  • Possible duplicate of [Pause video in flatlist when out of view](https://stackoverflow.com/questions/54839940/pause-video-in-flatlist-when-out-of-view) although this uses a flatlist a scrollview would work just as well. – Andrew Mar 04 '19 at 07:12
  • Thanks! I will check it. – Priya Mar 04 '19 at 10:09

0 Answers0