Canvas in Android, which is something I always hesitant to try because it requires several boilerplate codes to be setup and that made it very difficult to understand. However, when I started using the Jetpack Compose, I realised designing a screen has become a lot easier than ever. This motivated me further to revisit Canvas again. This time it changed my idea about Canvas. If you are also like me who hesitated to work on Canvas before, then let me convince you to try it again with three simple examples.

What we will be creating from this article?


Jetpack Compose — Getting Started

Requirements

Declarative UI has become a trend in mobile application development like React Native, Flutter, and SwiftUI. In the same way, now Android has bought the Composable UI in the form of Jetpack compose.

Let’s dive in and see how we can write a Composable UI.

  1. Add the below configuration in your app build.gradle
android {kotlinOptions {
jvmTarget = '1.8'
useIR = true
}
buildFeatures {
compose true
}
composeOptions {
kotlinCompilerExtensionVersion '1.0.0-beta01'
kotlinCompilerVersion '1.4.30'
}
}

2. Add the below dependencies

implementation “androidx.compose.ui:ui:1.0.0-beta01”
implementation “androidx.compose.material:material:1.0.0-beta01”
implementation “androidx.ui:ui-tooling:1.0.0-beta01”

Jeffrey Rajan

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store