0.0.11

Firework center has been added.
esatgozcu · Mar 23, 2023 · dd040e0 · dd040e0
1 parent 7b04a37
commit dd040e0
Show file tree

Hide file tree

Showing 16 changed files with 425 additions and 52 deletions.
diff --git a/README.md b/README.md
@@ -3,15 +3,15 @@
 ### Step by step understand compose animation logic.
 
 This repository developed for Compose animation. There are a lot of animation with different concepts. You can select what you want and customize what you needed.
-<br/>
-<img src="https://user-images.githubusercontent.com/35576161/225820649-a1b78869-d21f-46a8-8dcd-c1cca9c87c4f.png" width="426" height="426"/>
-<br/>
+
+<img width="213" alt="Screenshot 2023-03-23 at 4 55 32 PM" src="https://user-images.githubusercontent.com/35576161/227126400-29ae3282-4c29-4db8-874d-8a0cedd93191.png">
+
 
 ## Simple Animations
 
 <br/>
 
-| **#[Snow Flake](app/src/main/java/com/esatgozcu/animationexamples/ui/view/SnowFlakeView.kt)** | **#[Paper Plane](app/src/main/java/com/esatgozcu/animationexamples/ui/view/PaperPlaneView.kt)** | **#[Blink Circle](app/src/main/java/com/esatgozcu/animationexamples/ui/view/BlinkCircleView.kt)** | **#[Circle Rotation](app/src/main/java/com/esatgozcu/animationexamples/ui/view/CircleRotationView.kt)** |
+| **#[Snow Flake](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/snowflake)** | **#[Paper Plane](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/paperplane)** | **#[Blink Circle](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/blinkcircle)** | **#[Circle Rotation](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/circlerotation)** |
 | --- | --- | --- | --- |
 | <img src="https://user-images.githubusercontent.com/35576161/226112372-553c2a66-63d5-4650-9dfa-6f634926d974.gif" height="320"/> | <img src="https://user-images.githubusercontent.com/35576161/226112002-24f730b6-cd3d-49f8-9371-0a3883f7d0dc.gif" height="320"/> | <img src="https://user-images.githubusercontent.com/35576161/226112516-a8e1cf94-3990-46c2-ae63-09b944283732.gif" height="320"/> | <img src="https://user-images.githubusercontent.com/35576161/226112596-57de7076-d3f6-4f89-b422-34edd038eee6.gif" height="320"/> |
 
@@ -21,16 +21,24 @@ This repository developed for Compose animation. There are a lot of animation wi
 
 <br/>
 
-| **#[Default](app/src/main/java/com/esatgozcu/animationexamples/ui/view/ConfettiAnimationView.kt)** | **#[Firework Effect](app/src/main/java/com/esatgozcu/animationexamples/ui/view/ConfettiAnimationView.kt)** |
+| **#[Default](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/confetticenter)** | **#[Firework Effect](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/confetticenter)** |
 | --- | --- |
 | <img src="https://user-images.githubusercontent.com/35576161/226273324-8283c817-4966-4c37-89c8-fb91827eb7f8.gif" width="300"/> | <img src="https://user-images.githubusercontent.com/35576161/226272886-b496230b-dbb3-4abd-9683-c181988c7eca.gif" width="300"/> |
 
-| **#[Image](AnimationExamples/View/ConfettiAnimationView.swift)** | **#[Emoji - Text](app/src/main/java/com/esatgozcu/animationexamples/ui/view/ConfettiAnimationView.kt)** |
+| **#[Image](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/confetticenter)** | **#[Emoji - Text](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/confetticenter)** |
 | --- | --- |
 | <img src="https://user-images.githubusercontent.com/35576161/226273152-e8701691-0940-4716-a887-55ca8f6691fd.gif" width="300"/> | <img src="https://user-images.githubusercontent.com/35576161/226273515-eb45eb18-db51-46df-9451-2b51b766926f.gif" width="300"/> |
 
 <br/>
 
+## Firework Animations
+
+| **#[Firework](app/src/main/java/com/esatgozcu/animationexamples/ui/animations/fireworkcenter)** |
+| --- |
+| <img src="https://user-images.githubusercontent.com/35576161/227125717-5e279def-e08d-4d96-a711-236d8a82b179.gif" width="400"/> |
+
+<br/>
+
 ## 🔨 Support
 
