Skip to content

Fix landscape photo orientation and aspect ratio mismatch (v1.1.2) - #4

Open
tmisker wants to merge 1 commit into
mrgroen:mainfrom
tmisker:main
Open

tmisker wants to merge 1 commit into
mrgroen:mainfrom
tmisker:main

Conversation

@tmisker

@tmisker tmisker commented Sep 15, 2026

Copy link
Copy Markdown
Contributor

Problem

When the tablet was held in landscape, the camera produced portrait-oriented photos, and the captured photo showed more content than what was visible in the preview.

Root cause: SCREEN_WIDTH / SCREEN_HEIGHT in Constants.ts were static module-level values that never updated on rotation. In landscape this made screenAspectRatio smaller than 1 (portrait), which does not match any landscape camera sensor format, so useCameraFormat picked a mismatching format.

Changes

  • Use useWindowDimensions() in CameraPage so the dimensions are reactive and update on rotation
  • Calculate screenAspectRatio as max / min so it is always >= 1, matching camera sensor formats (4:3 = 1.33, 16:9 = 1.77)
  • ESLint fixes: == -> ===, merge duplicate imports in useIsForeground.ts and usePreferredCameraDevice.ts
  • .eslintrc.js: exclude the jest plugin, which is incompatible with Node 22 / ESLint 8 in this setup
  • Bump version to 1.1.2

Built and used with Mendix 10.24 / native template 14.1.

A follow-up PR will remove the dependency on react-native-vector-icons, which is no longer part of the Mendix native template since version 19 (Studio Pro 11.10 and up) and currently breaks the bundling step there.

🤖 Generated with Claude Code

The camera was producing portrait-oriented photos when the tablet was held
landscape, and the captured photo showed more content than what was visible
in the preview. Root cause: SCREEN_WIDTH/SCREEN_HEIGHT were static module-level
values that did not update on rotation, causing screenAspectRatio to be < 1
(portrait) — which doesn't match any landscape camera sensor format.

- Use useWindowDimensions() for reactive dimensions that update on rotation
- Calculate screenAspectRatio as max/min to always be >= 1, matching camera
  sensor formats (e.g. 4:3 = 1.33, 16:9 = 1.77)
- Fix ESLint errors: == → ===, merge duplicate imports in useIsForeground.ts
  and usePreferredCameraDevice.ts
- Fix .eslintrc.js: exclude jest plugin (incompatible with Node 22 / ESLint 8)
- Bump version to 1.1.2

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
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.

1 participant