如何在react native中显示带有react-native-image-picker的视频和图像

时间:2018-10-21 23:09:03

标签: react-native react-native-image-picker

import ImagePicker from 'react-native-image-picker';
   const options = {
      title: 'Select Image',
      takePhotoButtonTitle:'take a photo',
      chooseFromlibraryButtonTitle:'choose from gallery',
      quality:1 
    };

    class Upload extends Component <{}>{
        static navigationOptions = { header: null }

        constructor(){
            super()
            this.state ={
                ImageSource:null
            }
        }
        selectPhoto(){
                    ImagePicker.showImagePicker(options, (response) => {
                console.log('Response = ', response);

                if (response.didCancel) {
                console.log('User cancelled image picker');
                } else if (response.error) {
                console.log('ImagePicker Error: ', response.error);
                } else {
                let source = { uri: response.uri };  
                this.setState({
                  ImageSource: source,
                });
                }
                });
        }
  1. 如何在本机反应中显示带有图像的视频,并且使用video soucr uri状态仍然仅显示图像 2.并且如果仍然使用mediatypes,则仍然是图像显示如何解决此问题

2 个答案:

答案 0 :(得分:1)

您是否正在为Android / iOS /两者开发?看来您必须为iOS指定mediaType={mixed},并且必须指定是要查看Android的视频还是图像。

答案 1 :(得分:0)

你在这里

   ImagePicker.showImagePicker({
        title: 'Choose Image or Video',
        customButtons: [{ name: 'image', title: 'Take a Photo' },{ name: 'video', title: 'Take a Video' }],
        chooseFromLibraryButtonTitle: null,
        takePhotoButtonTitle: null,
    }, (res) => {
        if(res.customButton ){
            ImagePicker.launchCamera({
                mediaType: res.customButton,
                videoQuality: 'high',
                quality: 1,
            }, (response) => {
                // Same code as in above section!
            });
        }
    });