Advanced layouts in Compose

See how to build complex designs for your Compose layouts, focusing on layout phase and constraints, subcompose layouts, and intrinsic measurements.

Key points

  • The layout phase is the phase of Compose where element sizing and positioning is defined.
  • During the layout phase, each element in the UI tree measures its children, enabling the parent to decide its own size and placing the children in the available 2D space.
  • To build a custom layout, call the Layout composable, which accepts the composable content as its children.
  • Subcomposition enables lazy components to add content on demand while scrolling.
  • Subcomposed layouts can have an impact on performance. Use this approach when at least one child's composition depends on the result of another child's measurement.
  • Intrinsic measurements let you query children before they're measured.

Parent collections

Lists and grids allow your app to display collections in a visually pleasing form that's easy for users to consume.

Have questions or feedback

Go to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts.