diff --git a/app/presentation/ImageViewer/ImageViewer.android.js b/app/presentation/ImageViewer/ImageViewer.android.js index 9c3a29049..2cd8578bb 100644 --- a/app/presentation/ImageViewer/ImageViewer.android.js +++ b/app/presentation/ImageViewer/ImageViewer.android.js @@ -260,6 +260,21 @@ function bouncy( const WIDTH = 300; const HEIGHT = 300; +class Image extends React.PureComponent { + static propTypes = { + imageComponentType: PropTypes.string + } + + render() { + const { imageComponentType } = this.props; + + const Component = ImageComponent(imageComponentType); + + return ; + } +} +const AnimatedImage = Animated.createAnimatedComponent(Image); + // it was picked from https://github.com/software-mansion/react-native-reanimated/tree/master/Example/imageViewer // and changed to use FastImage animated component export class ImageViewer extends React.Component { @@ -386,12 +401,9 @@ export class ImageViewer extends React.Component { render() { const { - uri, width, height, theme, imageComponentType, ...props + uri, width, height, imageComponentType, theme, ...props } = this.props; - const Component = ImageComponent(imageComponentType); - const AnimatedFastImage = Animated.createAnimatedComponent(Component); - // The below two animated values makes it so that scale appears to be done // from the top left corner of the image view instead of its center. This // is required for the "scale focal point" math to work correctly @@ -416,7 +428,7 @@ export class ImageViewer extends React.Component { onGestureEvent={this._onPanEvent} onHandlerStateChange={this._onPanEvent} > -