iOS unable to render local images

[srameshr]

The images from asset-library and local image path returned by camera is not being rendered. Works fine with remote images though. Both http and https

[srameshr]

Is it working for others?

[wolfg1969]

I have same problem. downgrade to 1.3 works.

[srameshr]

I want MWPPhotoBrowser its available after 1.4.0

[wolfg1969]

I guess the problem is brought by MWPPhotoBrowser since 1.3.x didn't use it.

[srameshr]

Which native Image viewer does 1.3.x use? I see a lot of problem with MWPPhotoBrowser. It does not render remote images at random. https://github.com/alwx/react-native-photo-view/issues/87

[wolfg1969]

1.3.x use ScrollView from RN. See https://github.com/alwx/react-native-photo-view/commit/9489a513fbacb0e239aa4dc893601f7470363a9a

[srameshr]

MWPPhotoBrowser provides pinch to zoom. I would need that.

[gitlovenotwar]

Does this support local images? or base64?

[srameshr]

Local

[gitlovenotwar]

@srameshr how about base64 images?

[srameshr]

I have not tried it.

[gitlovenotwar]

I've tried it just now, it's not working on base64

[srameshr]

Yup, right now it only works with https images. Not local or base64.

[wolfg1969]

I found the bounds (https://github.com/alwx/react-native-photo-view/blob/master/ios/RNPhotoView.m#L176) will be zero for the images with file:// uri (loaded from photo library or taken from camera). This makes the scaled image no size.

[wolfg1969]

I created a PR (#96) for this issue.

[srameshr]

@wolfg1969 Could you also look into https://github.com/npomfret/react-native-image-tools/issues/9 and https://github.com/npomfret/react-native-image-tools/issues/4 . I have no idea about objective-c. Sorry for diverging from the topic of this thread.

[wolfg1969]

@srameshr I'm afraid not. I'm not a objective-c expert too.

[jjdp]

you have to add them manually in your assets in xcode

[ghost]

@wolfg1969 (cc @srameshr) I still have the issue with URLs like asset-library://asset/... from Camera Roll.

[srameshr]

I ditched this library and unsubscribing from this thread.

[wolfg1969]

@kytwb I use react-native-image-picker and it's return file URI works with this library.

[janiokq]

RNPhotoView.m

import <UIKit/UIKit.h>

import <Foundation/Foundation.h>

import <AssetsLibrary/ALAssetsLibrary.h>imatgetemporal

import <AssetsLibrary/ALAsset.h>

import <AssetsLibrary/ALAssetRepresentation.h>

• (void)setSource:(NSDictionary )source { dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.1 NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ if ([_source isEqualToDictionary:source]) { return; } NSString uri = source[@"uri"]; if (!uri) { return; } _source = source; NSURL imageURL = [NSURL URLWithString:uri];

  if([uri hasPrefix:@"assets-library://"]){
  
      NSURL *asseturl = [NSURL URLWithString:uri];
      __block ALAssetsLibrary* assetslibrary = [[ALAssetsLibrary alloc] init];
      [assetslibrary assetForURL:asseturl
                     resultBlock:^(ALAsset *asset) {
                         __block ALAssetRepresentation * present = [asset defaultRepresentation];
                         __block CGImageRef imgRef = [present fullResolutionImage];
                         __block UIImage *img = [UIImage imageWithCGImage:imgRef
                                                                    scale:present.scale
                                                              orientation:(UIImageOrientation)present.orientation];
                         [self setImage:img];
                     }
                    failureBlock:^(NSError *error) {
                    }];
  
                      return;

// // UIImage *image = RCTImageFromLocalAssetURL(imageURL); // if (image) { // if local image // // [self setImage:image]; // return; // } }

    NSURLRequest *request = [[NSURLRequest alloc] initWithURL:imageURL];

[aschmi]

For me local images on my device only work when I have remote js debugging switched on. If it is off I only see a black screen. None of the onLoad events is triggered then.

RN: 0.49.3 react-native-photo-view: 1.5.2

[computerjazz]

I solved this in the iOS sim by prepending file:// to my uri, although I haven't confirmed on device yet though.

The uri returned from the image picker was

/Users/yourUser/Library/Developer/CoreSimulator/Devices/32541D85-B1FD-441F-BB2B-B09850500F6C/data/Containers/Data/Application/DF622A86-5E4B-49C5-8DB5-0141BA339314/Documents/images/E136D41D-47E0-4264-AC79-E0D2A6210F49.jpg

So I changed my source to:

uri: 'file:///Users/yourUser/Library/Developer/CoreSimulator/Devices/32541D85-B1FD-441F-BB2B-B09850500F6C/data/Containers/Data/Application/DF622A86-5E4B-49C5-8DB5-0141BA339314/Documents/images/E136D41D-47E0-4264-AC79-E0D2A6210F49.jpg'

[tommynordli]

I'm still having the issue in 1.5.2, and it doesn't help to prepend file:// to the uri. Anyone with a solution?

@srameshr what library did you use instead?

[srameshr]

I built my own

[scriptgb]

Same problem here.

[ManuBu]

@srameshr Could you show your implementation or put it on GitHub? I have the same problem when getting the images using RN CameraRoll.

[gigby]

@ManuBu This is my little implementation to fix the current issue - https://github.com/Warecorp/react-native-photo-view/commit/7a77dd5f519d1bf408111a9a2d21216a0d48e8d0

I didn't implement a common approach because I am needed to show only local images (from document dir).

[tronginc]

I have the same problem. But I have solved this issue. You may need add width and height to style.

{ this.state.image ? <Image style={{height: 100, width: 100}} source={{uri: this.state.image}} /> : null }