-If you like the project, don't forget to `put star 🌟`.
+If you like the project, don't forget to `put a star 🌟`.
diff --git a/app/src/main/java/com/esatgozcu/animationexamples/helper/Extension.kt b/app/src/main/java/com/esatgozcu/animationexamples/helper/Extension.kt
@@ -8,4 +8,7 @@ fun Color.Companion.random() : Color {
     val green = Random.nextInt(256)
     val blue = Random.nextInt(256)
     return Color(red, green, blue)
-}
+}
+
+val String.color
+    get() = Color(android.graphics.Color.parseColor(this))
diff --git a/app/src/main/java/com/esatgozcu/animationexamples/navigation/NavGraph.kt b/app/src/main/java/com/esatgozcu/animationexamples/navigation/NavGraph.kt
@@ -1,16 +1,16 @@
 package com.esatgozcu.animationexamples.navigation
 
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.platform.LocalConfiguration
-import androidx.lifecycle.ViewModel
-import androidx.lifecycle.viewmodel.compose.viewModel
-import androidx.lifecycle.viewmodel.viewModelFactory
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
+import com.esatgozcu.animationexamples.ui.animations.blinkcircle.BlinkCircleView
+import com.esatgozcu.animationexamples.ui.animations.circlerotation.CircleRotationView
+import com.esatgozcu.animationexamples.ui.animations.confetticenter.ConfettiCenterView
+import com.esatgozcu.animationexamples.ui.animations.fireworkcenter.FireworkCenterView
+import com.esatgozcu.animationexamples.ui.animations.paperplane.PaperPlaneView
+import com.esatgozcu.animationexamples.ui.animations.snowflake.SnowFlakeView
 import com.esatgozcu.animationexamples.ui.view.*
-import com.esatgozcu.animationexamples.ui.viewModel.CircleRotationVM
-import com.esatgozcu.animationexamples.ui.viewModel.SnowFlakeVM
 
 @Composable
 fun NavGraph(navController: NavHostController) {
@@ -33,8 +33,11 @@ fun NavGraph(navController: NavHostController) {
         composable(route = Screens.CircleRotation.route) {
             CircleRotationView()
         }
-        composable(route = Screens.ConfettiAnimation.route) {
-            ConfettiAnimationView()
+        composable(route = Screens.ConfettiCenter.route) {
+            ConfettiCenterView()
+        }
+        composable(route = Screens.FireworkCenter.route) {
+            FireworkCenterView()
         }
     }
 }
@@ -45,5 +48,6 @@ sealed class Screens(val route: String) {
     object PaperPlane: Screens("PaperPlane")
     object BlinkCircle: Screens("BlinkCircle")
     object CircleRotation: Screens("CircleRotation")
-    object ConfettiAnimation: Screens("ConfettiAnimation")
+    object ConfettiCenter: Screens("ConfettiCenter")
+    object FireworkCenter: Screens("FireworkCenter")
 }
diff --git a/...zcu/animationexamples/ui/view/HomePage.kt → ...satgozcu/animationexamples/ui/HomePage.kt b/...zcu/animationexamples/ui/view/HomePage.kt → ...satgozcu/animationexamples/ui/HomePage.kt
@@ -8,8 +8,6 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
-import androidx.compose.ui.Alignment.Companion.Center
-import androidx.compose.ui.Alignment.Companion.CenterHorizontally
 import androidx.compose.ui.Alignment.Companion.CenterVertically
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
@@ -20,10 +18,8 @@ import androidx.compose.ui.unit.dp
 import androidx.navigation.NavController
 import androidx.navigation.compose.rememberNavController
 import com.esatgozcu.animationexamples.R
-import com.esatgozcu.animationexamples.helper.ScreenSize
 import com.esatgozcu.animationexamples.navigation.Screens
 import com.esatgozcu.animationexamples.ui.theme.AnimationExamplesTheme
-import com.esatgozcu.animationexamples.ui.viewModel.SnowFlakeVM
 
 @Composable
 fun HomePage(navController: NavController) {
@@ -60,7 +56,7 @@ fun HomePage(navController: NavController) {
             horizontalArrangement = Arrangement.spacedBy(10.dp),
             modifier = Modifier
                 .clickable {
-                    navController.navigate(Screens.ConfettiAnimation.route)
+                    navController.navigate(Screens.ConfettiCenter.route)
                 }
                 .padding(10.dp),
         ){
@@ -71,6 +67,21 @@ fun HomePage(navController: NavController) {
                     .size(25.dp)
             )
         }
+        Row(verticalAlignment = CenterVertically,
+            horizontalArrangement = Arrangement.spacedBy(10.dp),
+            modifier = Modifier
+                .clickable {
+                    navController.navigate(Screens.FireworkCenter.route)
+                }
+                .padding(10.dp),
+        ){
+            Text(text = "Firework View")
+            Text(
+                text = "\uD83C\uDF86",
+                modifier = Modifier
+                    .size(25.dp)
+            )
+        }
     }
 }
 

