vovkasm / react-native-web-image

An image component for react-native with persistent disk and memory caching.
MIT License
146 stars 25 forks source link

Placeholder Image #9

Open praneeth-alla opened 7 years ago

praneeth-alla commented 7 years ago

Hi,

Can you please tell me how can I set a placeholder image into the image view if for any reason my image downloading takes time. SO what's happening now is for the first time the image downloading takes time and until it downloads the image view shows white background and replaces the white background with the image after download complete. In glide we have something called set placeholder, it will display the default image until it downloads the image and replaces that. Can you please tell me if there is something like that for this library?

Thanks praneeth

vovkasm commented 7 years ago

We need to think about that feature, because it can be implemented in various ways.

Currently, at least one people has fork with this feature (thanks to github fork graphs): https://github.com/vevo-sterling-li/react-native-web-image/commit/59c4469a01c6976b5f1c8e6f6eae1dfb7a273799

I will mark this issue as TODO currently.

praneeth-alla commented 7 years ago

@vovkasm Thank you. I am looking this in Android.

praneeth-alla commented 7 years ago

@vovkasm Just a quick question. I did a small change in WebImageViewManager like below Glide.with(view.getContext()) .load(uri) .listener(LISTENER) .dontTransform() .placeholder(R.mipmap.placeholderimage) .into(view); and kept my images in res/mipmap folders. By doing this the placeholder feature works good but the border radius of the image view is gone and not working now. If I remove the .placeholder(R.mipmap.placeholderimage) line again the border radius works. Can you please give me any suggestions on how to fix this or do you know why this is happening?

vovkasm commented 7 years ago

Yes, probably... But first I have a question. The code that you provide does not exist in current master branch, there has been big refactoring since code like Glide.with(view.getContext())....into(view); was there. So I need to know what version of code in this repo I should look at.

praneeth-alla commented 7 years ago

@vovkasm I am using fix-border-radius branch latest code. Thank you

I shifted to master and tried like the below Glide.with(activity).load(mUri).asBitmap().placeholder(R.mipmap.placeholderimage).into(mGlideTarget); border radius is working good but now placeholder image doesn't show up with this change in master.

Any help would be greatly appreciated