zulip / zulip-flutter

Upcoming Zulip mobile apps for Android and iOS, using Flutter
Apache License 2.0
202 stars 195 forks source link

Allow zooming to full detail in lightbox #1091

Open gnprice opened 3 days ago

gnprice commented 3 days ago

When viewing an image in the lightbox, you can pinch to zoom; but we currently allow zooming in only by a factor of at most 2.5x, aka 250%.

If you're looking at a large photo on a phone screen, that isn't enough to see all the detail that's there. We should make it possible to zoom in to see all the detail — so at least far enough for a 1:1 mapping between pixels of the image and physical pixels on the display. Then probably more than that, since phone displays tend to be denser than the point at which people can see individual physical pixels clearly.

I'm not sure what the right formula is. The right max scale factor might depend on the size of the original image and the size of the screen. The major reason to have a maximum at all is that if you make a pinch gesture that's interpreted as trying to zoom vastly in, that's not useful (it just fills the screen with a near-featureless blob of a few pixels from the image) and is annoying to zoom back out from. So this issue will require experimenting with different choices, and/or investigating what other apps do, in order to come up with a good formula with a clear rationale.

Given a choice of max scale factor, the actual implementation is easy: just set the maxScale parameter on the InteractiveViewer widget we use in the lightbox.

sher999 commented 1 day ago

Tested on android with 6.67 inch screen size

Tested with below graph for calculating number of boxes in a row is visible on max zoom possible on multiple apps

whatsApp -> 2 box in a row chrome -> 3 box in a row Telegram -> 7 boxes in a row

WhatsApp Image 2024-11-30 at 11 18 31 AM

WhatsApp Image 2024-11-30 at 11 49 22 AM

maxScale : 8 gives the similar behaviour like WhatsApp zoom upto 2 boxes in a row

child: InteractiveViewer(
    maxScale: 8,