1

我正在使用react-native-image-picker库进行视频录制和react-native-video播放视频，其中onLoad给出了回调函数中的视频持续时间，但我如何在我的代码中使用它，谁能指导我？我已经写durationLimit了函数，但它不起作用。如何录制持续时间为 30 秒的视频？我也试过这个 ，但失败了。

我的代码

import ImagePicker from 'react-native-image-picker';   
import Video from 'react-native-video';

constructor(props){
   super(props);
   this.state = {
      video: '',
      isVideo: true
   };
};
_handleVideoUpload = () => {
   const options = {
      mediaType: 'video',
      videoQuality: 'medium',
      durationLimit: 30000,
      thumbnail: true,
      allowsEditing: true,
   };

   ImagePicker.launchCamera(options, (response) => {
      if (response.didCancel) {
        // console.warn('User cancelled video picker');
        return true;
      } else if (response.error) {
         // console.warn('ImagePicker Error: ', response.error);
      } else if (response.customButton) {
          console.warn('User tapped custom button: ', response.customButton);
      } else {
         this.setState({video: response.uri});
      } 
   });
 }

render() {
   return(
     <View>
     {
      this.state.video != '' ?
         <View>                     
           <Video
              ref={ref => this._video = ref}
              source={{ uri: this.state.video }}
              resizeMode={'cover'}
              repeat={true}
              paused = {true}
              onLoad={() => { this._video.seek(2);}} 
           />
       </View>
     : 
       <TouchableOpacity 
          onPress={() => this._handleVideoUpload()}
       >
         <Text>Upload Video</Text>
      </TouchableOpacity>
    }
   </View>
);}

先感谢您。

4

1 回答 1

2

如果你想录制 30 秒的视频，你需要 tu 放入30，durationLimit而不是30000

`const options = {
   mediaType: 'video',
   videoQuality: 'medium',
   durationLimit: 30,
   thumbnail: true,
   allowsEditing: true,
};`

如果您想知道视频播放的持续时间，<Video />您可以这样做：

`_onLoad(data){
    let durationVideo = data.duration
}
...
<Video
   ref={ref => this._video = ref}
   source={{ uri: this.state.video }}
   resizeMode={'cover'}
   repeat={true}
   paused = {true}
   onLoad={() => this._onLoad()}
/>`

我希望这可以帮助你。

于 2019-01-02T20:45:02.387 回答