Custom Spacing between Items

This property has been recently available in other views, but Details view was exception since its selections needed to be treated in different way: They overlap by 1 pixel so that the double border is avoided in neighboring selections:

1 px overlap of items

We have resolved this to get proper behavior with custom spacings and now the spacing can be set the same way as in any other view:

Simply set LayoutItemsCurrent.ElementOuterPadding to have custom horizontal and vertical padding between items.

You can set this specifically for Details view by refering to property LayoutItemsDetails or LayoutItemsDetailsColumns (Details view with columns).

Our great inspiration for designing Better ListView is nothing less than the mighty Windows Explorer. This file manager uses obviously much more powerful control that the regular .NET list-view alone is.

It supports some extra views, line Contents and Extra Large Icons. It is also possible to adjust image size by rolling a mouse wheel while holding Control key.

Better ListView has the capability of displaying item icons with arbitrary sizes, but we also extended it with one extra view: Thumbnails:

Thumbnails Sample

This view aligns items in the center while keeping constant spacing between items. Thumbnails also keep just single line of text for compactness. On the other hand, LargeIcon view varies horizontal space between items to fill client area evenly and breaks long text into several lines.

The constant spacing is inspired by various photo managers, where image thumbnails are better viewed side-by-side (and the view looks also more organized).

Image thumbnails also look better with some kind border or frame. We added this new feature in Better ListView 1.5 and it works in all views. There are several pre-defined types of borders, but user can draw his own:

• None – simply no border at all
• Single – single line border
• SingleOffset – single line with a spacing between image and the border
• SymmetricShadow – smooth shadow around image
• DropShadow – smooth shadow on the right bottom part of the image

Thumbnails use DropShadow by default, but it can be adjusted for every view separately. One can also adjust thickness of the border/shadow and define custom spacing around image.

Take a look at one possible setting:

Image Borders

This is SingleOffset border of width 3 pixels. Notice that also column header images can have its borders (these are SymmetricShadow).

When the border is defined and image size should be kept the same, some spacing have to be added around image. You can adjust this spacing to draw you own borders or any additional graphics (such as overlay icons). Here is an example –

Thumbnail with Extra Icons

Download Better ListView

You can download Better ListView and play with it yourself.