Small Android Snowfall compose animation
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 🙃
Library has 2 base functions to use as an extension function for Modifier.
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()
)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
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
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
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
Big thanks to for inspiriation and source code for the first version of this library.
