Jetpack Compose layouts
Jetpack Compose has a variety of pre-built layouts for us to use. Before looking at the different layouts present, let us first understand how Jetpack Compose transforms state into UI.
Figure 3.4 – How Compose transforms state into UI
From the preceding diagram, we can see that our state is transformed into a UI in the following steps:
- Composition
This is the initial phase. The Compose compiler creates a tree of UI elements. Each element is a function that represents a UI element. Compose then calls the functions to create the UI tree. The composition step is responsible for determining which composables need updates and which ones can be reused. This happens by comparing a previous tree of composables with the new tree and only updating the ones that have changed. This makes this step very efficient as only elements with updates are updated.
- Layout
This step happens after the composition phase. Here, the Compose...
