Created
December 1, 2018 13:59
-
-
Save mmazzarolo/45b7fc49b9e5dd5007f2090bc9e8cc83 to your computer and use it in GitHub Desktop.
Image decoding limit workaround for RN (Android)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export default class CroppedImage extends Component { | |
state = { | |
croppedImageSources: [] | |
}; | |
async componentDidMount() { | |
const crops = 4; | |
const croppedImageHeight = imHeight / crops; | |
const croppedImageSources = []; | |
for (let i = 0; i <= crops; i++) { | |
const cropData = { | |
offset: { x: 0, y: croppedImageHeight * i }, | |
size: { width: imgWidth, height: croppedImageHeight } | |
}; | |
const croppedImageSource = await asyncCropImage( | |
this.props.url, | |
cropData | |
); | |
croppedImageSources.push(croppedImageSource); | |
} | |
this.setState({ croppedImageSources }); | |
} | |
render() { | |
return this.state.croppedImageSources.map(source => ( | |
<Image style={styles.image} source={source} /> | |
)); | |
} | |
} | |
const styles = StyleSheet.create({ | |
image: { | |
width: width, | |
height: croppedImageHeight | |
} | |
}); | |
const asyncCropImage = async (source: string, cropData: any) => | |
new Promise((resolve, reject) => { | |
const onSuccess = imageUri => resolve(imageUri); | |
const onFailure = err => { | |
return reject(new Error(err)); | |
}; | |
ImageEditor.cropImage(source, cropData, onSuccess, onFailure); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
From my testing both
Image
(Fresco) andFastImage
(Glide) have this issue.If the image is a JPEG you might be able to fix it using
resizeMethod="resize"
.