status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-05 06:04:15 +00:00
Code Issues Projects Releases Wiki Activity

Better doc for 'data:' uri scheme & mandatory size

Browse Source 
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.

Also, the mandatory size style for network & data images should be mentioned here, not only in the image guide.

<!--
Thank you for sending the PR!

If you changed any code, please provide us with clear instructions on how you verified your changes work. In other words, a test plan is *required*. Bonus points for screenshots and videos!

Please read the Contribution Guidelines at https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md to learn more about contributing to React Native.

Happy contributing!
-->
Closes https://github.com/facebook/react-native/pull/14826

Differential Revision: D5401671

Pulled By: hramos

fbshipit-source-id: 8f1f28a94095eeaccae9234e059e0983ba3556b2
This commit is contained in:
harry-g 2017-07-11 15:27:02 -07:00 committed by Facebook Github Bot
parent 8ea6cea39a
commit ec8118b637
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Libraries/Image/Image.ios.js
View File

@ -35,8 +35,10 @@ const ImageViewManager = NativeModules.ImageViewManager;
* including network images, static resources, temporary local images, and * including network images, static resources, temporary local images, and
* images from local disk, such as the camera roll. * images from local disk, such as the camera roll.
* *
* This example shows both fetching and displaying an image from local * This example shows fetching and displaying an image from local storage
* storage as well as one from network. * as well as one from network and even from data provided in the `'data:'` uri scheme.
*
* > Note that for network and data images, you will need to manually specify the dimensions of your image!
* *
* ```ReactNativeWebPlayer * ```ReactNativeWebPlayer
* import React, { Component } from 'react'; * import React, { Component } from 'react';
@ -53,6 +55,10 @@ const ImageViewManager = NativeModules.ImageViewManager;
* style={{width: 50, height: 50}} * style={{width: 50, height: 50}}
* source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} * source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}}
* /> * />
* <Image
* style={{width: 66, height: 58}}
* source={{uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAEXRFWHRTb2Z0d2FyZQBwbmdjcnVzaEB1SfMAAABQSURBVGje7dSxCQBACARB+2/ab8BEeQNhFi6WSYzYLYudDQYGBgYGBgYGBgYGBgYGBgZmcvDqYGBgmhivGQYGBgYGBgYGBgYGBgYGBgbmQw+P/eMrC5UTVAAAAABJRU5ErkJggg=='}}
* />
* </View> * </View>
* ); * );
* } * }