Getting started with Jetpack Compose

Practical guide on how to use Jetpack Compose to create advanced UI

Jetpack compose is a modern toolkit to build advanced UI with ease and high optimisation. Understand it as a UI hierarchy created by calling a simple function a number of times with varied or similar arguments to create a new UI component rather than using the traditional android hierarchy .

Step-1 :Installing Android Canary Build Arctic Fox (2020.3.1)Canary 4

Download the latest Android release Android Canary Build Arctic Fox Canary 4 from here .Android Canary Build will help us with some smart editor features, such as New Project templates and the ability to immediately preview your Compose UI. Now, extract files into Program Files directory , scroll down the files and make a shortcut for studio64 (ide). After doing so , setup the ide studio64 with default/custom settings and you are good to go !

Step-2 :Creating new project using Compose

After installing and setting up the environment, next stop is to create a project with Compose.

1. Through the Welcome to Android Studio window, click Start a New Android Studio project or if you are already in the environment , click File> New> New Project through menu bar.
2. In Select a Project Template choose Empty Compose Activity and click next.
3. Name the project and set Language as Kotlin.
4. Set Minimum API level 21 or higher through dropdown menu.
5. Click Finish.

Step-3 : Configure project’s build.gradle(module:app) file.

You have to make sure the existing/recent project is configured with settings and dependencies required for Jetpack compose.

1. Make sure the project uses Kotlin 1.4.21 or newer.
2. Make sure the project has minimum API 21 or higher.
3. Add jetpack toolkit dependencies.

After successfully configuring the build.gradle file , you are all set to create your first android application with Jetpack Compose !