Skip to content

fix: implement landscape mode UI#11

Open
sxivansx wants to merge 4 commits intomainfrom
fix/landscape-ui
Open

fix: implement landscape mode UI#11
sxivansx wants to merge 4 commits intomainfrom
fix/landscape-ui

Conversation

@sxivansx
Copy link
Copy Markdown
Collaborator

@sxivansx sxivansx commented Apr 4, 2026

Closes #3

Summary

  • Reverts the temporary android:screenOrientation="portrait" manifest lock added in commit d1d19c8
  • Adds a proper landscape layout — no portrait behaviour is changed
  • Fixes a pre-existing 6 dp overflow on the portrait wide "0" button row

What changes

AndroidManifest.xml

Removes screenOrientation="portrait" from MainActivity.

CalculatorScreen.kt

  • Detects orientation via LocalConfiguration.current.orientation
  • Extracts a private CalculatorDisplay composable shared by both orientations
  • LandscapeColumn: compact two-line display (expression + value, fixed height so keyboard never shifts) at top-right, then full-width keypad with weight(1f)
  • PortraitColumn: identical layout to before (weight(1f) display, keypad below)

CalculatorKeypad.kt

Refactored into two private layout functions:

LandscapeKeypadLayout — 5 columns × 4 rows of pill-shaped buttons:

Row 1: [ 7 ][ 8 ][ 9 ][ ⌫ ][ ÷ ]
Row 2: [ 4 ][ 5 ][ 6 ][AC ][ × ]
Row 3: [ 1 ][ 2 ][ 3 ][ % ][ − ]
Row 4: [+/−][ 0 ][ . ][ = ][ + ]

BoxWithConstraints measures real available space; btnWidth and btnHeight are derived so all 4 rows fill the screen exactly on every device. wires up the existing onBackspace callback that was previously unused.

PortraitKeypadLayout — visually unchanged 4 × 5 circular layout. WideCalcButton width changed from fillMaxWidth(0.5f) (which overflowed by 0.5 × spacing) to the mathematically exact buttonSize × 2 + spacing.

Test plan

  • Portrait: circular buttons, wide 0, expression / display behaviour intact
  • Landscape: 5 × 4 pill grid, all 4 rows fully visible, display shows expression when active, keyboard does not shift
  • Rotation: smooth transition, no layout jump
  • Long values / expressions: ellipsis truncation, no clipping

sxivansx added 2 commits April 4, 2026 18:31
- Remove temporary android:screenOrientation="portrait" lock from manifest
- Add orientation detection in CalculatorScreen using LocalConfiguration
- Landscape layout: Column with compact 2-line display (expression + value)
  at top-right and full-width keypad below; display height is fixed so the
  keyboard never shifts when expression appears or disappears
- Landscape keypad: 5-column × 4-row grid of pill-shaped (stadium) buttons
  sized via BoxWithConstraints to fill available height/width exactly;
  button arrangement mirrors the reference design:
    Row 1: 7  8  9  ⌫  ÷
    Row 2: 4  5  6  AC ×
    Row 3: 1  2  3  %  −
    Row 4: +/− 0  .  =  +
- Portrait layout unchanged; refactored into PortraitKeypadLayout with
  clean BoxWithConstraints sizing and fixed WideCalcButton width formula
  (buttonSize×2 + spacing) that eliminates the previous 6dp row overflow
- CalculatorDisplay extracted as private composable shared by both orientations
@sxivansx sxivansx mentioned this pull request Apr 4, 2026
4 tasks
Comment thread app/src/main/java/org/prauga/pvotcalculator/CalculatorKeypad.kt Outdated
// ─────────────────────────────────────────────────────────────────────────────
// Portrait layout — 4 columns × 5 rows of circular buttons (original design)
//
// Row 1: AC +/− % ÷
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove this as well

Comment thread app/src/main/java/org/prauga/pvotcalculator/CalculatorScreen.kt Outdated
@sxivansx
Copy link
Copy Markdown
Collaborator Author

@danascape i have removed the comments

@danascape
Copy link
Copy Markdown
Member

@sxivansx squash the last 2 commits to base landscape fix, keeping CLAUDE.md separate

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.

bug: Landscape mode UI is broken

2 participants