I have an issue with animations. I have defined two simple layouts:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/root"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/player1"
android:layout_width="50dp"
android:layout_height="77dp"
android:layout_marginStart="32dp"
android:layout_marginTop="16dp"
android:src="@drawable/two_hearts"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
and
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/root"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/player1"
android:layout_width="50dp"
android:layout_height="77dp"
android:layout_marginStart="32dp"
android:layout_marginTop="16dp"
android:src="@drawable/two_hearts"
android:translationY="-60dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
with looks:
The difference between them is android:translationY="-60dp"
.
I switch between them in the GameFragment.kt:
class GameFragment: Fragment() {
private lateinit var root: ConstraintLayout
private var expanded = false
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
root = inflater.inflate(R.layout.fragment_game_hidden, container, false) as ConstraintLayout
root.setOnClickListener {
show()
}
return root
}
private fun show() {
if (expanded) {
updateConstraints(R.layout.fragment_game_hidden)
} else {
updateConstraints(R.layout.fragment_game_shown)
}
expanded = !expanded
}
private fun updateConstraints(@LayoutRes id: Int) {
val newConstraintSet = ConstraintSet()
newConstraintSet.clone(context, id)
val transition = ChangeBounds()
transition.interpolator = AccelerateDecelerateInterpolator()
transition.duration = 1000
newConstraintSet.applyTo(root)
TransitionManager.beginDelayedTransition(root, transition)
}
}
My problem is, the animation is not played at all, the card on the layout just jumps to target location without any transition. Why? I feel like I'm missing something obvious here...
Remove android:translationY="-60dp" in : fragment_game_hidden.xml . Just use margin directly.
Try change to code below:
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/root"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="@+id/player1"
android:layout_width="50dp"
android:layout_height="77dp"
android:layout_marginStart="32dp"
android:src="@drawable/two_hearts"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toTopOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>