Thumbnail photo wall view (ala Google Photos & Pinterest)

[red.dusk]

Could you support a thumbnail photo wall view where the size of thumbnails is adjusted dynamically in order to display a "wall-to-wall" grid of thumbnails with no wasted space? Subjectively, it's more efficient and looks way more attractive than the current grid layout with static thumbnail sizes and large gaps between each thumbnail.

I'm not sure what the industry-standard term is for this view. In Adobe Lightroom, this is called the "photo grid" (as opposed to the "square grid").

This UI is used by several modern photo viewers, but none have the performance and flexibility of XnView. Thanks for all the amazing features you've built into XnView!

Microsoft Photos


Adobe Lightroom



Pictureflect Photo Viewer


PhotoInsight


Google Photos


123 Photo Viewer


Pinterest-style Grid Layout

[xnview]

i'll check how to do it

[XnTriq]

Related request:

There are certain scenarios (see my previous posts) where I'd like to be able to temporarily switch the browser's layout, even if that comes at the price of a less efficient use of the available screen space.

Masonry, Isotope, and Packery are all similar in that they are layout libraries. Many of their options and methods are the same.
Masonry does cascading grid “masonry” layouts. Packery does bin-packing layouts, which allow it to be used for draggable interactions.
Isotope does sorting and filtering. Isotope uses masonry layouts, as well as other layouts.

• Layout modes: Intelligent, dynamic layouts that can’t be achieved with CSS alone.
• Filtering: Hide and reveal item elements easily with jQuery selectors.
• Sorting: Re-order item elements with sorting. Sorting data can be extracted from just about anything.
• Interoperability: features can be utilized together for a cohesive experience.
• Progressive enhancement: Isotope's animation engine takes advantage of the best browser features when available — CSS transitions and transforms, GPU acceleration — but will also fall back to JavaScript animation for lesser browsers.

Packery is a JavaScript layout library that uses a bin-packing algorithm. This is a fancy way of saying “it fills empty gaps.” Packery layouts can be intelligently ordered or organically wild. Elements can be stamped in place, fit in an ideal spot, or dragged around.

These alternative and innovative ways of browsing images (Tumblr, Pinterest etc.) will find their way into desktop applications — sooner rather than later. Pierre's always been an early adopter (-;

[XnTriq]

i'll check how to do it

• Qt Forum
  • How to display a grid of non-uniform cells ?
• Stack Overflow
  • Block layout algorithm
  • Algorithm for rectangles position
  • 2D bin packing on a grid

• Code inComplete: Binary Tree Bin Packing Algorithm

Keywords / search terms: bin packing, shape packing, polyomino, masonry

[helmut]

+1
I support this request. This way of viewing pictures is very cool and reminds me a bit of a photo album.

[KLE-France]

+1 BUT only if it's an addition to the current "slide-like" layout, not a replacement for it.

Indeed the current layout, where all photos are presented in a same-sized square has the advantage of keeping all images at roughly the same size, whether landscape or portrait oriented.

In "photowall" layouts, either landscape images are overvalued (take up more screen space) compared to portrait ones, or, some random image is enlarged (thus overvalued) by the algorithm to glue together a completely-filled screen.

I'm not against photowall layouts, but for culling and other "judgement" tasks, it is important that all the images be roughly equal in size.

[BK201]

I need this

[otsoa]

Hi ! News about this feature ?