compose-focus-navigation

Fix focus timing, restoration, and directional navigation in Jetpack Compose interfaces.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/soygabimoreno/Los-ANDROIDES --skill compose-focus-navigation
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: compose-focus-navigation
Source: https://github.com/soygabimoreno/Los-ANDROIDES/tree/main/.agents/skills/compose-focus-navigation
Command: npx skills add https://github.com/soygabimoreno/Los-ANDROIDES --skill compose-focus-navigation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you build Jetpack Compose screens where keyboard, TV remote, or D-pad navigation consistently selects the right UI element and preserves or restores focus correctly.

Core Features & Use Cases

  • Deterministic initial and restored focus using FocusRequester and effects so focus happens after composition and survives refreshes.
  • Directional navigation tuning with focusProperties to correct broken spatial navigation without over-constraining the focus graph.
  • Safe key handling and focus testing using key event handlers that only consume handled keys, plus compose UI tests that assert focused semantics.

Quick Start

Use FocusRequester with LaunchedEffect to request initial focus after the UI and target item are actually composed, then verify directional navigation and focused item ownership with key-input-based Compose tests.

Frequently Asked Questions about compose-focus-navigation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set deterministic initial focus in Jetpack Compose for TV interfaces?

To set deterministic initial focus in Jetpack Compose, use FocusRequester with LaunchedEffect to request focus after the UI and target item are actually composed, ensuring focus happens after composition and survives refreshes.

Why does directional D-pad navigation break in Compose lazy lists or grids?

Directional D-pad navigation in Compose breaks when the spatial focus graph is over-constrained or misconfigured. You can correct broken spatial navigation by applying focusProperties overrides without over-constraining the focus graph.

Can I test keyboard and remote control focus behavior using Compose UI testing?

Yes, you can test focus behavior using Compose UI testing. Implement key event handlers that only consume handled keys, then write compose UI tests that assert focused semantics to verify directional navigation and focused item ownership.

What is the best way to restore focus to a specific item after a Compose screen refresh?

The best way to restore focus in Jetpack Compose is through stable identity tracking for restoration combined with FocusRequester and effects. This ensures focus targets move correctly and preserves focus state across recomposition.

How do I handle modal focus-trap scenarios in Jetpack Compose dialogs?

To handle modal focus-trap scenarios in Jetpack Compose dialogs, use careful onFocusChanged and key-handler consumption alongside FocusRequester. This ensures focus targets move correctly based on user input and remain trapped within the modal boundary.