Skip to content

Add adaptive foldable two-pane UI with DU60 and refine Vietnamese localization - #229

Open
chiraitori wants to merge 6 commits into
PixelPlayerHQ:mainfrom
chiraitori:refine-vi-and-fix-foldable-ui
Open

chiraitori wants to merge 6 commits into
PixelPlayerHQ:mainfrom
chiraitori:refine-vi-and-fix-foldable-ui

Conversation

@chiraitori

@chiraitori chiraitori commented Nov 8, 2026 •

Copy link
Copy Markdown
Contributor

What changed

1. Adaptive Foldable & Large-Screen UI (WindowSizeClass Support)

  • Navigation Rail & Adaptive Scaffold: Added PlayerNavigationRail for medium/expanded width displays (>= 600dp), paired with animated rounded corners (animatedRailContentCornerRadius) on the main content container and a centered floating mini-player (460.dp).
  • Immersive Full-Screen Player & Dynamic Two-Pane Split (FullPlayerTwoPaneFoldableContent):
    • Closed state: Renders a spacious centered player (minOf(520.dp, maxWidth)) covering the navigation rail for an edge-to-edge full-screen experience.
    • Open state (Two-Pane): Smoothly morphs the player to the left pane while sliding in an embedded side pane (EmbeddedLyricsPane or EmbeddedQueuePane) on the right.
    • 120Hz Render-Phase Optimization: Deferred animation progress reads (transitionProgressState.value) strictly to Modifier.layout and Modifier.graphicsLayer, eliminating per-frame recompositions of the player tree and nested BoxWithConstraints subcompositions during pane transitions.
  • Embedded Side Panes:
    • EmbeddedLyricsPane: Side-by-side synced/static lyrics with Material 3 Expressive segmented toggle buttons, karaoke line highlighting, timing offset controls, full-screen expansion, and search/import/reset actions.
    • EmbeddedQueuePane: Side-by-side playback queue with active equalizer indicator, drag-to-reorder handles, source pill, and a floating bottom toolbar (shuffle, repeat, sleep timer, playback speed, and queue actions).
  • Multi-Window & Continuity: Configured android:resizeableActivity="true" and configChanges in AndroidManifest.xml so folding/unfolding preserves playback UI state without activity recreation.
  • Phone / Compact Mode Preserved: Standard portrait phones (< 600dp) remain 100% unchanged.

2. Vietnamese (vi) Localization Refinements

  • Refined Vietnamese string lengths and phrasing in values-vi/ (strings_chrome.xml, strings_screens.xml, strings_settings.xml) so headers, buttons, and dialogs fit cleanly across both compact and foldable layouts without truncation or overflow.

Screenshots

Real Hardware Test (Oppo Find N5 — Unfolded Inner Display)

Oppo Find N5 Two-Pane Synced Lyrics

Foldable UI Showcase

Home & Navigation Rail Immersive Full Player (Closed Pane)
Foldable Home and Rail Foldable Immersive Player
Two-Pane Synced Lyrics Two-Pane Playback Queue
Foldable Two-Pane Lyrics Foldable Two-Pane Queue

Compact / Outer Phone Screen (Unchanged)

Standard Portrait Player
Phone Portrait Player

Local checks

./gradlew :app:compileDebugKotlin
./gradlew :app:lintDebug
./gradlew :app:testDebugUnitTest

Result:

  • :app:compileDebugKotlin — PASSED
  • :app:lintDebug — PASSED
  • :app:testDebugUnitTest — PASSED (BUILD SUCCESSFUL)

Acknowledgments

Special thanks to DU60 (dusystem.net) for reporting the original foldable layout issues on the Oppo Find N5, dedicating time to real-hardware testing, and contributing valuable UI/UX feedback for foldable screens.

@greptile-apps

greptile-apps Bot commented Nov 8, 2026 •

Copy link
Copy Markdown

RetriggerView in GreptileConfidence Score: 5/5

[Medium impact] The PR appears safe to merge; the latest change fixes the remaining mini-player alignment finding.

Summary

The PR adds wide-screen player layouts, embedded lyrics and queue panes, and Vietnamese text refinements.

  • Wide windows use a navigation rail and layouts that make better use of the extra space.
  • The full player can place lyrics or the playback queue beside its controls on wide windows.
  • Lyrics views coordinate screen-awake requests so one view does not cancel another's request.
  • Vietnamese labels and messages use shorter wording in several screens.
  • Supporting artwork, folder navigation, and lyric helpers receive small UI and access updates.

Reviews (6) · Last reviewed commit: "Apply dynamic rail offset to mini-player..." · Reviewed by Greptile

@chiraitori chiraitori changed the title Add adaptive foldable two-pane UI and refine Vietnamese localization Add adaptive foldable two-pane UI with DU60 and refine Vietnamese localization Nov 8, 2026
@lostf1sh

lostf1sh commented Nov 8, 2026

Copy link
Copy Markdown
Collaborator

hello @chiraitori Thank you for this pull request.

Homescreen looks kinda off, other than that its looking good,
image
main reason we have these type of corners because we have navbar under that, maybe you can change the now playing make it extend to both sides of the screen, in a pill shape

@chiraitori

chiraitori commented Nov 8, 2026 •

Copy link
Copy Markdown
Contributor Author

Thanks for the feedback, @lostf1sh! That makes total sense regarding the nav now playing corners. I'll update that a bit then push a new commit shortly.

@chiraitori

Copy link
Copy Markdown
Contributor Author

@lostf1sh Updated in b7f06c7! The Now Playing mini-player on foldable/rail layouts now uses a symmetric pill shape (32.dp top and bottom corners) while keeping its compact centered width (and leaving standard phone portrait mode completely unchanged).

Foldable Compact Pill Now Playing

@greptile-apps

greptile-apps Bot commented Nov 8, 2026

Copy link
Copy Markdown

Want your agent to iterate on Greptile's feedback? Start a greploop in Claude Code and it will work through the open comments and keep going until this PR reviews clean.

@chiraitori

chiraitori commented Nov 8, 2026 •

Copy link
Copy Markdown
Contributor Author

I experimented with extending the mini-player to both sides, but the proportions felt a bit off on wide screens. Sticking with the compact width using a symmetric pill shape (32dp top and bottom corners) looks much cleaner and better balanced. Here's how it looks on the test screen on long pill one ( the code rn is small pill like the old comments):
Image

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.

2 participants