Question

我正在创建一个简单的应用程序，要求用户选择一个图像，并且该图像需要传递到Webview窗口。

现在我有很多问题：

1.图像需要传递给css＆＃34;背景图像＆＃34;元件

我似乎无法重命名用户输入的图片文件
我无法将图片重新定位到应用的资源文件夹。

所以这是图像输入的代码：

    state = {

  ImageSource: null,

};

selectPhotoTapped() {
  const options = {
    quality: 1.0,
    maxWidth: 500,
    maxHeight: 500,
    title: 'Image Picker',
    storageOptions: {
      skipBackup: true,
      path:'data/data/fiftyoff/pictures',
    }


  };

  ImagePicker.showImagePicker(options, (response) => {
    console.log('Response = ', response);

    if (response.didCancel) {
      console.log('User cancelled photo picker');
    }
    else if (response.error) {
      console.log('ImagePicker Error: ', response.error);
    }
    else if (response.customButton) {
      console.log('User tapped custom button: ', response.customButton);
    }
    else {

     var ImagePicked= {path:response.path}
      let source = { uri: response.uri };

      // You can also display the image using data:
      // let source = { uri: 'data:image/jpeg;base64,' + response.data };
        module.exports=ImagePicked
      this.setState({

        ImageSource: source

      });
    }
  });
}

render() {
  return (
    <View style={styles.container}>

      <TouchableOpacity onPress={this.selectPhotoTapped.bind(this)}>

        <View style={styles.ImageContainer}>

        { this.state.ImageSource === null ? <Text>Select a Photo</Text> :
        <Image style={styles.ImageContainer} source={this.state.ImageSource} />
        }

        </View>

      </TouchableOpacity>


    </View>

这里是需要传递图像的CSS（image1所在的地方）：

.app-picture {
border: 2px solid #893579;
background-position: center;
background-size: cover;
border-radius: 80px;
width: 80px;
height: 80px;
margin: 0 0 1em 0;
top: 68.4714px;
display: block;
position: absolute;
right: 5%;
display: none;
background-image: url("image1.jpg")

将图像传递给webview in react-native

0 个答案: