react-native-image-zoom
react-native-image-zoom copied to clipboard
Huge image cannot be reduced
Hi Image shows up huge and cannot be zoomed out. The image's size is 3300x1800 Screen is 1242x2208 (iphone 7plus)
<View style={{ flex: 1 }}>
{!loadimage && (
<Spinner />
)}
{loadimage && (
<ImageZoom
cropWidth={Dimensions.get('window').width}
cropHeight={Dimensions.get('window').height - 50}
imageWidth={width}
imageHeight={height}
>
<Image
style={{ width, height }}
source={{
uri: urlImage,
}}
/>
</ImageZoom>
)}
</View>
What am I doing wrong? Thanks!
Can you give me a example image?
Sorry, what do you mean with an example? The code I pasted is what I have. Isn't it an example? Do you want the whole render() method? Thanks!!
EDIT: My problem might be related to the problem of not knowing the size of the image, as this screen is used for different, changing, images.
Image is 4 o 5 times bigger than screen and cannot be reduced.
@connect(mapStateToProps)
export default class ImageView extends Component {
render() {
const { url, use } = this.props;
const source = {
uri: `${url}`,
headers:
{
Authorization: `Bearer ${use.token}`,
},
}
return (
<ImageZoom
cropWidth={Dimensions.get('window').width}
cropHeight={Dimensions.get('window').height}
imageWidth={3300}
imageHeight={1800}
>
<Image
style={{ width: 3300, height: 1800 }}
resizeMode="contain"
source={source}
/>
</ImageZoom>
);
}
}
@ascoders if I set imageWidth={400}, imageHeight={400}, style={{ width: 400, height: 400 }} it more or less work, but image is not centered, depends on the size of the screen.
@dhcmega imageWidth
and imageHeight
should be the image's original size.
@ascoders yes, I know, these are the real values: imageWidth={3300} and imageHeight={1800} with these values, image doesn't show up.
This is a real bug.
Any updates on that?
any update on this, im facing a similar issue. It only manifests itsself in release builds on iOS
+1 having issues on this
Were you able to solve this?