Jetpack Compose Components (Part 1)

Composable functions, Text, Typography, Row, Column, input texts, and buttons

Photo by the author.

This is the first part in a series of articles that will explore Jetpack Compose components. This series’s main goal is to get to know the standard building blocks of the Jetpack Compose UI, starting from the basics and moving to more advanced material.

So buckle up! There’s a long road ahead.

Introduction

Before starting to learn about Jetpack Compose, it’s important to know its origins. It’s a part of the Jetpack libraries. What is Jetpack? I think that’s the right place to start learning Jetpack Compose.

What is Jetpack?

Android Jetpack is a set of Android software libraries and architectural components aimed to help us build scalable apps with top-notch performance and minimal implementation.

Some of the most popular and useful libraries from the Jetpack family are WorkManager, Pagging3, Room, Navigation, CameraX, Viewbinding, and more. There are a few interesting libraries in alpha and beta state, such as DataStore, Hilt, and AppStartup.

Jetpack Compose stands out from other libraries in the Jetpack suite. It has gotten all the hype from Android developers around the world since the dev versions. One of the potential reasons behind its success is how it transforms the way we build UI compared to how we did so over the past decade. Now, let’s see what Jetpack Compose is.

What is Jetpack Compose?

Jetpack Compose is one of the recent attempts from Google to make it easy for Android developers to build UI. Recently, Google moved Jetpack Compose from the dev to alpha stage. Even though it’s still in the early stages, I saw tremendous potential to build advanced UI and animations in a way that I’ve never done in the Android platform.

“Jetpack Compose is a modern toolkit for building native Android UI. Jetpack Compose simplifies and accelerates UI development on Android with less code, powerful tools, and intuitive Kotlin APIs.” — Android Developers