feat(qbz-slint): RadioCard 200px + hover-reveal scrollbar base

- RadioCard enlarged to 200x246 to match Album/Playlist cards; ForYouView +
  Spotlight row-width math updated to 200.
- Scrollbar hover-reveal: ListScrollbar gains a reveal prop (default true, no
  regression) and fades on opacity; TrackRow exposes hover-changed; AlbumPageView
  wired as the verified template (row-hover count -> reveal).

cc
This commit is contained in:
vicrodh committed 2026-06-04 13:15:45 -06:00
1 parent cdb5aa0072
commit af2ca1b815
6 files changed
+41 -12

No files matched your search

@@ -11,9 +11,18 @@ export component ListScrollbar inherits Rectangle {
in property <length> viewport-height;
in property <length> visible-height;
in-out property <length> viewport-y;
// Hover-reveal: the owning view sets this true while the pointer is over the
// scrollable rows; the bar also reveals on its own gutter hover/drag. When
// false it fades out. DEFAULTS TRUE so views that don't wire it keep the bar
// always visible (no behaviour change until a view opts in).
in property <bool> reveal: true;
// Only meaningful when the content overflows.
property <length> max-scroll: max(0px, root.viewport-height - root.visible-height);
// Fade out unless revealed (by row hover) or the gutter itself is engaged.
opacity: (root.reveal || bar-ta.has-hover || bar-ta.pressed) ? 1.0 : 0.0;
animate opacity { duration: 150ms; }
property <length> thumb-h:
root.viewport-height > 0px
? max(48px, root.visible-height / root.viewport-height * root.height)
@@ -47,12 +47,20 @@ export component TrackRow inherits Rectangle {
// Whether the row can be dragged onto sidebar playlists.
in property <bool> draggable: true;
callback media-action(string, string, string);
// Reports the row's overall hover state so a list view can reveal its
// scrollbar while the pointer is anywhere over the rows (the proven sidebar
// pattern — a background/Flickable-level TouchArea can't see hover over a
// row's own touch areas).
callback hover-changed(bool);
// Explicit track number, else the 1-based list position.
property <string> number-text:
root.track.number != "" ? root.track.number : "\{root.index + 1}";
property <bool> row-hovered:
ta.has-hover || play-cell.hovered || more-ta.has-hover;
changed row-hovered => {
root.hover-changed(self.row-hovered);
}
height: 50px;
border-radius: 8px;