Perform bounce animations using keyframes (7c445898) · Commits · e / os / android_frameworks_base

packages/SystemUI/src/com/android/systemui/qs/panels/ui/viewmodel/BounceableTileViewModel.kt

+17 −18

Original line number	Diff line number	Diff line
		@@ -20,7 +20,7 @@ import androidx.compose.animation.core.Animatable
		import androidx.compose.animation.core.AnimationVector
		import androidx.compose.animation.core.CubicBezierEasing
		import androidx.compose.animation.core.VectorConverter
		import androidx.compose.animation.core.tween
		import androidx.compose.animation.core.keyframes
		import androidx.compose.ui.unit.Dp
		import androidx.compose.ui.unit.dp
		import com.android.compose.animation.Bounceable
		@@ -40,8 +40,7 @@ class BounceableTileViewModel : Bounceable {
		get() = animatableTextBounceScale.value

		suspend fun animateContainerBounce() {
		animatableContainerBounce.animateToBounce(BounceSize)
		animatableContainerBounce.animateToRest(ContainerBounceAtRest)
		animatableContainerBounce.animateBounce(ContainerBounceAtRest, BounceSize)
		}

		suspend fun animateContentBounce(iconOnly: Boolean) {
		@@ -53,26 +52,26 @@ class BounceableTileViewModel : Bounceable {
		}

		private suspend fun animateIconBounce() {
		animatableIconBounceScale.animateToBounce(ICON_BOUNCE_SCALE)
		animatableIconBounceScale.animateToRest(SCALE_BOUNCE_AT_REST)
		animatableIconBounceScale.animateBounce(SCALE_BOUNCE_AT_REST, ICON_BOUNCE_SCALE)
		}

		private suspend fun animateTextBounce() {
		animatableTextBounceScale.animateToBounce(TEXT_BOUNCE_SCALE)
		animatableTextBounceScale.animateToRest(SCALE_BOUNCE_AT_REST)
		animatableTextBounceScale.animateBounce(SCALE_BOUNCE_AT_REST, TEXT_BOUNCE_SCALE)
		}

		private suspend fun <T, V : AnimationVector> Animatable<T, V>.animateToBounce(targetValue: T) {
		/** Animates from [valueAtRest] to [targetValue] and back to [valueAtRest]. */
		private suspend fun <T, V : AnimationVector> Animatable<T, V>.animateBounce(
		valueAtRest: T,
		targetValue: T,
		) {
		animateTo(
		targetValue,
		tween(durationMillis = BOUNCE_DURATION_MILLIS, easing = BounceStartEasing),
		)
		}

		private suspend fun <T, V : AnimationVector> Animatable<T, V>.animateToRest(targetValue: T) {
		animateTo(
		targetValue,
		tween(durationMillis = BOUNCE_DURATION_MILLIS, easing = BounceEndEasing),
		valueAtRest,
		animationSpec =
		keyframes {
		durationMillis = BOUNCE_DURATION_MILLIS
		targetValue at BOUNCE_DURATION_MILLIS / 2 using BounceStartEasing
		valueAtRest at BOUNCE_DURATION_MILLIS using BounceEndEasing
		},
		)
		}

		@@ -84,6 +83,6 @@ class BounceableTileViewModel : Bounceable {
		const val ICON_BOUNCE_SCALE = 1.1f
		const val TEXT_BOUNCE_SCALE = 1.06f
		const val SCALE_BOUNCE_AT_REST = 1f
		const val BOUNCE_DURATION_MILLIS = 167
		const val BOUNCE_DURATION_MILLIS = 167 * 2
		}
		}

packages/SystemUI/tests/goldens/containerBounce_bounceEndDisabled.json

+40 −58

Original line number	Diff line number	Diff line
		@@ -23,8 +23,6 @@
		304,
		320,
		336,
		352,
		368,
		"after"
		],
		"features": [
		@@ -45,91 +43,83 @@
		"height": 72
		},
		{
		"width": 93.71429,
		"width": 96,
		"height": 72
		},
		{
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 91.14286,
		"height": 72
		},
		{
		"width": 90.28571,
		"width": 95.42857,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 94.57143,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 93.14286,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 91.42857,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 89.14286,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 92.85714,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 94.28571,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 95.14286,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 95.71429,
		"height": 72
		},
		{
		"width": 90,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.85714,
		"width": 96.28571,
		"height": 72
		},
		{
		"width": 91.71429,
		"width": 96.57143,
		"height": 72
		},
		{
		"width": 92.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 95.42857,
		"width": 96.85714,
		"height": 72
		},
		{
		@@ -155,91 +145,83 @@
		"height": 72
		},
		{
		"width": 100,
		"width": 97.71429,
		"height": 72
		},
		{
		"width": 101.42857,
		"height": 72
		},
		{
		"width": 102.57143,
		"height": 72
		},
		{
		"width": 103.42857,
		"width": 98.28571,
		"height": 72
		},
		{
		"width": 104,
		"width": 99.14286,
		"height": 72
		},
		{
		"width": 104.28571,
		"width": 100,
		"height": 72
		},
		{
		"width": 104.57143,
		"width": 100.57143,
		"height": 72
		},
		{
		"width": 104.57143,
		"width": 101.42857,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 102.28571,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 102.85714,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 103.71429,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 104.57143,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 102.85714,
		"height": 72
		},
		{
		"width": 104.85714,
		"width": 100.85714,
		"height": 72
		},
		{
		"width": 104.57143,
		"width": 99.42857,
		"height": 72
		},
		{
		"width": 104.28571,
		"width": 98.57143,
		"height": 72
		},
		{
		"width": 104,
		"width": 98,
		"height": 72
		},
		{
		"width": 103.71429,
		"width": 97.71429,
		"height": 72
		},
		{
		"width": 102.85714,
		"width": 97.42857,
		"height": 72
		},
		{
		"width": 102,
		"width": 97.14286,
		"height": 72
		},
		{
		"width": 100.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 98.28571,
		"width": 96.85714,
		"height": 72
		},
		{

packages/SystemUI/tests/goldens/containerBounce_iconTile.json

+60 −86

Original line number	Diff line number	Diff line
		@@ -23,8 +23,6 @@
		304,
		320,
		336,
		352,
		368,
		"after"
		],
		"features": [
		@@ -45,91 +43,83 @@
		"height": 72
		},
		{
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 92.28571,
		"width": 96,
		"height": 72
		},
		{
		"width": 91.14286,
		"height": 72
		},
		{
		"width": 90.28571,
		"width": 95.42857,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 94.57143,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 93.14286,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 91.42857,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 89.14286,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 92.85714,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 94.28571,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 95.14286,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 95.71429,
		"height": 72
		},
		{
		"width": 90,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.85714,
		"width": 96.28571,
		"height": 72
		},
		{
		"width": 91.71429,
		"width": 96.57143,
		"height": 72
		},
		{
		"width": 92.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 95.42857,
		"width": 96.85714,
		"height": 72
		},
		{
		@@ -155,91 +145,83 @@
		"height": 72
		},
		{
		"width": 102.85714,
		"width": 98.28571,
		"height": 72
		},
		{
		"width": 106.28571,
		"width": 100,
		"height": 72
		},
		{
		"width": 108.28571,
		"width": 101.42857,
		"height": 72
		},
		{
		"width": 109.71429,
		"height": 72
		},
		{
		"width": 110.85714,
		"height": 72
		},
		{
		"width": 111.71429,
		"width": 102.85714,
		"height": 72
		},
		{
		"width": 112.28571,
		"width": 104.57143,
		"height": 72
		},
		{
		"width": 112.57143,
		"width": 106,
		"height": 72
		},
		{
		"width": 112.85714,
		"width": 107.71429,
		"height": 72
		},
		{
		"width": 112.85714,
		"width": 109.14286,
		"height": 72
		},
		{
		"width": 112.85714,
		"width": 110.57143,
		"height": 72
		},
		{
		"width": 112.85714,
		"width": 112.28571,
		"height": 72
		},
		{
		"width": 112.85714,
		"width": 109.14286,
		"height": 72
		},
		{
		"width": 112.57143,
		"width": 104.57143,
		"height": 72
		},
		{
		"width": 112.28571,
		"width": 102.28571,
		"height": 72
		},
		{
		"width": 112,
		"width": 100.57143,
		"height": 72
		},
		{
		"width": 111.14286,
		"width": 99.14286,
		"height": 72
		},
		{
		"width": 110.28571,
		"width": 98.28571,
		"height": 72
		},
		{
		"width": 109.14286,
		"width": 97.71429,
		"height": 72
		},
		{
		"width": 107.42857,
		"width": 97.42857,
		"height": 72
		},
		{
		"width": 104.57143,
		"width": 97.14286,
		"height": 72
		},
		{
		"width": 99.71429,
		"width": 96.85714,
		"height": 72
		},
		{
		@@ -265,91 +247,83 @@
		"height": 72
		},
		{
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 91.14286,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.28571,
		"width": 95.42857,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 94.57143,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 93.14286,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 91.42857,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 89.14286,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 92.85714,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 94.28571,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 95.14286,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 95.71429,
		"height": 72
		},
		{
		"width": 90,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.85714,
		"width": 96.28571,
		"height": 72
		},
		{
		"width": 91.71429,
		"width": 96.57143,
		"height": 72
		},
		{
		"width": 92.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 95.42857,
		"width": 96.85714,
		"height": 72
		},
		{

packages/SystemUI/tests/goldens/containerBounce_largeTile.json

+60 −86

Original line number	Diff line number	Diff line
		@@ -23,8 +23,6 @@
		304,
		320,
		336,
		352,
		368,
		"after"
		],
		"features": [
		@@ -45,91 +43,83 @@
		"height": 72
		},
		{
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 92.28571,
		"width": 96,
		"height": 72
		},
		{
		"width": 91.14286,
		"height": 72
		},
		{
		"width": 90.28571,
		"width": 95.42857,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 94.57143,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 93.14286,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 91.42857,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 89.14286,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 92.85714,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 94.28571,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 95.14286,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 95.71429,
		"height": 72
		},
		{
		"width": 90,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.85714,
		"width": 96.28571,
		"height": 72
		},
		{
		"width": 91.71429,
		"width": 96.57143,
		"height": 72
		},
		{
		"width": 92.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 95.42857,
		"width": 96.85714,
		"height": 72
		},
		{
		@@ -155,91 +145,83 @@
		"height": 72
		},
		{
		"width": 207.71428,
		"width": 203.14285,
		"height": 72
		},
		{
		"width": 211.14285,
		"width": 204.85715,
		"height": 72
		},
		{
		"width": 213.14285,
		"width": 206.28572,
		"height": 72
		},
		{
		"width": 214.57143,
		"height": 72
		},
		{
		"width": 215.71428,
		"height": 72
		},
		{
		"width": 216.57143,
		"width": 207.71428,
		"height": 72
		},
		{
		"width": 217.14285,
		"width": 209.42857,
		"height": 72
		},
		{
		"width": 217.42857,
		"width": 210.85715,
		"height": 72
		},
		{
		"width": 217.71428,
		"width": 212.57143,
		"height": 72
		},
		{
		"width": 217.71428,
		"width": 214,
		"height": 72
		},
		{
		"width": 217.71428,
		"width": 215.42857,
		"height": 72
		},
		{
		"width": 217.71428,
		"width": 217.14285,
		"height": 72
		},
		{
		"width": 217.71428,
		"width": 214,
		"height": 72
		},
		{
		"width": 217.42857,
		"width": 209.42857,
		"height": 72
		},
		{
		"width": 217.14285,
		"width": 207.14285,
		"height": 72
		},
		{
		"width": 216.85715,
		"width": 205.42857,
		"height": 72
		},
		{
		"width": 216,
		"width": 204,
		"height": 72
		},
		{
		"width": 215.14285,
		"width": 203.14285,
		"height": 72
		},
		{
		"width": 214,
		"width": 202.57143,
		"height": 72
		},
		{
		"width": 212.28572,
		"width": 202.28572,
		"height": 72
		},
		{
		"width": 209.42857,
		"width": 202,
		"height": 72
		},
		{
		"width": 204.57143,
		"width": 201.71428,
		"height": 72
		},
		{
		@@ -265,91 +247,83 @@
		"height": 72
		},
		{
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 91.14286,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.28571,
		"width": 95.42857,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 94.57143,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 93.71429,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 93.14286,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 92.28571,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 91.42857,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 89.14286,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 90.85714,
		"height": 72
		},
		{
		"width": 88.85714,
		"width": 92.85714,
		"height": 72
		},
		{
		"width": 89.14286,
		"width": 94.28571,
		"height": 72
		},
		{
		"width": 89.42857,
		"width": 95.14286,
		"height": 72
		},
		{
		"width": 89.71429,
		"width": 95.71429,
		"height": 72
		},
		{
		"width": 90,
		"width": 96,
		"height": 72
		},
		{
		"width": 90.85714,
		"width": 96.28571,
		"height": 72
		},
		{
		"width": 91.71429,
		"width": 96.57143,
		"height": 72
		},
		{
		"width": 92.85714,
		"width": 96.85714,
		"height": 72
		},
		{
		"width": 95.42857,
		"width": 96.85714,
		"height": 72
		},
		{

packages/SystemUI/tests/goldens/iconBounce.json

+20 −24

Original line number	Diff line number	Diff line
		@@ -23,8 +23,6 @@
		304,
		320,
		336,
		352,
		368,
		"after"
		],
		"features": [
		@@ -35,28 +33,26 @@
		1,
		1,
		1,
		1.0382543,
		1.0589137,
		1.0719209,
		1.080992,
		1.0875417,
		1.0922903,
		1.095665,
		1.0979443,
		1.0993223,
		1.0999403,
		1.1,
		1.1,
		1.0996791,
		1.0986489,
		1.0967841,
		1.0939169,
		1.0898111,
		1.0841159,
		1.0762662,
		1.0652343,
		1.0487096,
		1.0182534,
		1.0095809,
		1.0191617,
		1.0287426,
		1.0383234,
		1.0479043,
		1.0574851,
		1.067066,
		1.0766468,
		1.0862275,
		1.0958085,
		1.0762855,
		1.0487678,
		1.0331554,
		1.0226066,
		1.015069,
		1.0095974,
		1.0056627,
		1.002932,
		1.0011797,
		1.0002441,
		1
		]
		}