android-compose-ui

Android Compose UI Reference

A skill distilled from the official documentation on the UI foundation of Jetpack Compose (androidx.compose). Depending on the user's task, read the appropriate README.md and follow it to the individual files.

Directory structure

skills/android-compose-ui/
  SKILL.md
  references/
    fundamentals/
      README.md
      composable-functions.md
      recomposition.md
      modifier.md
      phases.md
      compositionlocalof.md
      staticcompositionlocalof.md
      compositionlocalprovider.md
      snapshotmutationpolicy.md
      movablecontentof.md
      custom-modifiers.md
      stability.md
    state-lifecycle/
      README.md
      remember.md
      remembersaveable.md
      mutablestateof.md
      mutablestatelistof.md
      mutablestatemapof.md
      mutablestatesetof.md
      mutablestate.md
      state.md
      derivedstateof.md
      snapshotflow.md
      producestate.md
      collectasstate.md
      rememberupdatedstate.md
      launchedeffect.md
      disposableeffect.md
      sideeffect.md
      remembercoroutinescope.md
      saver.md
      state-hoisting.md
      state-lifespans.md
    layout/
      README.md
      column.md
      row.md
      box.md
      spacer.md
      boxwithconstraints.md
      arrangement-alignment.md
      intrinsicsize.md
      modifier-layout.md
      lazycolumn.md
      lazyrow.md
      lazy-list-scope.md
      rememberlazyliststate.md
      lazyverticalgrid.md
      lazyhorizontalgrid.md
      lazyverticalstaggeredgrid.md
      pager.md
      flow-layout.md
      constraintlayout.md
      layout.md
      subcomposelayout.md
      scroll.md
      alignment-lines.md
      intrinsic-measurements.md
      visibility-tracking.md
      flexbox-grid.md
      styles.md
      media-query.md
    adaptive-layout/
      README.md
      window-size-class.md
      window-adaptive-info.md
      posture.md
      pane-scaffold-directive.md
      list-detail-pane-scaffold.md
      navigable-list-detail-pane-scaffold.md
      supporting-pane-scaffold.md
      navigable-supporting-pane-scaffold.md
      three-pane-scaffold-navigator.md
      back-navigation-behavior.md
      animated-pane.md
      pane-adapted-value.md
      navigation-suite-scaffold.md
      folding-feature.md
      window-info-tracker.md
      canonical-layouts.md
    text-input/
      README.md
      basictext.md
      basicmarquee.md
      basictextfield.md
      textfieldstate.md
      annotatedstring.md
      spanstyle.md
      paragraphstyle.md
      textstyle.md
      fontfamily.md
      textalign.md
      keyboardoptions.md
      visualtransformation.md
      selectioncontainer.md
      textmeasurer.md
      autofill.md
      clipboard.md
      emoji.md
    touch-input/
      README.md
      clickable.md
      combined-clickable.md
      pointer-input.md
      detect-tap-gestures.md
      detect-drag-gestures.md
      detect-transform-gestures.md
      draggable.md
      anchored-draggable.md
      scrollable.md
      nested-scroll.md
      transformable.md
      toggleable.md
      selectable.md
      interaction-source.md
      indication.md
      focusable.md
      keyboard-input.md
      hover.md
      semantics.md
      test-tag.md
      haptic-feedback.md
      drag-and-drop.md
      stylus-input.md

Exploration procedure

Look up the category from the task, and identify the target page in the category's README.md:

1. Find the category corresponding to the task in the mapping table below
2. For that category, references/{category}/README.md Refer to and identify the target page
3. Read the .md of the relevant page to check the details

Task → Category Mapping

Task	Category	Reference README
@Composable Want to know about function design and the mechanics of recomposition	fundamentals	references/fundamentals/README.md
Modifier Want to check chain behavior and order	fundamentals	references/fundamentals/README.md
CompositionLocal Want to propagate a value within a scope using	fundamentals	references/fundamentals/README.md
remember / mutableStateOf Want to hold state with	state-lifecycle	references/state-lifecycle/README.md
LaunchedEffect / DisposableEffect / SideEffect Want to handle side effects with	state-lifecycle	references/state-lifecycle/README.md
Flow / StateFlow を Compose の State Want to convert to (collectAsState / produceState / snapshotFlow）	state-lifecycle	references/state-lifecycle/README.md
Column / Row / Box Want to arrange child elements with	layout	references/layout/README.md
LazyColumn / LazyRow / LazyVerticalGrid Want to scroll-display a large amount of data with	layout	references/layout/README.md
HorizontalPager / FlowRow / ConstraintLayout / Custom Layout Want to use	layout	references/layout/README.md
Style / StyleScope Want to define CSS-like state-based styles with,mediaQuery Want to switch the UI according to environmental signals with	layout	references/layout/README.md
WindowSizeClass Want to switch layouts according to screen width with	adaptive-layout	references/adaptive-layout/README.md
ListDetailPaneScaffold / SupportingPaneScaffold Want to create a multi-pane UI with	adaptive-layout	references/adaptive-layout/README.md
For foldable devices, FoldingFeature / Posture want to support	adaptive-layout	references/adaptive-layout/README.md
BasicText / BasicTextField Want to implement text display and input with	text-input	references/text-input/README.md
AnnotatedString / SpanStyle / TextStyle Want to decorate rich text with	text-input	references/text-input/README.md
KeyboardOptions Want to control / IME actions and input conversion	text-input	references/text-input/README.md
Modifier.clickable / combinedClickable Want to handle taps with	touch-input	references/touch-input/README.md
detectDragGestures / draggable / transformable Want to handle gestures with	touch-input	references/touch-input/README.md
Modifier.focusable / semantics / testTag Want to handle focus, accessibility, and testing with	touch-input	references/touch-input/README.md
Want to use Material3 components (Button/Card/TextField, etc.)	-	Handled by the android-compose-components skill
Want to handle animation and drawing	-	Handled by the android-compose-graphics-animation skill