Customize display of library grid pages (#368)

## Details

Adds options to customize how grid pages are displayed. Every grid page
can be individually customized.

The options are saved per user on the device and restored when
navigating back to the page. The pages that support it have a new button
next to the sort/filter buttons and changes are updated live.

The options are:
* Primary or Thumb image
* Aspect ratio
* Show details header w/ backdrop (similar to the one on the home page)
* Number of columns
* Spacing between cards
* Card image content scale (eg Fit, Fill, Crop, etc)

Note: the Genre tabs' grids cannot be customized yet

### Other changes
- Nav drawer now opens over top of content instead of pushing it
- Images for most cards are fetched with actual fill size

### Possible future work
* Customize Genre grids
* Add more image types, banners?
* Add similar customization options to pages with rows, eg Home page and
Recommended tabs

## Example

For example, this is a movie library using thumb images with 8 columns
and reduced spacing. It also shows the details header

## Issues
Closes #186
Related to #72
This commit is contained in:
damontecres 2025-12-04 12:20:50 -05:00 committed by GitHub
parent b98fb4a1d8
commit 384401a72c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
47 changed files with 1658 additions and 628 deletions

View file

@ -329,6 +329,12 @@
<string name="subtitle_margin">Margin</string>
<string name="verbose_logging">Verbose logging</string>
<string name="image_cache_size">Image disk cache size (MB)</string>
<string name="view_options">View options</string>
<string name="columns">Columns</string>
<string name="spacing">Spacing</string>
<string name="aspect_ratio">Aspect Ratio</string>
<string name="show_details">Show details</string>
<string name="image_type">Image type</string>
<string-array name="theme_song_volume">
<item>Disabled</item>
@ -404,4 +410,17 @@
<item>MPV (Experimental)</item>
</string-array>
<string-array name="aspect_ratios">
<item>Poster (2:3)</item>
<item>16:9</item>
<item>4:3</item>
<item>Square (1:1)</item>
</string-array>
<string-array name="image_types">
<item>Primary</item>
<item>Thumb</item>
<!-- <item>Banner</item>-->
</string-array>
</resources>