Added JS wrappers for ImageStore and ImageEditor

Summary:
public
Added JS wrappers for ImageStore(Manager) and ImageEditor(Manager) so they can be required in the normal way instead of accessed directly via NativeModules.

Reviewed By: dmmiller

Differential Revision: D2773822

fb-gh-sync-id: 6eeafd3f80a87b1b91a04a2aebad6e2fd31b0e98
This commit is contained in:
Nick Lockwood
2015-12-22 13:36:37 -08:00
committed by facebook-github-bot-3
parent b7e939b38d
commit 83c2e0303b
8 changed files with 186 additions and 25 deletions

View File

@@ -20,6 +20,7 @@ var React = require('react-native');
var {
CameraRoll,
Image,
ImageEditor,
NativeModules,
ScrollView,
StyleSheet,
@@ -28,7 +29,7 @@ var {
UIManager,
View,
} = React;
var ImageEditingManager = NativeModules.ImageEditingManager;
var RCTScrollViewConsts = UIManager.RCTScrollView.Constants;
var PAGE_SIZE = 20;
@@ -43,14 +44,16 @@ type ImageSize = {
height: number;
};
type TransformData = {
type ImageCropData = {
offset: ImageOffset;
size: ImageSize;
}
displaySize?: ?ImageSize;
resizeMode?: ?any;
};
class SquareImageCropper extends React.Component {
_isMounted: boolean;
_transformData: TransformData;
_transformData: ImageCropData;
constructor(props) {
super(props);
@@ -167,7 +170,7 @@ class SquareImageCropper extends React.Component {
}
_crop() {
ImageEditingManager.cropImage(
ImageEditor.cropImage(
this.state.randomPhoto.uri,
this._transformData,
(croppedImageURI) => this.setState({croppedImageURI}),
@@ -231,7 +234,7 @@ class ImageCropper extends React.Component {
var sizeRatioX = croppedImageSize.width / scaledImageSize.width;
var sizeRatioY = croppedImageSize.height / scaledImageSize.height;
this.props.onTransformDataChange && this.props.onTransformDataChange({
var cropData: ImageCropData = {
offset: {
x: this.props.image.width * offsetRatioX,
y: this.props.image.height * offsetRatioY,
@@ -240,7 +243,8 @@ class ImageCropper extends React.Component {
width: this.props.image.width * sizeRatioX,
height: this.props.image.height * sizeRatioY,
},
});
};
this.props.onTransformDataChange && this.props.onTransformDataChange(cropData);
}
render() {
@@ -271,8 +275,8 @@ class ImageCropper extends React.Component {
}
exports.framework = 'React';
exports.title = 'ImageEditingManager';
exports.description = 'Cropping and scaling with ImageEditingManager';
exports.title = 'ImageEditor';
exports.description = 'Cropping and scaling with ImageEditor';
exports.examples = [{
title: 'Image Cropping',
render() {