Image
An enhanced image component with lazy loading, fallback, preview lightbox, and gallery support.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <Image />
When to Use
- Displaying images with click-to-zoom preview lightbox
- Photo galleries with grid layout and navigation
- Image previews with lazy loading for performance optimization
- Any image display that needs fallback handling on load errors
Mobile (rc.49). Set
Zoomable="true" to enable native pinch-to-zoom on touch devices via the touch-action: pinch-zoom hint and a pointer-event zoom gesture.
Fullscreen gestures (rc.52).
ImageGallery supports touch gestures in the fullscreen preview: swipe left/right (≥ 60 px) to navigate between images, and two-finger pinch to zoom (25 %–300 %). Set GesturesEnabled="false" to opt out.
API Reference
Image
ImageGallery
Related Components
- Avatar — Display small circular user or entity images
- AspectRatio — Constrain images to a specific width-to-height ratio
- Carousel — Cycle through images in a slideshow format