compose_edge_to_edge_preview

Simulating WindowInsets in Compose previews and tests — status/navigation bars, display cutouts; visual overlap highlighting, screenshot-friendly configurations, and device recording to capture real insets.

Suggest an edit
Android
JVM
iOS
macOS
Wasm
JS
GitHub stars61
Authorstimo-drick
Dependents0
LicenseThe Unlicense
Creation dateover 2 years ago
Last activityabout 1 month ago
Latest release0.10.1 (about 1 month ago)
GitHub repositoryWiki page

Jetpack Compose previews and testing for edge-to-edge design

Library which enables you to show WindowInsets in Jetpack Compose previews.

Note: AI agent optimization has been integrated. Integration-focused agent skills are now available under ai_skills/ (see ai_skills/README.md) for edge_to_edge_preview_lib, edge_to_edge_test_lib, and edge_to_edge_preview_check_lib.

New supported feature:

  • Compose Multiplatform
  • WindowInsetsRulers
  • Ime keyboard

Supported insets are the status bar, navigation bar and a camera display cutout. It also is able to show many different configurations of the system bars.

multiple_preview_sample.png

Edge-to-edge preview library

Library that you can use to simulate window insets like the status bar or navigation bar and much more.

Use cases:

  • Android Studio preview.
  • Screenshots
  • Testing with robolectric

Edge-to-edge preview overlap library

Highlight problems with window insets in your previews. preview_check_sample_overlap.png

Edge-to-edge testing library

Library which enables you to test if window insets overlapping with your content.

Use cases:

  • Device/Emulator tests
  • Robolectric tests

Recording insets from devices

Under development. Can be used to collect window inests of real devices.

Why is it good to have previews for WindowInsets?

I wrote an article about this here: https://medium.com/@timo_86166/jetpack-compose-previews-for-edge-to-edge-design-a03b3a3713f3

Android
JVM
iOS
macOS
Wasm
JS
GitHub stars61
Authorstimo-drick
Dependents0
LicenseThe Unlicense
Creation dateover 2 years ago
Last activityabout 1 month ago
Latest release0.10.1 (about 1 month ago)
GitHub repositoryWiki page

Jetpack Compose previews and testing for edge-to-edge design

Library which enables you to show WindowInsets in Jetpack Compose previews.

Note: AI agent optimization has been integrated. Integration-focused agent skills are now available under ai_skills/ (see ai_skills/README.md) for edge_to_edge_preview_lib, edge_to_edge_test_lib, and edge_to_edge_preview_check_lib.

New supported feature:

  • Compose Multiplatform
  • WindowInsetsRulers
  • Ime keyboard

Supported insets are the status bar, navigation bar and a camera display cutout. It also is able to show many different configurations of the system bars.

multiple_preview_sample.png

Edge-to-edge preview library

Library that you can use to simulate window insets like the status bar or navigation bar and much more.

Use cases:

  • Android Studio preview.
  • Screenshots
  • Testing with robolectric

Edge-to-edge preview overlap library

Highlight problems with window insets in your previews. preview_check_sample_overlap.png

Edge-to-edge testing library

Library which enables you to test if window insets overlapping with your content.

Use cases:

  • Device/Emulator tests
  • Robolectric tests

Recording insets from devices

Under development. Can be used to collect window inests of real devices.

Why is it good to have previews for WindowInsets?

I wrote an article about this here: https://medium.com/@timo_86166/jetpack-compose-previews-for-edge-to-edge-design-a03b3a3713f3