diff --git a/src/components/ImageView/index.native.js b/src/components/ImageView/index.native.js
index b5fcaa4a41e1..a7966a4b0b04 100644
--- a/src/components/ImageView/index.native.js
+++ b/src/components/ImageView/index.native.js
@@ -33,7 +33,7 @@ class ImageView extends PureComponent {
super(props);
this.state = {
- isLoading: false,
+ isLoading: true,
imageWidth: 0,
imageHeight: 0,
interactionPromise: undefined,
@@ -52,7 +52,6 @@ class ImageView extends PureComponent {
onStartShouldSetPanResponder: this.updatePanResponderTouches.bind(this),
});
- this.imageLoadStart = this.imageLoadStart.bind(this);
this.configureImageZoom = this.configureImageZoom.bind(this);
}
@@ -79,10 +78,6 @@ class ImageView extends PureComponent {
return false;
}
- imageLoadStart() {
- this.setState({isLoading: true});
- }
-
/**
* The `ImageZoom` component requires image dimensions which
* are calculated here from the natural image dimensions produced by
@@ -137,71 +132,72 @@ class ImageView extends PureComponent {
});
}}
>
- this.zoom = el}
- cropWidth={this.props.windowWidth}
- cropHeight={windowHeight}
- imageWidth={this.state.imageWidth}
- imageHeight={this.state.imageHeight}
- onStartShouldSetPanResponder={() => {
- const isDoubleClick = new Date().getTime() - this.lastClickTime <= this.doubleClickInterval;
- this.lastClickTime = new Date().getTime();
-
- // Let ImageZoom handle the event if the tap is more than one touchPoint or if we are zoomed in
- if (this.amountOfTouches === 2 || this.imageZoomScale !== 1) {
- return true;
- }
-
- // When we have a double click and the zoom scale is 1 then programmatically zoom the image
- // but let the tap fall through to the parent so we can register a swipe down to dismiss
- if (isDoubleClick) {
- this.zoom.centerOn({
- x: 0,
- y: 0,
- scale: 2,
- duration: 100,
- });
- }
-
- // We must be either swiping down or double tapping since we are at zoom scale 1
- return false;
- }}
- onMove={({scale}) => {
- this.imageZoomScale = scale;
- }}
- >
-
- {/**
- Create an invisible view on top of the image so we can capture and set the amount of touches before
- the ImageZoom's PanResponder does. Children will be triggered first, so this needs to be inside the
- ImageZoom to work
- */}
-
-
+ {this.state.containerHeight && (
+ this.zoom = el}
+ cropWidth={this.props.windowWidth}
+ cropHeight={windowHeight}
+ imageWidth={this.state.imageWidth}
+ imageHeight={this.state.imageHeight}
+ onStartShouldSetPanResponder={() => {
+ const isDoubleClick = new Date().getTime() - this.lastClickTime <= this.doubleClickInterval;
+ this.lastClickTime = new Date().getTime();
+
+ // Let ImageZoom handle the event if the tap is more than one touchPoint or if we are zoomed in
+ if (this.amountOfTouches === 2 || this.imageZoomScale !== 1) {
+ return true;
+ }
+
+ // When we have a double click and the zoom scale is 1 then programmatically zoom the image
+ // but let the tap fall through to the parent so we can register a swipe down to dismiss
+ if (isDoubleClick) {
+ this.zoom.centerOn({
+ x: 0,
+ y: 0,
+ scale: 2,
+ duration: 100,
+ });
+ }
+
+ // We must be either swiping down or double tapping since we are at zoom scale 1
+ return false;
+ }}
+ onMove={({scale}) => {
+ this.imageZoomScale = scale;
+ }}
+ >
+
+ {/**
+ Create an invisible view on top of the image so we can capture and set the amount of touches before
+ the ImageZoom's PanResponder does. Children will be triggered first, so this needs to be inside the
+ ImageZoom to work
+ */}
+
+
+ )}
{shouldShowLoadingIndicator && (