react-native-image-crop-tools
react-native-image-crop-tools copied to clipboard
hhunaid
Cannot get it image displayed on iOS
On Android everything works well and is a lifesaver.
On iOS i get the cropper screen displayed but no image is visible. I have tried with multiple uri formats, but no luck.
Is there a specific uri format that is needed for iOS?
I have tried these examples assets-library://asset/asset.JPG?id=B3413BF7-5F75-448F-81AB-2D1164A0C286&ext=JPG ph://B3413BF7-5F75-448F-81AB-2D1164A0C286/L0/001 B3413BF7-5F75-448F-81AB-2D1164A0C286/L0/001
None of these are shown in the cropper. Tried on the simulator and also on iOS device.
Only filesystem paths are supported. i.e. file:///var/containers/3123123/something.jpg You will need to get the file from PHAsset before you can pass it on to the cropper.
Which library are you using to pick image from iOS?
Thanks for a quick reply.
I'm have tried with @react-native-community/cameraroll and also with expo-media-library.
One gives me ph:// path and other one gives assets-library://.
I cannot use that one as I have custom image gallery and react-native-image-picker is opening native image picker.
I will try to find a workaround for the image paths or use different cropper. But thanks anyway.
Tried it out actually with react-native-image-picker and filesystem paths and doesn't work for me also. Both in device and in simulator.
iOS version is 14.0. React-Native version is 0.63.3
Alright. Figured it out. The native component doesn't update the content if uri changes. So it only renders image if the uri is provided when rendering the component and it's not updated while component is mounted.
@hhunaid can you tell if this is doable on the iOS native side that the component updates when uri changes? Not that familiar with the TOCropViewController.
Changing the image on the fly doesn't make much sense. And I don't think there is a way to do it without internally destroying and recreating the cropview. What you can do however is conditionally render this component only when the url is ready
Hello @hhunaid ,
I'm using https://github.com/HarvestProfit/react-native-rectangle-scanner
I get such a path : "initialImage": "/var/mobile/Containers/Data/Application/0540A66A-1D7E-48E8-9D80-B766534AD5FB/Library/Caches/RNRectangleScanner/O1606745009.jpeg"
But with InitialImage Get black screen just like @Sanglepp
@ScreamZ you need to add file:// in the beginning of the initial image path
I was also stuck on this issue for a while, adding a key prop with the image's uri to the CropView seems to solve the problem for me on iOS,
downgrading "react-native-image-picker" from "7.0.1" => "^3.6.0" due to following issue finally helped me to get image in render. Not perfect solution, but mb it will fit someone. https://github.com/react-native-image-picker/react-native-image-picker/issues/2119#issuecomment-1528008388
