реакция-родной-элементы Аватар - PullRequest
0 голосов
/ 11 сентября 2018

Я хочу загрузить изображение, нажав на компонент аватара, а затем выбрать изображение с устройства. Кто-нибудь знает, возможно ли использование компонента аватара из Reaction-native-elements?

Я уже добавил следующие разрешения:

 <uses-permission android:name="android.permission.CAMERA" />
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

Как вы думаете, мне нужно также установить библиотеку реагировать на родные изображения?

Заранее спасибо,

Ответы [ 2 ]

0 голосов
/ 12 сентября 2018
  constructor(props: Object) {
    super(props);
    this.state = {
      image_uri: '' //initially set the state of image with default image
    };
  }

**your avatar component** 

  <Avatar
    small
    rounded
    source = {{uri: this.state.image_uri}}
    onPress={() => this.openImagePicker()}
    activeOpacity={0.7}
  />

 **import { showImagePicker } from 'react-native-image-picker';**

  captureMediaOrGetFromDeviceLibrary(options: Object = OPTIONS) {
      var promise = new Promise(function(fulfill, reject) {
      showImagePicker(options, (response) => {
      if (response.didCancel) {
        fulfill ({success: false})
      } else if (response.error) {
        fulfill ({success: false})
      } else {
        fulfill ({
         success: true,
         media_data: response
        })
      }
    })
  })
  return promise.then((response)=>{
    return response
  })
 }


 openImagePicker() {
   const options = {
    quality: 1.0,
    maxWidth: 500,
    maxHeight: 500
   };
   return captureMediaOrGetFromDeviceLibrary(options).then((response)=> {
     if(response.success){
       this.setState({image_uri:response.media_data.uri})
     }
   }) 
  }
}
0 голосов
/ 12 сентября 2018

Библиотека, которую вы используете, не поддерживается.использовать сборщик урожая для реагирования

import ImagePicker from 'react-native-image-crop-picker';

    <Avatar
      source={this.state.image}
      onPress={() => this.openPicker()}
    />

      openPicker() {
        ImagePicker.openPicker({
          width: 200,
          height: 200,
          cropping: true,
          includeBase64: true,
          includeExif: true,
        }).then(image => {
          this.setState({
            image: { uri: `data:${image.mime};base64,${image.data}`,
              width: image.width,
              height: image.height },
          });
        }).catch(e => console.log(e));
      }
...