Description:
An image modal component for React Native that shows the selected image in a full-size modal window allows that image to be zoomed in/out with touch pinch.
How to use it:
1. Install and import the ImageModal.
# NPM $ npm i react-native-image-modal
import ImageModal from 'react-native-image-modal';
2. Add the Image Modal component to the app.
<ImageModal
swipeToDismiss={false}
resizeMode="contain"
imageBackgroundColor="#000000"
style={{
width: imageWidth,
height: 250,
}}
source={{
uri:
'1.jpg',
}}
/>3. Available component props.
isRTL?: boolean;
renderToHardwareTextureAndroid?: boolean;
isTranslucent?: boolean;
swipeToDismiss?: boolean;
imageBackgroundColor?: string;
overlayBackgroundColor?: string;
hideCloseButton?: boolean;
modalRef?: LegacyRef<ImageDetail>;
disabled?: boolean;
modalImageStyle?: ImageStyle;
modalImageResizeMode?: ResizeMode; // ResizeMode('contain', 'cover', 'stretch','center')
onLongPressOriginImage?: () => void;
renderHeader?: (close: () => void) => JSX.Element | Array<JSX.Element>;
renderFooter?: (close: () => void) => JSX.Element | Array<JSX.Element>;
onTap?: (eventParams: OnTap) => void;
onDoubleTap?: () => void;
onLongPress?: () => void;
onOpen?: () => void;
didOpen?: () => void;
onMove?: (position: OnMove) => void;
responderRelease?: (vx?: number, scale?: number) => void;
willClose?: () => void;
onClose?: () => void;Preview:
