Android Day 5 Make Animation

package com.williamjiamin.greetingsfromwilliam

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.animation.core.spring
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.ElevatedButton
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.williamjiamin.greetingsfromwilliam.ui.theme.GreetingsFromWilliamTheme

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            GreetingsFromWilliamTheme {
                MyWholeApp(modifier = Modifier.fillMaxSize())
            }
        }
    }
}

@Composable
fun MyWholeApp(modifier: Modifier = Modifier) {

    var showSplashScreen by rememberSaveable { mutableStateOf(true) }

    Surface(modifier) {
        if (showSplashScreen) {
            SplashScreen(onContinueClicked = { showSplashScreen = false })
        } else {
            DetailView()
        }
    }
}

@Composable
fun SplashScreen(
    onContinueClicked: () -> Unit,
    modifier: Modifier = Modifier
) {

    Column(
        modifier = modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Text("Welcome to William Jiamin's tutorial!")
        Button(
            modifier = Modifier.padding(vertical = 24.dp),
            onClick = onContinueClicked
        ) {
            Text("Continue!")
        }
    }

}

@Composable
private fun DetailView(
    modifier: Modifier = Modifier,
    names: List<String> = List(1000) { "$it" }
) {
    LazyColumn(modifier = modifier.padding(vertical = 4.dp)) {
        items(items = names) { name ->
            Greeting(name = name)
        }
    }
}

@Preview(showBackground = true, widthDp = 320, heightDp = 320)
@Composable
fun SplashScreenPreview() {
    GreetingsFromWilliamTheme {
        SplashScreen(onContinueClicked = {})
    }
}

@Composable
private fun Greeting(name: String, modifier: Modifier = Modifier) {

    var changed by rememberSaveable { mutableStateOf(false) }

    val extraPadding by animateDpAsState(
        if (changed) 48.dp else 0.dp,
        animationSpec = spring(
            dampingRatio = Spring.DampingRatioMediumBouncy,
            stiffness = Spring.StiffnessLow
        ), label = ""
    )
    Surface(
        color = if (changed) Color.LightGray else Color(android.graphics.Color.parseColor("#FFE382")),
        shape = RoundedCornerShape(48.dp),
        modifier = modifier.padding(8.dp)
    ) {
        Row(modifier = Modifier.padding(24.dp)) {
            Column(modifier = Modifier
                .weight(1f)
                .padding(bottom = extraPadding.coerceAtLeast(0.dp))
            ) {
                Text(text = "There is some tutorials from William Jiamin.")
                Text(text = name)
            }
            ElevatedButton(
                onClick = { changed = !changed }

            ) {
                Text(if (changed) "Checked" else "Check It Out")
            }
        }
    }
}

@Preview(showBackground = true, widthDp = 320)
@Composable
fun DetailViewPreview() {
    GreetingsFromWilliamTheme {
        DetailView()
    }
}

@Preview
@Composable
fun MyWholeAppPreview() {
    GreetingsFromWilliamTheme {
        MyWholeApp(Modifier.fillMaxSize())
    }
}

Now we got smooth animation!