A react component for displaying images adapted to Ionic design.
- Pinch-to-zoom capability.
- IonAvatar and IonThumbnail support.
- Blurred background support (Available for Chrome and Safari).
- IonHeader integration to adapt it to the native design.
example_dark.mov
example_light.mov
npm install --save @codesyntax/ionic-react-photo-viewer// import component import IonPhotoViewer from '@codesyntax/ionic-react-photo-viewer'; // TSX <IonItem button lines="none" detail={false}> <IonAvatar slot="start"> <IonPhotoViewer title="Martin arrantzalea" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Alcedo_Atthis.jpg/1280px-Alcedo_Atthis.jpg" licenseKey='your-license-key' > <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Alcedo_Atthis.jpg/1280px-Alcedo_Atthis.jpg" alt="Martin arrantzalea" /> </IonPhotoViewer> </IonAvatar> <IonLabel>Martin arrantzalea</IonLabel> </IonItem>- title: string
- The title of the image.
- src: string
- The source of the image in hight quality.
- licenseKey: string
- The license key of lightgallery.
- children: React.ReactNode
- Img element.