CODEWITHSUNDEEP
javascriptimagereactjsreact-native
Khalil Khalaf
Khalil Khalaf

Reputation: 9407

how to resize image before fetching it?

Say I have an Image Component that has a uri as its source:

return (
    <TouchableOpacity onPress={() => {} } 
         <Image source={{uri: "https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&f=y"}} />       
    </TouchableOpacity>
);

If it happened that that uri belongs to a very big image, Can I control the size of the image and explicitly set its height and width before fetching it? Or that can't happen from the client side?

Thanks

Upvotes: 0

Views: 1141

Answers (1)

jered
jered

Reputation: 11571

If you're fetching the image from an API, sometimes you can specify the desired image size in the request.

For example, since in your question you are fetching from a Gravatar API, you could simply specify the desired image size using the s or size parameter:

https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&f=y&s=200

When you're using an API, check the developer documentation for features like this so that you know what you're working with.

Upvotes: 4

Related Questions