A.
Appendix A: ViewGroups / Widgets to Jetpack Compose Cheatsheet
Written by Prateek Prasad
Heads up... You're reading this book for free, with parts of this chapter shown beyond this point as text.
Since Jetpack Compose is still relatively new, you will find yourself working in hybrid codebases for a while, comprising older features built-in XML and newer ones adopting compose.
This is a reasonably standard adoption pattern for any new technology. With this in mind, before concluding the book, here’s a handy cheatsheet you can use to find the Jetpack Compose equivalent for the most common Android Views on Android.
This guide should be a quick reference whenever you build a new UI in composing or converting an existing screen to Compose.
ViewGroup and Their Equivalents
-
LinearLayout- To stack items linearly in compose, you can use aRowfor laying out items horizontally or aColumnfor laying out items vertically. -
FrameLayout- To stack items on top of one another, use aBoxcomposable. -
RelativeLayout- Relative layout lets you lay items out relative to one another. While there is no direct equivalent for a RelativeLayout in compose, you can use a combination ofRow,ColumnandBoxwith thealignmodifiers to achieve the same result. -
ConstraintLayout- To lay out items relative to one another based on constraints, Jetpack Compose offers a similarly named composable,ConstraintLayout.
Composables for Building Lists
An everyday use case in any app is to present data as a list. In the XML world, you would use a RecyclerView for the job but compose offers a few variations based on the orientation and arrangement.
Common View Use Cases and Their Compose Equivalents
Here’s a quick rundown of the most common views, their most common use cases in XML, and their Jetpack Compose equivalents.