mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-24 04:16:00 +08:00
Implement multi-source Images on iOS
Summary: Mirrors Android's support for multiple sources for Image, allowing us to fetch new images as the size of the view changes. Reviewed By: mmmulani Differential Revision: D3615134 fbshipit-source-id: 3d0bf2b75f63a4379e0e49f2dab9aea351b31d5f
This commit is contained in:
committed by
Facebook Github Bot 2
parent
7e2e0deeb0
commit
fd48bc3cff
@@ -103,6 +103,11 @@ const Image = React.createClass({
|
||||
style: StyleSheetPropType(ImageStylePropTypes),
|
||||
/**
|
||||
* The image source (either a remote URL or a local file resource).
|
||||
*
|
||||
* This prop can also contain several remote URLs, specified together with
|
||||
* their width and height and potentially with scale/other URI arguments.
|
||||
* The native side will then choose the best `uri` to display based on the
|
||||
* measured size of the image container.
|
||||
*/
|
||||
source: ImageSourcePropType,
|
||||
/**
|
||||
@@ -268,15 +273,25 @@ const Image = React.createClass({
|
||||
|
||||
render: function() {
|
||||
const source = resolveAssetSource(this.props.source) || { uri: undefined, width: undefined, height: undefined };
|
||||
const {width, height, uri} = source;
|
||||
const style = flattenStyle([{width, height}, styles.base, this.props.style]) || {};
|
||||
|
||||
let sources;
|
||||
let style;
|
||||
if (Array.isArray(source)) {
|
||||
style = flattenStyle([styles.base, this.props.style]) || {};
|
||||
sources = source;
|
||||
} else {
|
||||
const {width, height, uri} = source;
|
||||
style = flattenStyle([{width, height}, styles.base, this.props.style]) || {};
|
||||
sources = [source];
|
||||
|
||||
if (uri === '') {
|
||||
console.warn('source.uri should not be an empty string');
|
||||
}
|
||||
}
|
||||
|
||||
const resizeMode = this.props.resizeMode || (style || {}).resizeMode || 'cover'; // Workaround for flow bug t7737108
|
||||
const tintColor = (style || {}).tintColor; // Workaround for flow bug t7737108
|
||||
|
||||
if (uri === '') {
|
||||
console.warn('source.uri should not be an empty string');
|
||||
}
|
||||
|
||||
if (this.props.src) {
|
||||
console.warn('The <Image> component requires a `source` property rather than `src`.');
|
||||
}
|
||||
@@ -287,7 +302,7 @@ const Image = React.createClass({
|
||||
style={style}
|
||||
resizeMode={resizeMode}
|
||||
tintColor={tintColor}
|
||||
source={source}
|
||||
source={sources}
|
||||
/>
|
||||
);
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user