Skip to content

Pinch-to-zoom in lightbox (mobile) #125

Description

@Darkkal

Parent Issue

Part of #74 — More controls for media in lightbox

Problem

On mobile, users expect to pinch-to-zoom on images just like in native photo viewers. The zoom infrastructure from the fit mode & zoom sub-issue provides the scale/pan state, but touch gesture recognition needs dedicated handling.

Proposed Design

  • Two-finger pinch gesture on images enters zoom mode (if in fit mode) and adjusts zoom level
  • Uses the same lightboxZoomMin / lightboxZoomMax bounds from settings
  • Zoom anchors to the midpoint between the two fingers
  • Pinch gestures are distinguished from single-finger swipe (navigation) by tracking touch count
  • When zoomed in via pinch, single-finger drag pans the image (swipe-to-navigate disabled)
  • When zoom returns to or below fit level, fit mode re-engages and swipe-to-navigate resumes

Acceptance Criteria

  • Two-finger pinch-in zooms out, pinch-out zooms in
  • Zoom is bounded by lightboxZoomMin and lightboxZoomMax from settings
  • Zoom anchors to the midpoint between the two touch points
  • Pinch gestures do not trigger swipe navigation
  • Single-finger pan works when zoomed in (swipe-to-navigate disabled)
  • Releasing pinch below fit-level snaps back to fit mode and re-enables swipe navigation
  • Zoom percentage overlay appears during pinch zoom
  • Videos are excluded from pinch-to-zoom
  • Zoom state resets on navigation to next/prev item

Edge Cases

  • Rapid alternation between one-finger and two-finger touches — debounce gesture detection to avoid flickering between pan and navigate modes
  • Pinching while the bottom sheet sidebar is open — pinch should only activate on the media area, not the sidebar
  • Very small pinch movements (< threshold) should be ignored to prevent accidental zoom

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions