Photoview empty on android with red border

[logileifs]

When running the example code on android all I get is an empty view with a red frame

[edolfuchs]

Same bug here

[tomershohet]

same here

[alwx]

@logileifs @edolfuchs @tomershohet how do you run it guys? when I run the example project on AVD I see the following:

[alwx]

Also, please, check it with new 1.2.0 version.

[esgudnason]

Still getting red border in Android with React Native 0.34.1 and version 1.2.0

[logileifs]

@alwx I figured out that this error was due to it not being linked correctly. However after fixing the linking error I can run the example fine but I get an empty view when using uri with a local path.

[superandrew213]

@logileifs what linking error did you have? Mine is linked correctly but still not working

[ufon]

+1

[logileifs]

@superandrew213 I just looked at all the usual android files that need to be linked settings.gradle, build.gradle, MainApplication.java and MainActivity.java. It was missing in some of them so I added where was needed. But like I said, once I got that working it only worked for remote URI

[ufon]

@logileifs tell pls what u added?

[logileifs]

@ufon I really don't remember anymore where the problem was exactly, if you post the content of the files I mentioned I can tell you where you are missing something

[rwillemsandroid]

As suggested by @logileifs the problem is indeed related to the linking of the library, to fix this @ufon, you need to do the following:

In MainApplication.java

add import com.reactnative.photoview.PhotoViewPackage; to the imports and in function getPackages() add new PhotoViewPackage()

@Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
          ...
           new PhotoViewPackage(),
         ...
              );
    }
  };

[affibox]

<PhotoView

source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} minimumZoomScale={0.5} maximumZoomScale={3} androidScaleType="center" onLoad={() => console.log("Image loaded!")} style={{width: 300, height: 300}} />

This doesn't work at all

[vspedr]

TL;DR: check if rnpm link actually made all the necessary changes (indicated in Manual Installation) to MainActivity.java or MainApplication.java depending on your React Native Version.

I was having the same problem using React Native 0.32.0. I tried debugging and this is what I got:

So I noticed that even after linking the library with rnpm link, the app could not find the native component. Then I used diff to see the changes caused by rnpm link and noticed it had only added the following line to MainActivity.java (build.gradle was fine):

'import com.reactnative.photoview.PhotoViewPackage;'

Actually, that line should have been added to MainApplication.java along with other imports. It was also missing the following part, which should also go in MainApplication.java.

@Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new PhotoViewPackage() // add this manager
      );
    }

Fix'd ;)

[jr-k]

@everyone try to import libART.a

[jjdp]

did you all run react-native run-android again? and dont forget to add in build.gradle compile project(':react-native-photo-view')

[sudoaza]

Same here, i had my getPackages function in MainActivity.java instead of MainApplication.java, moved the import there and added the new PhotoViewPackage() and worked. It works for local files too!

[kccheung]

I still suffer the same issue. I saw my ReactActivity.java does not have a member function getPackages to allow MainActivity.java to override.

[affibox]

Guys.... Try to manually link the module. Then put the inside a tag.

This actually helped me. Ex:

<View>
 <PhotoView /* add the extra parameters and props*/ />
</View>

[Obooman]

After I run react-native link it works well.react-natove@0.45 and Android@7.0.1

[nihp]

I am getting a blank screen in Android. Works fine in iOS

I have linked correctly. @alwx Any workarounds