react-native-image-crop-picker：如何在同一屏幕上渲染裁剪窗口

Question

我需要从应用程序的图库中裁剪图像。我已经使用react-native-image-crop-picker包来拾取和裁剪图像。

选择图库图像后，如果我使用此image-crop-picker程序包，它将导航到新的裁剪窗口。 https://github.com/ivpusic/react-native-image-crop-picker

但是在这里，我需要在时间轴中添加帖子时，与instagram裁剪相同。

代码：

import React, { Component } from 'react';
import {
  CameraRoll,
  Platform,
  StyleSheet,
  Text,
  TextInput,
  Button,
  View,
  SafeAreaView,
  ScrollView,
  FlatList,
  Image,
  ImageStore,
  ImageBackground,
  TouchableHighlight,
  TouchableOpacity,
  PixelRatio,
  Dimensions
} from 'react-native';
import { FlatGrid } from 'react-native-super-grid';
import ImagePicker from 'react-native-image-crop-picker';

export default class Albums extends Component {
  constructor() {
    super();
    this.state = {
      photos: []
    }
  }

 _cropImage = (filePath) => {
     ImagePicker.openCropper({
       path: filePath,
       width: deviceWidth,
       height: deviceWidth*5/4,
       cropperToolbarTitle: '',
       hideBottomControls: true,
       enableRotationGesture: true,
       avoidEmptySpaceAroundImage:true
     }).then(image => {
       this.props.screenProps.navigation.navigate(screenName, {uri: image.path})
     })
     .catch((err) => {
       console.log("openCropper error = " + err)
     });
   }

renderPhotos(item) {
     return (
       <View style={styles.imageGrid}>
         <TouchableOpacity activeOpacity = { .5 } onPress={() => this.setState({selectedImage: image.uri})}>
         <Image
           style={styles.image}
           source={{ uri: image.uri }}
              />
       </TouchableOpacity>
       </View>
     );
   }


render() {
return (
  <View style={styles.imageContainer}>
        <ImageBackground
           resizeMode ={'contain'}
           style={[styles.selectedImage]}
           source={{ uri: this.state.selectedImage }}>
        {this._cropImage(this.state.selectedImage)}
             </ImageBackground>
        </View>
)}
}

引用所附图片