diff --git a/...ionexamples/ui/viewModel/BlinkCircleVM.kt → ...i/animations/blinkcircle/BlinkCircleVM.kt b/...ionexamples/ui/viewModel/BlinkCircleVM.kt → ...i/animations/blinkcircle/BlinkCircleVM.kt
@@ -1,4 +1,4 @@
-package com.esatgozcu.animationexamples.ui.viewModel
+package com.esatgozcu.animationexamples.ui.animations.blinkcircle
 
 import androidx.compose.runtime.mutableStateOf
 import androidx.lifecycle.ViewModel

diff --git a/...mationexamples/ui/view/BlinkCircleView.kt → ...animations/blinkcircle/BlinkCircleView.kt b/...mationexamples/ui/view/BlinkCircleView.kt → ...animations/blinkcircle/BlinkCircleView.kt
@@ -1,8 +1,6 @@
-package com.esatgozcu.animationexamples.ui.view
+package com.esatgozcu.animationexamples.ui.animations.blinkcircle
 
 import androidx.compose.animation.core.*
-import androidx.compose.foundation.Canvas
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.CircleShape
@@ -11,18 +9,10 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.scale
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.layout.layoutId
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp
-import com.esatgozcu.animationexamples.ui.viewModel.BlinkCircleVM
 import androidx.lifecycle.viewmodel.compose.viewModel
-import com.esatgozcu.animationexamples.R
 import com.esatgozcu.animationexamples.helper.ScreenSize
