Jetpack Compose how does SubcomposeLayout work?

by

It’s supposed to re-measure a component based on another component size…

SubcomposeLayout doesn’t remeasure. It allows deferring the composition and measure of content until its constraints from its parent are known and some its content can be measured, the results from which and can be passed as a parameter to the deferred content. The above example calculates the maximum size of the content generated by mainContent and passes it as a parameter to deferredContent. It then measures deferredContent and places both mainContent and deferredContent on top of each other.

The simplest example of how to use SubcomposeLayout is BoxWithConstraints that just passes the constraints it receives from its parent directly to its content. The constraints of the box are not known until the siblings of the box have been measured by the parent which occurs during layout so the composition of content is deferred until layout.

Similarly, for the example above, the maxSize of mainContent is not known until layout so deferredContent is called in layout once maxSize is calculated. It always places deferredContent on top of mainContent so it is assumed that deferredContent uses maxSize in some way to avoid obscuring the content generated by mainContent. Probably not the best design for a composable but the composable was intended to be illustrative not useful itself.

Note that subcompose can be called multiple times in the layout block. This is, for example, what happens in LazyRow. The slotId allows SubcomposeLayout to track and manage the compositions created by calling subcompose. For example, if you are generating the content from an array you might want use the index of the array as its slotId allowing SubcomposeLayout to determine which subcompose generated last time should be used to during recomposition. Also, if a slotid is not used any more, SubcomposeLayout will dispose its corresponding composition.

As for where the slotId goes, that is up to the caller of SubcomposeLayout. If the content needs it, pass it as a parameter. The above example doesn’t need it as the slotId is always the same for deferredContent so it doesn’t need to go anywhere.

More Related Contents:

  1. Jetpack Compose – Order of Modifiers
  2. Why a new ViewModel is created in each Compose Navigation route?
  3. Why the view keeps flashing when using jetpack navigation with Compose?
  4. How are Android activities handled with Jetpack Compose and Compose Navigation?
  5. How to get activity in compose
  6. Jetpack Compose collapsing toolbar
  7. Jetpack Compose Smart Recomposition
  8. How can I get onTouchEvent in Jetpack Compose?
  9. Android Jetpack Compose width / height / size modifier vs requiredWidth / requiredHeight / requiredSize
  10. Is there a way to increase a Composable size by chaining with another Modifier?
  11. How to get exact size without recomposition?
  12. Content padding parameter it is not used
  13. Scoping States in Jetpack Compose
  14. What is the equivalent of [NestedScrollView + RecyclerView] or [Nested RecyclerView (Recycler inside another recycler) in Jetpack compose
  15. How to get preview in composable functions that depend on a view model?
  16. AppCompatActivity instead of ComponentActivity in Jetpack compose
  17. Jetpack Compose lazy column all items recomposes when a single item update
  18. Error when adding buildFeatures in build.gradle file
  19. ViewTreeLifecycleOwner not found from DecorView@2da7146[MyActivity]
  20. Passing URL as a parameter to Jetpack Compose Navigation
  21. How to achieve a staggered grid layout using Jetpack compose?
  22. How to disable and enable scrolling in LazyColumn/LazyRow in Jetpack Compose?
  23. How to show animate an item view in LazyColumn on Jetpack Compose Android
  24. fillMaxSize modifier not working when combined with VerticalScroll in Jetpack Compose
  25. How to pass id and application to a viewModel/viewModelFactory in Jetpack Compose?
  26. Jetpack Compose Navigation loads screen infinitely
  27. Exposed drop-down menu for jetpack compose
  28. When should I use Android Jetpack Compose Surface composable?
  29. Show custom alert dialog in Jetpack Compose
  30. What does Jetpack Compose remember actually do, how does it work under the hood?

Leave a Comment