Creating Screens Using a Declarative UI and Exploring Compose Principles
Mobile applications require a User Interface (UI) for user interactions. For instance, the old way of creating the UI was imperative in Android. This meant having a separate prototype of the application’s UI using unique Extensible Markup Language (XML) layouts and not the same language used to build your logic.
However, with Modern Android Development, there is a push to stop using imperative programming and start using a declarative way of making the UI, which means developers design the UI based on the data received. This design paradigm uses one programming language to create an entire application.
It is fair to acknowledge it may seem difficult for new developers to decide what to learn when building a UI: the old way of creating views or opting for the new Jetpack Compose. However, suppose you’ve built an Android application before the Jetpack Compose era.
In such a case, you may already know using XML is a bit tedious, especially if your code base is complex. However, utilizing Jetpack Compose as your first choice makes work easier. In addition, it simplifies UI development by ensuring developers use less code, as they take advantage of the intuitive Kotlin APIs. Hence, there is a logical push by new developers when creating views to use Jetpack Compose instead of XML.
However, knowing both can be beneficial since many applications still use XML layouts, and you might have to maintain the view but build new ones using Jetpack Compose. In this chapter, we will look at Jetpack Compose basics by trying to implement small examples using columns, rows, boxes, lazy columns, and more.
In this chapter, we’ll be covering the following recipes:
- Implementing Android views in Jetpack Compose
- Implementing a scrollable list in Jetpack Compose
- Implementing your first tab layout with a view pager using Jetpack Compose
- Implementing animations in Compose
- Implementing accessibility in Jetpack Compose
- Implementing declarative graphics using Jetpack Compose