-import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.delay
-import kotlinx.coroutines.launch
-import kotlin.time.Duration.Companion.seconds
-import kotlin.time.ExperimentalTime
 
 @Composable
 fun BlinkCircleView(viewModel: BlinkCircleVM = viewModel()) {

diff --git a/...examples/ui/viewModel/CircleRotationVM.kt → ...ations/circlerotation/CircleRotationVM.kt b/...examples/ui/viewModel/CircleRotationVM.kt → ...ations/circlerotation/CircleRotationVM.kt
@@ -1,4 +1,4 @@
-package com.esatgozcu.animationexamples.ui.viewModel
+package com.esatgozcu.animationexamples.ui.animations.circlerotation
 
 import androidx.compose.runtime.mutableStateOf
 import androidx.lifecycle.ViewModel

diff --git a/...ionexamples/ui/view/CircleRotationView.kt → ...ions/circlerotation/CircleRotationView.kt b/...ionexamples/ui/view/CircleRotationView.kt → ...ions/circlerotation/CircleRotationView.kt
@@ -1,4 +1,4 @@
-package com.esatgozcu.animationexamples.ui.view
+package com.esatgozcu.animationexamples.ui.animations.circlerotation
 
 import androidx.compose.animation.core.*
 import androidx.compose.foundation.background
@@ -15,7 +15,6 @@ import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import androidx.lifecycle.viewmodel.compose.viewModel
-import com.esatgozcu.animationexamples.ui.viewModel.CircleRotationVM
 
 @Composable
 fun CircleRotationView(viewModel: CircleRotationVM = viewModel()) {

diff --git a/...mples/ui/viewModel/ConfettiAnimationVM.kt → ...ons/confetticenter/ConfettiAnimationVM.kt b/...mples/ui/viewModel/ConfettiAnimationVM.kt → ...ons/confetticenter/ConfettiAnimationVM.kt
@@ -1,11 +1,8 @@
-package com.esatgozcu.animationexamples.ui.viewModel
+package com.esatgozcu.animationexamples.ui.animations.confetticenter
 
 import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material.Text
 import androidx.compose.ui.graphics.*
-import androidx.compose.ui.res.painterResource
 import androidx.lifecycle.ViewModel
-import com.esatgozcu.animationexamples.R
 import com.esatgozcu.animationexamples.helper.CustomShape.Shapes.Parallelogram
 import com.esatgozcu.animationexamples.helper.CustomShape.Shapes.Triangle
 import com.esatgozcu.animationexamples.helper.random

diff --git a/...examples/ui/view/ConfettiAnimationView.kt → ...s/confetticenter/ConfettiAnimationView.kt b/...examples/ui/view/ConfettiAnimationView.kt → ...s/confetticenter/ConfettiAnimationView.kt
@@ -1,4 +1,4 @@
-package com.esatgozcu.animationexamples.ui.view
+package com.esatgozcu.animationexamples.ui.animations.confetticenter
 
 import androidx.compose.animation.core.*
 import androidx.compose.foundation.Image
@@ -17,9 +17,6 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.lifecycle.viewmodel.compose.viewModel
-import com.esatgozcu.animationexamples.R
-import com.esatgozcu.animationexamples.ui.viewModel.ConfettiAnimationVM
-import com.esatgozcu.animationexamples.ui.viewModel.ConfettiTypes
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
 import kotlin.math.PI
@@ -29,7 +26,7 @@ import kotlin.math.sin
 import kotlin.random.Random
 
 @Composable
-fun ConfettiAnimationView(viewModel: ConfettiAnimationVM = viewModel()) {
+fun ConfettiCenterView(viewModel: ConfettiAnimationVM = viewModel()) {
 
     val counter = remember { mutableStateOf(0) }
 

diff --git a/...ain/java/com/esatgozcu/animationexamples/ui/animations/fireworkcenter/FireworkCenterVM.kt b/...ain/java/com/esatgozcu/animationexamples/ui/animations/fireworkcenter/FireworkCenterVM.kt
@@ -0,0 +1,46 @@
+package com.esatgozcu.animationexamples.ui.animations.fireworkcenter
+
+import androidx.compose.ui.graphics.*
+import androidx.lifecycle.ViewModel
+import com.esatgozcu.animationexamples.helper.color
+import com.esatgozcu.animationexamples.ui.animations.confetticenter.SHAPES
+
+/// - Parameters:
+///  - pieceCount: amount of confetti
+///  - colors: list of colors that is applied to the default shapes
+///  - pieceSize: size that confetti and emojis are scaled to
+///  - radius: explosion radius
+///  - repetitions: number of repetitions of the explosion
+///  - repetitionInterval: duration between the repetitions
+class FireworkCenterVM(
+    var pieceCount: Int = 20,
+    var pieceType: List<FireworkTypes> = listOf(
+        FireworkTypes.Shape(SHAPES.CIRCLE),
+    ),
+    var colors: List<Color> = listOf(
+        "#f88f22".color,
+        "#9c1d08".color,
+        "#ce7117".color,
+        "#f24d24".color,
+        "#113bc6".color,
+        "#c54a85".color,
+        "#92af96".color,
+        "#d23508".color,
+    ),
+    var pieceSize: Float = 5.0f,
+    var radius: Float = 100f,
+    var repetitions: Int = 0,
+    var repetitionInterval: Double = 1000.0,
+    var explosionAnimDuration: Double = 1200.0,
+    var launchAnimDuration: Double = 3000.0,
+): ViewModel() {
+    fun getAnimDuration(): Double {
+        return explosionAnimDuration + launchAnimDuration
+    }
+}
+
+sealed interface FireworkTypes {
+    data class Image(val value: Int) : FireworkTypes
+    data class Text(val value: String) : FireworkTypes
+    data class Shape(val value: SHAPES) : FireworkTypes
+}