Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Jan 3, 2026

WinUI lacked a dedicated Now Playing view similar to Android. Both platforms needed tap/click-to-seek on lyric lines.

Changes

WinUI Now Playing Page (NowPlayingPage.xaml/.cs)

  • Two-column layout: 300×300 cover + metadata chips (left), scrollable lyrics (right)
  • Blurred album art background via ImageFilterUtils.ApplyFilter(FilterType.Blur)
  • Real-time lyric sync using existing LyricsMgtFlow.CurrentLyricIndex observable
  • Click-to-seek: lyric lines invoke SeekTrackPositionCommand with TimeStampMs / 1000.0
  • Color-coded: white (past), white+bold (current), grey 80% opacity (upcoming)
  • Auto-scroll via BringIntoView with 30% vertical alignment
  • Fallback UI for missing lyrics with navigation to editor

Navigation Integration

  • Added button in MediaPlaybackSection top bar (Glyph: )
  • Handler navigates via Frame to typeof(NowPlayingPage)

Android Enhancement (LyricsViewFragment.cs)

  • LyricsAdapter constructor now accepts BaseViewModelAnd for seek commands
  • Added click listener per TextView in OnBindViewHolder:
    h.TextView.Click += (s, e) => {
        var positionInSeconds = item.TimeStampMs / 1000.0;
        _viewModel.SeekTrackPositionCommand?.Execute(positionInSeconds);
    };
  • Ripple effect via SelectableItemBackground attribute on TextView creation

Technical Notes

  • Reactive subscriptions properly disposed in OnNavigatedFrom
  • Null checks for _viewModel, _currentSong, _allLyrics throughout
  • WinUI 3 cursor handling: ProtectedCursor = InputSystemCursor.Create()
  • Zero breaking changes; reuses existing services and patterns
Original prompt

This section details on the original issue you should resolve

<issue_title>Implementing a now playing page for WinUI and even a focus mode for both. </issue_title>
<issue_description>It would be cool to have a now playing section like Droid has.
Funnily enough I did it all for droid, including a fragment to view sync lyrics as they change.

Windows doesn't have such page.

On WinUI such page will have the cover image at left position size 300x300,
Under it I'll have chips-like buttons in a VSL showing
Others artist name
Genre
Year,
Current queue TQL.
On right/rest of screen we have the lyrics if any that's scrollable & each line is clickable since clicking it will seek to the song position of that lyric.
The page's BG is a glass/blur version of the cover image , I have static methods for that already done.

If no lyrics, show a chip to search or add that will bring to edit lyrics page.

On Android typing on lyric line should also seek to position.
Lastly, each time a lyric belongs to the past (meaning song position is past it,) that line is white, each upcoming one is grey with opacity 0.8</issue_description>

Comments on the Issue (you are @copilot in this section)


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot AI and others added 4 commits January 3, 2026 17:50
Co-authored-by: YBTopaz8 <41630728+YBTopaz8@users.noreply.github.com>
Co-authored-by: YBTopaz8 <41630728+YBTopaz8@users.noreply.github.com>
Co-authored-by: YBTopaz8 <41630728+YBTopaz8@users.noreply.github.com>
Co-authored-by: YBTopaz8 <41630728+YBTopaz8@users.noreply.github.com>
Copilot AI changed the title [WIP] Implementing now playing page for WinUI with focus mode Add Now Playing page for WinUI with lyrics sync and tap-to-seek for both platforms Jan 3, 2026
Copilot AI requested a review from YBTopaz8 January 3, 2026 17:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Implementing a now playing page for WinUI and even a focus mode for both.

2 participants