HeadlinesBriefing favicon HeadlinesBriefing.com

Compose Accessibility: Beyond Font Scaling

DEV Community •
×

Mobile developers face accessibility challenges when implementing bottom navigation bars with fixed text labels. Eeva Jönkkänen encountered this while working with Jetpack Compose, where large font sizes made bar items unreadable. Standard font scaling wasn't the only solution.

iOS offers a 'large content viewer' that displays enlarged previews of non-scaling elements when accessibility settings are enabled. Jönkkänen recreated this behavior in Compose, building an item previewer that activates during long-press interactions. The solution maintains WCAG compliance while addressing fixed-size text limitations.

The implementation uses InteractionSource to detect long presses on navigation items, displaying a centered preview overlay. This approach only triggers when font scaling exceeds 100%, ensuring it doesn't interfere with standard usage. However, the feature currently supports only pointer-based interaction, limiting its accessibility scope.

Future improvements will address assistive technology compatibility. Developers can access the full code via GitHub Gist. This technique provides a practical workaround for teams struggling with accessibility requirements in fixed-layout components, particularly on Android devices with accessibility settings enabled.