Acasă Explorează Ajutor
Autentificare
bajdev
/
mpckit
1
0
Bifurcare 0
Fisiere Trageți solicitările 0
Arbore: v0.5.1
Ramuri Etichete
mpckit
/
pull-requests
/
fit-window
/
fit-the-window-to-the-display.md

fit-the-window-to-the-display.md 2.0 KB
Permalink Istoric Crud

Fit the window to the display

Branch: fit-window → main

What changed

On bajdev's laptop (1920×1080 at about 150% scaling, so about 1280×690 in window units) the 1280×860 window was taller than the screen. It was clamped and the page scrolled. Also, the square pad cells made the grid grow with the window's width.

  • Window size (main.go): the window starts hidden. When the app has started, it is sized to 16:9 at 90% of the primary screen's work area, at most 1280×720, then centred and shown. The minimum size is 960×540 (also 16:9). On a 1280×688 work area that gives 1100×619. fitSize is unit-tested for 100%, 125% and 150% scaling and for small screens.
  • Layout:
    • The page is exactly the window's height and never scrolls. The header, tabs and footer keep their height, and the two panels take the rest.
    • The pad and sequence grids fill the panel height in four equal rows, instead of square cells sized by width. Long names are cut with an ellipsis.
    • The title row and the project-name row are now one bar: mpckit, project name, the four buttons, About. This is a change from the mockup, to save about 70px of height.
    • Buttons, inputs and tabs are 40px high (were 44–48). The bank buttons are 36px and the tuning sliders 28px. Semitones and Cents sit side by side.
    • Below 1100px wide the visible "Project name" label is hidden; screen readers still get it. Below 600px tall the hint under each grid is hidden.
    • The settings panel scrolls on its own if a window is shorter than the layout needs. It shouldn't at the default size.

Testing

go test ./... passes, including the new fitSize test. main.go vets for Windows. The frontend still can't be built on the server (no Node). Please check on the laptop:

  1. wails3 dev: the window opens centred at about 1100×620 with no scrollbar, on both tabs.
  2. Make the window as small as it goes (960×540): still no page scrollbar, and the grid shows all 16 cells.
  3. Maximise: the layout fills the screen without a scrollbar.
  4. npm run check in frontend reports no errors.