溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關如何在Android中利用ConstraintLayout實現一個動畫效果，文章內容質量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。
xml布局：
<!-- activity_main.xml --> <android.support.constraint.ConstraintLayout ...> <ImageView android:id="@+id/image" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" ... /> <Button ... /> </android.support.constraint.ConstraintLayout>
到目前為止，這只是一個普通的xml布局，我們再定義另一個布局：
<!-- activity_main_alt.xml --> <android.support.constraint.ConstraintLayout ...> <ImageView android:id="@+id/image" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" **app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent"** ... /> <Button ... /> </android.support.constraint.ConstraintLayout>
這兩個布局只有ImageView的高度不同，為了執行動畫，只需要在Activity中寫幾行代碼即可：
override fun onCreate(savedInstanceState: Bundle?) {
...
val constraintSet1 = ConstraintSet()
constraintSet1.clone(constraintLayout)
val constraintSet2 = ConstraintSet()
constraintSet2.clone(this, R.layout.activity_main_alt)
var changed = false
findViewById(R.id.button).setOnClickListener {
TransitionManager.beginDelayedTransition(constraintLayout)
val constraint = if (changed) constraintSet1 else constraintSet2
constraint.applyTo(constraintLayout)
changed = !changed
}
}代碼使用Kotlin寫的，即使沒有學過，基本也沒有什么障礙，不過還是很有必要學習一下的。
代碼中我們使用TransitionManager在Constrainlayout中啟動了一個延時動畫，TransitionManager在交換兩種布局時會自動使用動畫。
重復的xml Layout
這種方式使用了兩個xml布局，是否重復了呢，沒有人喜歡重復的代碼。
其實沒有你想的那么糟糕，如果為了動畫的目的定義多余的xml，可以省略所有的非布局屬性（如textSize等屬性）。Constrainlayout會自動捕獲所有layout的基本約束屬性并拋棄其中的一些。
如果你還是想避免重復的代碼，還可以在代碼中動態修改約束屬性：
override fun onCreate(savedInstanceState: Bundle?) {
...
val constraintSet1 = ConstraintSet()
constraintSet1.clone(constraintLayout)
val constraintSet2 = ConstraintSet()
constraintSet2.clone(constraintLayout)
constraintSet2.centerVertically(R.id.image, 0)
var changed = false
findViewById(R.id.button).setOnClickListener {
TransitionManager.beginDelayedTransition(constraintLayout)
val constraint = if (changed) constraintSet1 else constraintSet2
constraint.applyTo(constraintLayout)
changed = !changed
}
}使用transition 框架也可以實現這些動畫
當然可以這樣，我們可以通過使用transition框架或者使用屬性設置也可以實現動畫。然而，當需要的動畫可通過使用特定的約束來實現時，ConstrainLayout的方法就很有效，否則就需要大量的代碼來實現動畫效果。
另一個使用場景是當很多元素需要動效時，看一個例子：
使用ConstrainLayout可以實現以上的效果，通過指定不同的xml，動畫就會自動執行。
注意事項
1. 啟動動畫的方法：
TransitionManager.beginDelayedTransition(constraintLayout)
2. 自定義動畫
還可以自定義Transition：
val transition = AutoTransition() transition.duration = 1000 TransitionManager.beginDelayedTransition( constraintLayout, transition)
3. 嵌套問題
ConstraintLayout只可以對其直接子View執行動畫，這就意味著它不能很好地處理嵌套的ViewGroup。在以上的例子中，CardView中的TextView還需要手動處理動畫，也許可以通過嵌套ConstrainLayout來實現，但是我并沒有進行實驗。
4. 非布局屬性
ConstraintLayout只支持約束布局的動畫，不支持其他屬性（如坐標修改，文字修改等）。
5. 其他
如果動態修改ConstraintLayout中元素的基本布局屬性（比如使用translationY），動畫后并不會同步這個變更，也就是說動畫執行后，之前修改的屬性將會復原。
關于如何在Android中利用ConstraintLayout實現一個動畫效果就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
