Simplified Image.js

Summary:
Now that we no longer have a separate NetworkImageView implementation, we can remove that code path from Image.js

I've also moved the prefetch method into RCTImageViewManager for consistency with the getImageSize method, which means we no longer need to export the RCTImageLoader module to js.

Reviewed By: javache

Differential Revision: D3398157

fbshipit-source-id: fbbcf90a61549831ad28bad0cb3b50c375aae32c
This commit is contained in:
Nick Lockwood 2016-06-07 05:29:13 -07:00 committed by Facebook Github Bot 2
parent 592d5fb8f3
commit 748a507861
4 changed files with 47 additions and 67 deletions

View File

@ -11,27 +11,23 @@
*/
'use strict';
var EdgeInsetsPropType = require('EdgeInsetsPropType');
var ImageResizeMode = require('ImageResizeMode');
var ImageSourcePropType = require('ImageSourcePropType');
var ImageStylePropTypes = require('ImageStylePropTypes');
var NativeMethodsMixin = require('NativeMethodsMixin');
var NativeModules = require('NativeModules');
var PropTypes = require('ReactPropTypes');
var React = require('React');
var ReactNativeViewAttributes = require('ReactNativeViewAttributes');
var StyleSheet = require('StyleSheet');
var StyleSheetPropType = require('StyleSheetPropType');
const EdgeInsetsPropType = require('EdgeInsetsPropType');
const ImageResizeMode = require('ImageResizeMode');
const ImageSourcePropType = require('ImageSourcePropType');
const ImageStylePropTypes = require('ImageStylePropTypes');
const NativeMethodsMixin = require('NativeMethodsMixin');
const NativeModules = require('NativeModules');
const PropTypes = require('ReactPropTypes');
const React = require('React');
const ReactNativeViewAttributes = require('ReactNativeViewAttributes');
const StyleSheet = require('StyleSheet');
const StyleSheetPropType = require('StyleSheetPropType');
var flattenStyle = require('flattenStyle');
var requireNativeComponent = require('requireNativeComponent');
var resolveAssetSource = require('resolveAssetSource');
const flattenStyle = require('flattenStyle');
const requireNativeComponent = require('requireNativeComponent');
const resolveAssetSource = require('resolveAssetSource');
var {
ImageLoader,
ImageViewManager,
NetworkImageViewManager,
} = NativeModules;
const ImageViewManager = NativeModules.ImageViewManager;
/**
* A React component for displaying different types of images,
@ -57,7 +53,7 @@ var {
* },
* ```
*/
var Image = React.createClass({
const Image = React.createClass({
propTypes: {
style: StyleSheetPropType(ImageStylePropTypes),
/**
@ -195,7 +191,7 @@ var Image = React.createClass({
* cache
*/
prefetch(url: string) {
return ImageLoader.prefetchImage(url);
return ImageViewManager.prefetchImage(url);
},
},
@ -211,20 +207,11 @@ var Image = React.createClass({
},
render: function() {
var source = resolveAssetSource(this.props.source) || { uri: undefined, width: undefined, height: undefined };
var {width, height, uri} = source;
var style = flattenStyle([{width, height}, styles.base, this.props.style]) || {};
var isNetwork = uri && uri.match(/^https?:/);
var RawImage = isNetwork ? RCTNetworkImageView : RCTImageView;
var resizeMode = this.props.resizeMode || (style || {}).resizeMode || 'cover'; // Workaround for flow bug t7737108
var tintColor = (style || {}).tintColor; // Workaround for flow bug t7737108
// This is a workaround for #8243665. RCTNetworkImageView does not support tintColor
// TODO: Remove this hack once we have one image implementation #8389274
if (isNetwork && (tintColor || this.props.blurRadius)) {
RawImage = RCTImageView;
}
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]) || {};
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');
@ -235,7 +222,7 @@ var Image = React.createClass({
}
return (
<RawImage
<RCTImageView
{...this.props}
style={style}
resizeMode={resizeMode}
@ -246,14 +233,12 @@ var Image = React.createClass({
},
});
var styles = StyleSheet.create({
const styles = StyleSheet.create({
base: {
overflow: 'hidden',
},
});
var RCTImageView = requireNativeComponent('RCTImageView', Image);
var RCTNetworkImageView = NetworkImageViewManager ? requireNativeComponent('RCTNetworkImageView', Image) : RCTImageView;
const RCTImageView = requireNativeComponent('RCTImageView', Image);
module.exports = Image;

View File

@ -134,7 +134,7 @@ __deprecated_msg("Use decodeImageData:size:scale:clipped:resizeMode:completionBl
- (RCTImageLoaderCancellationBlock)getImageSize:(NSString *)imageTag
block:(void(^)(NSError *error, CGSize size))completionBlock
__deprecated_msg("Use getImageSizeWithURLRequest:callback: instead");
__deprecated_msg("Use getImageSizeWithURLRequest:block: instead");
@end

View File

@ -20,9 +20,6 @@
#import "RCTNetworking.h"
#import "RCTUtils.h"
static NSString *const RCTErrorInvalidURI = @"E_INVALID_URI";
static NSString *const RCTErrorPrefetchFailure = @"E_PREFETCH_FAILURE";
static const NSUInteger RCTMaxCachableDecodedImageSizeInBytes = 1048576; // 1MB
static NSString *RCTCacheKeyForImage(NSString *imageTag, CGSize size,
@ -669,27 +666,6 @@ static UIImage *RCTResizeImageIfNeeded(UIImage *image,
}];
}
#pragma mark - Bridged methods
RCT_EXPORT_METHOD(prefetchImage:(NSString *)uri
resolve:(RCTPromiseResolveBlock)resolve
reject:(RCTPromiseRejectBlock)reject)
{
if (!uri.length) {
reject(RCTErrorInvalidURI, @"Cannot prefetch an image for an empty URI", nil);
return;
}
[_bridge.imageLoader loadImageWithURLRequest:[RCTConvert NSURLRequest:uri] callback:^(NSError *error, UIImage *image) {
if (error) {
reject(RCTErrorPrefetchFailure, nil, error);
return;
}
resolve(@YES);
}];
}
#pragma mark - RCTURLRequestHandler
- (BOOL)canHandleRequest:(NSURLRequest *)request

View File

@ -44,11 +44,11 @@ RCT_CUSTOM_VIEW_PROPERTY(tintColor, UIColor, RCTImageView)
view.renderingMode = json ? UIImageRenderingModeAlwaysTemplate : defaultView.renderingMode;
}
RCT_EXPORT_METHOD(getSize:(NSURL *)imageURL
RCT_EXPORT_METHOD(getSize:(NSURLRequest *)request
successBlock:(RCTResponseSenderBlock)successBlock
errorBlock:(RCTResponseErrorBlock)errorBlock)
{
[self.bridge.imageLoader getImageSizeForURLRequest:[NSURLRequest requestWithURL:imageURL]
[self.bridge.imageLoader getImageSizeForURLRequest:request
block:^(NSError *error, CGSize size) {
if (error) {
errorBlock(error);
@ -58,4 +58,23 @@ RCT_EXPORT_METHOD(getSize:(NSURL *)imageURL
}];
}
RCT_EXPORT_METHOD(prefetchImage:(NSURLRequest *)request
resolve:(RCTPromiseResolveBlock)resolve
reject:(RCTPromiseRejectBlock)reject)
{
if (!request) {
reject(@"E_INVALID_URI", @"Cannot prefetch an image for an empty URI", nil);
return;
}
[self.bridge.imageLoader loadImageWithURLRequest:request
callback:^(NSError *error, UIImage *image) {
if (error) {
reject(@"E_PREFETCH_FAILURE", nil, error);
return;
}
resolve(@YES);
}];
}
@end