Skip to content

idapgroup/Snowfall

Repository files navigation

Snowfall Compose

Small Android Snowfall compose animation

snowfall-base

Setup

Please, add to repositories jitpack:

repositories {
  mavenCentral()
  ...
  maven { url 'https://jitpack.io' }
}

Add to your module next dependency:

dependencies {
  implementation 'com.github.idapgroup:Snowfall:<latest-version>'
}

Note: Do not forget to add compose dependencies 🙃

Usage sample

Library has 2 base functions to use as an extension function for Modifier.

Snowfall

It is pretty simple to use. Just add .snowfall() to any modifier where you want to see the animation

        Box(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxSize()
                .snowfall()
        )

Custom flakes

If you want to customize snowflakes to any other image, the library allows you to put any painter list to make your own flakes animation.

        val data = listOf(
            rememberVectorPainter(image = Icons.Rounded.Add),
            rememberVectorPainter(image = Icons.Rounded.AccountBox),
            rememberVectorPainter(image = Icons.Rounded.Abc),
            rememberVectorPainter(image = Icons.Rounded.Alarm),
        )
        Box(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()
                .height(400.dp)
                .background(Color.Black, shape = RoundedCornerShape(8.dp))
                .snowfall(FlakeType.Custom(data))
        )
icon-falling.webm

Colors list and density

It is also possible to randomize different colors and flakes density for your purposes.

        Box(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxSize()
                .snowfall(
                  colors = listOf(Color.Green, Color.Yellow, Color.Blue, Color.Red),
                  density = 0.5 // from 0.0 to 1.0
                )
        )
snowfall-colors-dencity.webm

Snowmelt

Melting has the same usage as a falling.

        Box(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()
                .height(400.dp)
                .background(Color.DarkGray, shape = RoundedCornerShape(16.dp))
                .snowmelt()
        )
snowmelting.webm

And also allows you to customize flakes:

    val data = listOf(
        rememberVectorPainter(image = Icons.Rounded.Add),
        rememberVectorPainter(image = Icons.Rounded.AccountBox),
        rememberVectorPainter(image = Icons.Rounded.Abc),
        rememberVectorPainter(image = Icons.Rounded.Alarm),
    )
    val colors = listOf(Color.Yellow, Color.Blue, Color.Red, Color.Green, Color.Cyan)
    Box(
        modifier = Modifier
            .padding(16.dp)
            .fillMaxWidth()
            .height(400.dp)
            .background(Color.DarkGray, shape = RoundedCornerShape(8.dp))
            .snowmelt(
                type = FlakeType.Custom(data),
                colors = colors,
                density = 0.2
            )
    )
snowmelt-custom-colors-density.webm

Combining

You can also combine as many options as you want:

        Box(
            modifier = Modifier
                .padding(16.dp)
                .fillMaxWidth()
                .height(350.dp)
                .background(Color.DarkGray, shape = RoundedCornerShape(8.dp))
                .snowfall()
                .snowmelt()
        )
combining.webm

Kudos

Big thanks to Volodymyr Kondratenko for inspiriation and source code for the first version of this library.