https://github.com/omkar-tenkale/ExplodingComposable

Explosive dust effect animation for your composables!
https://github.com/omkar-tenkale/ExplodingComposable

android android-library animation compose-animation jetpack-compose jetpack-compose-library kotlin kotlin-android library

Last synced: 27 days ago
JSON representation

Explosive dust effect animation for your composables!

• Host: GitHub
• URL: https://github.com/omkar-tenkale/ExplodingComposable
• Owner: omkar-tenkale
• License: apache-2.0
• Created: 2023-02-20T09:54:05.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2023-04-12T19:20:22.000Z (almost 2 years ago)
• Last Synced: 2024-09-27T04:05:45.522Z (5 months ago)
• Topics: android, android-library, animation, compose-animation, jetpack-compose, jetpack-compose-library, kotlin, kotlin-android, library
• Language: Kotlin
• Homepage:
• Size: 4.44 MB
• Stars: 160
• Watchers: 1
• Forks: 5
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• jetpack-compose-awesome - Exploding Composable - A Jetpack Compose utility library to add explosive dust effect animation to any composable (Libraries / UI)
• jetpack-compose-awesome - Exploding Composable - A Jetpack Compose utility library to add explosive dust effect animation to any composable (Libraries / UI)

README

        


💢 Exploding Composable

A Jetpack Compose utility library to add explosive dust effect animation to any composable




  

  

  





  Based on 

  ExplosionField by

  @tyrantgit








## 💻 Installation

  

1. Add this to `build.gradle` of project gradle dependency

```groovy

allprojects {

	repositories {

		...

 		maven { url 'https://jitpack.io' }

	}

}

```

  

2. In `build.gradle` of `app` module, include this dependency

        

```groovy

implementation "com.github.omkar-tenkale:ExplodingComposable:1.0.1"

```

Find latest version and changelogs in the [releases](https://github.com/omkar-tenkale/ExplodingComposable/releases).




        

## ❓ Usage

Wrap the content to explode in [`Explodable`](https://github.com/omkar-tenkale/ExplodingComposable/blob/master/explodable/src/main/java/dev/omkartenkale/explodable/Explodable.kt) and trigger the explosion with `explosionController.explode()`

```kotlin

val explosionController = rememberExplosionController()

Explodable(controller = explosionController) {

    //Content to explode

    Box(modifier = Modifier

        .size(100.dp)

        .background(Color.Black)

        .clickable { explosionController.explode() })

}

```




    

## 🎨 Customization

ExplodingComposable offers a variety of customizations



```kotlin

val explosionController = rememberExplosionController()

Explodable(

    //Standard compose modifier

    modifier = Modifier,

    // Control the explosion state with an instance of ExplosionController

    // You can access it using rememberExplosionController() method

    // Provides methods controller.explode() and controller.reset()

    controller = explosionController,

    // Control the animation with these params

    animationSpec = ExplosionAnimationSpec(

        // The higher the number, the bigger the explosion

        explosionPower = 2f,

        // Duration for the particle explosion

        explosionDurationMs = 750,

        // Duration for the shake effect before explosion

        shakeDurationMs = 250

    ),

    // Callback to fire when explosion is finished

    onExplode = {

                

    },

    // To control the explosion manually, use this param [0f-1f]

    currentProgress = progress,

    // The composable to explode

    content = {

        

    }

)

```

## 📱 Demo

Download the [sample app](https://github.com/omkar-tenkale/ExplodingComposable/releases/download/1.0.1/ExplodingComposableDemo.apk)

or explore the [sample project](https://github.com/omkar-tenkale/ExplodingComposable/tree/master/app/src/main/java/dev/omkartenkale/explodable/sample)

## How it Works 🔧

Curious about how the library works under the hood?

Check out this in-depth [Medium article](https://proandroiddev.com/creating-a-particle-explosion-animation-in-jetpack-compose-4ee42022bbfa) for all the details

## Discuss 💬

Have any questions, doubts or want to present your opinions, views? You're always welcome. You can [start a discussion](https://github.com/omkar-tenkale/ExplodingComposable/discussions)

## 📃 License

Licensed under Apache license 2.0

This work is derived from [ExplosionField](https://github.com/tyrantgit/ExplosionField)