Permalink
Browse files

Better doc for 'data:' uri scheme

Summary:
It is quite confusing that the 'data:' uri scheme is not documented, but working.
It is very useful when getting e.g. an icon from a REST call.
Closes #14827

Differential Revision: D5392326

Pulled By: hramos

fbshipit-source-id: 815851c27273f99ce281fb35fc6fbcf8cf781ff9
  • Loading branch information...
harry-g authored and facebook-github-bot committed Jul 10, 2017
1 parent 40fdd6d commit dfd3b222757f87a7ff563e78b1eac2b5f311aef9
Showing with 11 additions and 0 deletions.
  1. +11 −0 docs/Images.md
View
@@ -120,6 +120,17 @@ Many of the images you will display in your app will not be available at compile
style={{width: 400, height: 400}} />
```
## Uri Data Images
Sometimes, you might be getting encoded image data from a REST API call. You can use the `'data:'` uri scheme to use these images. Same as for network resources, *you will need to manually specify the dimensions of your image*.
> This is recommended for very small and dynamic images only, like icons in a list from a DB.
```javascript
// include at least width and height!
<Image style={{width: 51, height: 51, resizeMode: Image.resizeMode.contain}} source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAEXRFWHRTb2Z0d2FyZQBwbmdjcnVzaEB1SfMAAABQSURBVGje7dSxCQBACARB+2/ab8BEeQNhFi6WSYzYLYudDQYGBgYGBgYGBgYGBgYGBgZmcvDqYGBgmhivGQYGBgYGBgYGBgYGBgYGBgbmQw+P/eMrC5UTVAAAAABJRU5ErkJggg=='}}/>
```
### Cache Control (iOS Only)
In some cases you might only want to display an image if it is already in the local cache, i.e. a low resolution placeholder until a higher resolution is available. In other cases you do not care if the image is outdated and are willing to display an outdated image to save bandwidth. The `cache` source property gives you control over how the network layer interacts with the cache.

0 comments on commit dfd3b22

Please sign in to comment.