Функция animateDpAsState

Функция animateDpAsState анимирует Dp к targetValue при смене состояния. Возвращает State<Dp>, удобный для padding и size. Спецификацию передают в animationSpec, часто tween или spring.

Синтаксис

val pad by animateDpAsState(targetValue = targetDp)

Параметры

Параметр	Описание
`targetValue`	Целевой размер в dp.
`animationSpec`	Как именно менять значение во времени.
`label`	Имя анимации для trace.

Пример

Давайте раздвинем отступ текста по кнопке:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.animation.core.tween
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Button
import androidx.compose.material3.Text
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

class MainActivity : ComponentActivity() {
	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContent {
			var wide by remember { mutableStateOf(false) }
			val pad by animateDpAsState(
				targetValue = if (wide) 48.dp else 8.dp,
				animationSpec = tween(400),
				label = "abcde",
			)
			Button(onClick = { wide = !wide }) {
				Text(
					text = "abcde",
					modifier = Modifier.padding(pad),
				)
			}
		}
	}
}

На экране текст на кнопке плавно отъезжает от краёв при переключении отступа.

Смотрите также

функция animateFloatAsState,
которая анимирует дробное число
функция animateColorAsState,
которая анимирует цвет
функция tween,
которая задаёт длительность перехода
функция AnimatedVisibility,
которая показывает блок с анимацией