相关疑难解决方法(0)

在轮播中反应原生视频

我一直在尝试从包含多个视频和图像的滑块播放单个视频。我使用和尝试的内容如下。 1. react-native-video, 2. react-native-snap-carousel

如何暂停和播放水平轮播中包裹的视频以及垂直 FlatList Feeds 中的视频

这是我的旋转木马:

<View style={styles.sliderImgView}>
     <Carousel
       ref={(c) => { this._carousel = c; }}
       data={chordData.images}
       firstItem={0}
       autoplay={autoPlay}
       layout={layout}
       loop={loop}
       renderItem={this._renderItem}
       onSnapToItem={(ind) => this.setState({ activeSlide: ind })}
       loopClonesPerSide={bannersDataLength}
       sliderWidth={SCREEN_WIDTH}
       itemWidth={SCREEN_WIDTH} />
</View>
Run Code Online (Sandbox Code Playgroud)

我的 _renderItem 在这里:

if (item.mediaType === "image") {
return (
    <View style={[styles.sliderImgView, GlobalStyles.ajCenter]} key={index}>
        <Image source={{ uri: item.imgUrl }} resizeMode={"cover"} style={[styles.sliderImageStyle]} />
    </View>
)
} else {
    return (
        <View style={[styles.sliderImgView, GlobalStyles.ajCenter]} key={index}>
            <Video
                source={{ uri: item.imgUrl }}  // Can be a URL …
Run Code Online (Sandbox Code Playgroud)

javascript react-native react-native-snap-carousel react-native-video

5
推荐指数
1
解决办法
2261
查看次数

使用 Swiper 组件播放暂停问题对原生多视频做出反应

我在swiper中有多个视频可以一个一个地显示视频,但是所有视频都是同时加载和播放的,而且音频很乱,我希望当前视频只能一次播放。

import * as React from 'react';
import { Text, View, StyleSheet,Image, Dimensions } from 'react-native';
import { Constants } from 'expo';
import { Video } from 'expo';
import Swiper from './Swiper';
import InViewPort from './InViewport';
const screenWidth = Dimensions.get('window').width ;
const screenHeight = Dimensions.get('window').height;

export default class App extends React.Component {
  constructor(props) {
    super(props);
    // Your source data
    this.state = {
      images: {},
      muted : false,
      paused: true,
    };
    this.player = Array();
    this.onChangeImage = this.onChangeImage.bind(this);
  }

   videoError(err){
     console.warn(err);
   } …
Run Code Online (Sandbox Code Playgroud)

reactjs react-native

0
推荐指数
1
解决办法
5009
查看次数