Open in app
Home
Notifications
Lists
Stories

Write
Francesc Vilarino Guell
Francesc Vilarino Guell

Home
About

Jun 6

Using Activity Result Contracts in Jetpack Compose

In this short story we will write a simple app that will showcase how to use the Activity Result Contracts in Jetpack Compose. Our app will have 2 buttons, one to pick an image from the gallery, and a second one to take a picture. In both cases, once the…

Android

6 min read

Using Activity Result Contracts in Jetpack Compose
Using Activity Result Contracts in Jetpack Compose

Apr 11

Creating an animated selector in Jetpack Compose

In today’s story we will learn how to create a custom selector that lets users choose one option among several, with a background that animates to highlight the selected option. As usual, seeing an animation of what we want to achieve will make this clearer: Let’s list what we want…

Android

11 min read

Creating an animated selector in Jetpack Compose
Creating an animated selector in Jetpack Compose

Apr 2

Creating a sticky letter list in Jetpack Compose

In today’s story we will learn how to enhance Jetpack Compose’s LazyColumn to display a sticky initial on the right side of the list. When we talk about sticky elements we usually think of sticky headers, a list item that sticks to the top of the list until a new…

Android

7 min read

Creating a sticky letter list in Jetpack Compose
Creating a sticky letter list in Jetpack Compose

Feb 26

Custom Progress Indicator in Jetpack Compose

In this short story we will learn how to create a custom progress indicator using the Layout composable and the animation tools provided by Jetpack Compose. The final result we are after is shown here: The basic component, the Dot We’ll start by defining a composable that represents our basic unit, the Dot. There are…

Jetpack Compose

8 min read

Custom Progress Indicator in Jetpack Compose
Custom Progress Indicator in Jetpack Compose

Feb 19

Conditional Navigation in Jetpack Compose

In today’s story we will learn how to conditionally navigate to a screen in Jetpack Compose. …

Jetpack Compose

7 min read


Feb 10

Exploring Jetpack Compose LazyList animations

With the release of Jetpack Compose 1.2.0-alpha03 we have access to a much requested feature: animations in lazy lists when the collection of items is updated. In this short article we’ll learn how to use this feature. The sample project First we’ll create a simple sample project using LazyColumn without the items animation…

Android

4 min read

Exploring Jetpack Compose LazyList animations
Exploring Jetpack Compose LazyList animations

Jan 5

Passing arguments to screens in Jetpack Compose

In anything but a trivial app we want to have the business logic of our screens separate from the UI (our Composable functions), and one way to do that is using the ViewModel classes available from the AndroidX libraries to host that business logic. …

Android

4 min read


Dec 30, 2021

Creating a Loading Button in Jetpack Compose

In this tutorial we will implement a loading button, i.e., a button that replaces its content with a loading indicator to signify to the user that some operation is under way, and when that operation has completed, reverts to its original state. This GIF shows what we want to achieve: …

Jetpack Compose

9 min read

Creating a Loading Button in Jetpack Compose
Creating a Loading Button in Jetpack Compose

Nov 6, 2021

Creating a dynamic grid in Jetpack Compose

Introduction I’ve come across another interesting question in StackOverflow, the question asks how could we create a Grid composable that lets its children set individual column and row spans so that the composable fills the whole space allocated to it, and places its children given their column/row spans. …

Android

6 min read

Creating a dynamic grid in Jetpack Compose
Creating a dynamic grid in Jetpack Compose

Oct 2, 2021

Creating a rotating card in Jetpack Compose

Introduction In this short article we’ll learn how to create a Composable card that rotates (or flips) on its axis, to show content on its back. The final result we are looking for is shown in this animation: Defining our Composable signature We’ll start by defining our Composable signature. These are the parameters we want…

Android

6 min read

Creating a rotating card in Jetpack Compose
Creating a rotating card in Jetpack Compose
Francesc Vilarino Guell

Francesc Vilarino Guell

Senior Android Developer

Following
  • Chet Haase

    Chet Haase

  • Chris Banes

    Chris Banes

  • Sean McQuillan

    Sean McQuillan

Help

Status

Writers

Blog

Careers

Privacy

Terms

About

Knowable