A light weight Compose Animation library to choreograph low level Animation API through Kotlin DSL.

Overview

Koreography

Choreograph your Compose Animation ๐Ÿ’ƒ ๐Ÿ•บ

Maven Central

Github Followers Twitter Follow


A lightweight Compose Animation utility library to choreograph low-level Animation API (https://developer.android.com/jetpack/compose/animation#animation) through Kotlin DSL. It does the heavy lifting of dealing with coroutines under the hood so that you can focus on your animation choreography.

Including in your project

Koreography is available on mavenCentral()

implementation 'io.github.sagar-viradiya:koreography:0.1.0'

Usage

Creating koreography is the process of recording moves that can be either parallel or sequential. You can declare complex choreography through clean and concise Kotlin DSL.

Choreographying sequential animation

val koreography = rememberKoreography {
    move(
        initialValue = 0f,
        targetValue = 1f,
        animationSpec = tween(500)
    ) { value, velocity ->
        // Update the state value used for animation here
    }
    
    move(
        initialValue = 0f,
        targetValue = 2f,
        animationSpec = tween(500)
    ) { value, velocity ->
        // Update the state value used for animation here
    }
}

The move call is identical to animate suspend function of compose except it is not suspend function since, creating koregraphy is just a process of recording moves

Choreographying parallel animation

val koreography = rememberKoreography {
    parallelMoves {
        move(
            initialValue = 0f,
            targetValue = 1f,
            animationSpec = tween(500)
        ) { value, velocity ->
            // Update the state value used for animation here
        }
        
        move(
            initialValue = 0f,
            targetValue = 2f,
            animationSpec = tween(500)
        ) { value, velocity ->
            // Update the state value used for animation here
        }
    }
}

Complex choreography

You can have a nested hierarchy of moves to create complex choreography. The example below has three animations running parallelly and out of them, the last one has two animations within running sequentially.

val koreography = rememberKoreography {
    parallelMoves {
        move(
            initialValue = 0f,
            targetValue = 1f,
            animationSpec = tween(500)
        ) { value, velocity ->
            // Update the state value used for animation here
        }
        
        move(
            initialValue = 0f,
            targetValue = 2f,
            animationSpec = tween(500)
        ) { value, velocity ->
            // Update the state value used for animation here
        }
        
        sequentialMoves {
            move(
                initialValue = 0f,
                targetValue = 1f,
                animationSpec = tween(500)
            ) { value, velocity ->
                // Update the state value used for animation here
            }
            
            move(
                initialValue = 0f,
                targetValue = 2f,
                animationSpec = tween(500)
            ) { value, velocity ->
                // Update the state value used for animation here
            }
        }
    }
}

Once Koreography is ready it's time to dance! ๐Ÿ’ƒ ๐Ÿ•บ

// Composable scope
koreography.dance(rememberCoroutineScope())

Please note the rememberCoroutineScope() passed as a scope. Make sure you pass coroutine scope which will get cleared once you exit composition.

Example 1

The following example consists of two animations running sequentially having two parallel animations (Scale + Fade) within each. The first animation fades in alpha value and scales up the image. The second fade out and scale the image.

screen-20220916-005525_2.mp4
// Composable scope

var alpha by remember { mutableStateOf(0f) }
var scale by remember { mutableStateOf(0f) }

val koreography = rememberKoreography {
    parallelMoves {
        move(
            initialValue = 0f,
            targetValue = 1f,
            animationSpec = tween(500)
        ) { value, _ ->
            alpha = value
        }
        
        move(
            initialValue = 0f,
            targetValue = 2f,
            animationSpec = tween(500)
        ) { value, _ ->
            scale = value
        }
    }
    
    parallelMoves {
        move(
            initialValue = 1f,
            targetValue = 0f,
            animationSpec = tween(500)
        ) { value, _ ->
            alpha = value
        }
        
        move(
            initialValue = 2f,
            targetValue = 4f,
            animationSpec = tween(500)
        ) { value, _ ->
            scale = value
        }
    }
}

koreography.dance(rememberCoroutineScope())

Example 2

The following animation consists of two animations running sequentially. Each has three animations running parallelly (Scale + Rotate + Fade)

screen-20220916-013120_2.mp4

The code for choreographing above animation is there in the sample app.

Contribution

This is the early preview and unfortunately it is not ready to accept any contribution yet. Once this is stable enough contribution guidelines will be updated here. Meanwhile feel free to start GitHub Discussions for feature request and improvements.

License

Copyright 2022 Koreography Contributors

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
You might also like...
Android + Kotlin + Github Actions + ktlint + Detekt + Gradle Kotlin DSL + buildSrc = โค๏ธ

kotlin-android-template ๐Ÿค– A simple Github template that lets you create an Android/Kotlin project and be up and running in a few seconds. This templa

Extension functions over Android's callback-based APIs which allows writing them in a sequential way within coroutines or observe multiple callbacks through kotlin flow.

callback-ktx A lightweight Android library that wraps Android's callback-based APIs into suspending extension functions which allow writing them in a

{ } Declarative Kotlin DSL for choreographing Android transitions
{ } Declarative Kotlin DSL for choreographing Android transitions

Transition X Kotlin DSL for choreographing Android Transitions TransitionManager makes it easy to animate simple changes to layout without needing to

Kotlin Dsl for Android RecyclerView

KRecyclerDsl Kotlin Dsl for Android RecyclerView Exemple Sample project recyclerView.adapter = dataClassAdapterMyView, MyDataClass(R.layout.my_view,

Nice and simple DSL for Espresso in Kotlin
Nice and simple DSL for Espresso in Kotlin

Kakao Nice and simple DSL for Espresso in Kotlin Introduction At Agoda, we have more than 1000 automated tests to ensure our application's quality and

DSL for constructing the drawables in Kotlin instead of in XML

Android Drawable Kotlin DSL DSL for constructing the drawables in Kotlin instead of in XML Examples Shape drawables ?xml version="1.0" encoding="utf-

Code generation of Kotlin DSL for AWS CDK

Code generation of Kotlin DSL for AWS CDK

Regular expression DSL on Kotlin

Examples Characters Construct Equivalent Matches x character(Char) The character x \\ character('\\') The backslash character \0n octal(OctalValue(7))

Kotlin Object Notation - Lightweight DSL to build fluid JSON trees

Kotlin Object Notation Lightweight kotlin MPP DSL for building JSON trees Setup Just drop the dependency in your commonMain sourceSet kotlin { sourc

Releases(v0.2.0)
Owner
Sagar Viradiya
Google Developer Expert for Android | Co-organizer of GDG MAD
Sagar Viradiya
Kotlin-client-dsl - A kotlin-based dsl project for a (Client) -> (Plugin) styled program

kotlin-client-dsl a kotlin-based dsl project for a (Client) -> (Plugin) styled p

jackson 3 Dec 10, 2022
Movie app that receives popular movies and allows the user to search for the specific movie through the Rest API with help of retrofit library &MVVM architecture.

MovieClue Millions of movies, TV shows and people to discover. Explore now Movie app that recieves popular movies and allow the user to search for spe

Shubham Tomar 6 Mar 31, 2022
An android application developed in Kotlin that provides lists and tables of soccer leagues through api consumption

An android application developed in Kotlin that provides lists and tables of soccer leagues through api consumption

Paulo Cรฉsar 4 May 16, 2022
Simple MVVM app to get photos through https://unsplash.com api

MyPhotoLoaderApp Simple photo loading app powered by Unsplash.com which implements MVVM architecture using Hilt, Navigation Component, Retrofit, Pagin

Behnam Banaei 10 Oct 6, 2022
A light lib that helps and centralize logs in your application.

BadgeLog (Kotlin version) For the iOS swift version, see this page BadgeLog is an Android Kotlin library that helps you manage logs within your applic

Daniele 1 Feb 8, 2022
A Kotlin DSL wrapper around the mikepenz/MaterialDrawer library.

MaterialDrawerKt Create navigation drawers in your Activities and Fragments without having to write any XML, in pure Kotlin code, with access to all t

Mรกrton Braun 517 Nov 19, 2022
The most complete and powerful data-binding library and persistence infra for Kotlin 1.3, Android & Splitties Views DSL, JavaFX & TornadoFX, JSON, JDBC & SQLite, SharedPreferences.

Lychee (ex. reactive-properties) Lychee is a library to rule all the data. ToC Approach to declaring data Properties Other data-binding libraries Prop

Mike 112 Dec 9, 2022
Lightweight Kotlin DSL dependency injection library

Warehouse DSL Warehouse is a lightweight Kotlin DSL dependency injection library this library has an extremely faster learning curve and more human fr

Osama Raddad 18 Jul 17, 2022
Kotlin parser library with an easy-to-use DSL

Pratt Library for parsing expressions and a beautiful Kotlin DSL Just define your operators and operands with the Kotlin DSL and the parser is ready!

furetur 9 Oct 17, 2022
Android Library to handle multiple Uri's(paths) received through Intents.

?? Handle Path Oz Android library written in Kotlin, but can be used in Java too. Built to handle a single or multiple Uri (paths) received through In

Murillo Comino 57 Dec 14, 2022