component is not working with external URL on Android

Question

Does anyone know why <Image /> component with external(HTTPS) URL is not working correctly on Android?

I've tried to render avatar but Android just skip this <Image /> component like it does not exist.

<Image source={{ url: "https://yabs.yandex.ru/resource/B4_LwOqnl6akXYQRO4jj2R_banana_20141031_1.png", }} style={{width: 148, height: 90}} />

I'm a newbie in RN and Andriod, thanks in advance.

Update:

the problem was with url property. React Native uses uri instead.

Hardik Vaghani · Answer 1 · 2016-07-16T07:14:32.170

0

For Android

You will have to use something like Universal Image Loader. Because providing http url to <image /> will not work.

Other libraries available : Picasso and Glide image loader

OR

Alternatively you will have to manually get image from url and assign it

URL url = new URL("http://XXXXX");
Bitmap bmp = BitmapFactory.decodeStream(url.openConnection().getInputStream());
imageView.setImageBitmap(bmp);

And

edited Jul 16 '16 at 07:14

answered Jul 16 '16 at 06:40

Hardik Vaghani

1

Thanks! For react native I found _Universal Image Loader_'s wrapper - [react-native-image-cache](https://github.com/Anthonyzou/react-native-image-cache) – olebedev Jul 16 '16 at 06:55
Updated my answer. Thanks – Hardik Vaghani Jul 16 '16 at 07:04
But, seems React Native uses https://github.com/facebook/fresco (see: http://stackoverflow.com/questions/29363321/picasso-v-s-imageloader-v-s-fresco-vs-glide) under the hood for image caching. The question is, why it's not works? – olebedev Jul 16 '16 at 07:20

score 0 · Answer 2 · answered Jul 17 '16 at 02:00

0

You have invalid syntax. Correct source property is uri not url.

answered Jul 17 '16 at 02:00

farwayer

yeah, I know. But it's to strange that it works on the iOS. – olebedev Jul 18 '16 at 07:24

2 Answers2