Rectangular artworks using Grid View?

[gabex]

Hi everyone! I'm new here I hope this is the right place to post this.

I was wondering if there's a way to modify the default skin to make the Grid View show rectangular artworks, for example vertical film covers, or horizontal video thumbnails. If I add a rectangular artwork, it is displayed inside a square shaped item, but I would like to change the height of the items within this view.

So far I was able to modify the .griditem height inside the file "skin_listview.less", reducing the space between "rows" of the grid. However the "items" are still square shaped and they overlap with eachother, so I believe there's a way to achieve what I want.

(I'm not a software developer but I understand some basic coding)

Thanks!

[MiPi]

Hello. We never worked with not square images (as artworks are mostly square, it was not requested), so this is not well tested area. But the main adjustments should look like this (used base skin_listview_add.less from standard MD or Flat skins):

Code: Select all

@heightCoef: 1.5; // height increase to make 2:3 images, adjust the rest with this coefficient
@gridItemHeight: round(@gridItemSize*@heightCoef + 3*@fontLineSize + 2*@lvItemPaddingCol);
@gridItemHeight1Line: round(@gridItemSize*@heightCoef + 2*@fontLineSize + 2*@lvItemPaddingCol);
@gridItemHeight3Line: round(@gridItemSize*@heightCoef + 3.5*@fontLineSize + 2*@lvItemPaddingCol);
.griditem .imageSquare {
  height: round(@gridItemSize*@heightCoef - 4px - @gridItemMargin);
  width: @gridItemSize - 4px - @gridItemMargin;
}
.griditem .imageInfo {
  top: @gridItemSize*@heightCoef + @lvItemPaddingCol + 2px;
  width: @gridItemSize - @gridItemMargin;
}

I.e. at first set some coefficient and then adjust grid item heights accordingly - imageSquare for element with image, and adjust imageInfo, so the the text under the image is placed correctly. This should work quite ok I hope.

[gabex]

Thanks! That was exactly what I wanted!

Is there any way to show more than 1 line below the artwork? I see there is a "@gridItemHeight3Line".

Also is it possible to select the fields/tags shown below the artwork?

Thanks a lot for your help!

[MiPi]

Currently changing contents of the line(s) under artwork is not easily possible. It is definitely in the long-term plan, it is not yet clear when it will be implemented.
@gridItemHeight3Line is used for Albums views, where there are up to 3 lines under artwork - title, artist, rating.

[gabex]

Oh I see. It's not a problem.

Thanks for your help!