Getting Started • How To Use • Samples • License

A lightweight particle effect animation for Android

---

🔧 Getting Started

Add the jitpack

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

Add the dependency

dependencies {
    // XML
    implementation 'com.github.iamoscarliang:particleview:xml:<version>'
    // Compose
    implementation 'com.github.iamoscarliang:particleview:compose:<version>'
}

💻 How To Use

ParticleView

XML

<com.oscarliang.particleview.xml.ParticleView
    android:id="@+id/particle_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

particleView.start(
    images = listOf(
        Image(
            imageId = R.drawable.particle,
            size = 30
        )
    ),
    startX = FloatOffset(0.0f, 1.0f),
    startY = FloatOffset(0.0f, 1.0f),
    angle = IntOffset(-30, 30),
    speed = FloatOffset(300.0f, 600.0f),
    countPerSecond = 20,
    duration = 5000
)

Compose

ParticleView(
    modifier = Modifier.fillMaxSize(),
    images = listOf(
        Image(
            imageId = R.drawable.particle,
            size = 30
        ),
    ),
    startX = FloatOffset(0.0f, 1.0f),
    startY = FloatOffset(0.0f, 1.0f),
    angle = IntOffset(-30, 30),
    speed = FloatOffset(300.0f, 600.0f),
    countPerSecond = 20,
    duration = 5000
)

Configuration

• images - the image of the particle
• startX - the start x position of the particle. Range from [0.0f, 1.0f] relative to the view's width
• startY - the start y position of the particle. Range from [0.0f, 1.0f] relative to the view's height
• speed - the speed of the particle moving in (px / per second)
• accelX - the x acceleration added to the speed per second
• accelY - the y acceleration added to the speed per second
• angle - the direction of the particle's speed. Range from [0, 360]. Top - 180, Right - 90, Bottom - 0, Left - 270
• rotation - the start rotation of the particle. Range from [0, 360]
• rotationSpeed - the rotation speed of the particle rotating in (degree / per second)
• countPerSecond - the count of particle emit per second
• duration - the duration of the animation
• fadeOutDuration - the fade out duration at the end of animation
• fadeOutEnable - controls the fade out effect at the end of animation. When false, the particle will disappear immediately and the fadeOutDuration has no effect
• isRunning - controls the current state of the animation. When false, the animation will jump to the end and play the fade out effect dependent on the fadeOutEnable is true or not
• onParticleClickListener - callback being executed when any particle is clicked
• onAnimationEndListener - callback being executed when end of the animation

🎉 Samples

XML

Compose

⚖️ License

ParticleView is licensed under the MIT license