Splash Screen Using Physics Animation
Tôi chia nó thành 2 bước Một hiệu ứng rotation xoay quanh trục (0,0) của màn hình. Tạo 1 hiệu ứng Translate xuống phía bên dưới màn hình. Các animation trước đây khi sử dụng chúng ta cần phải thiết lập thời gian bắt đầu và kết thúc của chúng 1 cách khá phức tạp và nếu phải xử lý nhiều ...
Tôi chia nó thành 2 bước
- Một hiệu ứng rotation xoay quanh trục (0,0) của màn hình.
- Tạo 1 hiệu ứng Translate xuống phía bên dưới màn hình.
Các animation trước đây khi sử dụng chúng ta cần phải thiết lập thời gian bắt đầu và kết thúc của chúng 1 cách khá phức tạp và nếu phải xử lý nhiều animation liên tiếp thì đúng là đáng sợ.
PHYSICS ANIMATION :
- Được hỗ trợ từ API 16
Để sử dụng thư viện animation này thì chúng ta cần add lib sau và build.gradle :
compile "com.android.support:support-dynamic-animation:25.4.0"
Bây giờ bạn sẽ ko cần phải xác định bất kì khoảng thời gian hoặc bất kì giá trị nào khác. Vì bản thân nó đã tự xác định nó rồi Có 2 loại animations được API cung cấp
1. Spring Animation:
- Gồm các animation được điều khiển bởi 1 lò xo
- Bạn có thể xác định được tất cả các tính chất của lực lò xo
- API cung cấp các loại hằng số khác nhau để bạn có thể cài đặt dễ dàng Spring animation
2. Fling Animations
- Gồm các animation được điều khiển bởi lực ma sát.
- Có 1 động lực ban đầu và dần dần chậm lại
- Tuân theo các luật ma sát
1. Tạo ra một Spring Force và áp dụng nó vào SpringAnimation
Khởi tạo và cài đặt SpringAnimation
springForce = SpringForce(0f) relative_layout.pivotX = 0f relative_layout.pivotY = 0f val springAnim = SpringAnimation(relative_layout, DynamicAnimation.ROTATION).apply { springForce.dampingRatio = SpringForce.DAMPING_RATIO_HIGH_BOUNCY springForce.stiffness = SpringForce.STIFFNESS_VERY_LOW } springAnim.spring = springForce springAnim.setStartValue(80f)
- Khởi tạo SpringForce với 1 giá trị ban đầu xác định vị trí cân bằng của nó
- Bắt đàu xác định SpringAnimation sẽ có các thông số sau :
- View mà bạn muốn áp dụng SpringAnimation
- DynamicAnimation sẽ cho chúng ta biết thuộc tính nào của chúng ta sẽ animate. Đó chính là Rotation trong trường hợp của chúng ta.
2. Thiết lập DynamicAnimation.OnAnimationEndListener
springAnim.addEndListener(object : DynamicAnimation.OnAnimationEndListener { override fun onAnimationEnd(animation: DynamicAnimation<out DynamicAnimation<*>>?, canceled: Boolean, value: Float, velocity: Float) { //Translation code will be here })
3. Thay đổi bố cụ sau khi kết thúc và mở activity thứ 2
override fun onAnimationEnd(animation: DynamicAnimation<out DynamicAnimation<*>>?, canceled: Boolean, value: Float, velocity: Float) { val displayMetrics = DisplayMetrics() windowManager.defaultDisplay.getMetrics(displayMetrics) val height = displayMetrics.heightPixels.toFloat() val awidth = displayMetrics.awidthPixels relative_layout.animate() .setStartDelay(1) .translationXBy(awidth.toFloat() / 2) .translationYBy(height) .setListener(object : Animator.AnimatorListener { override fun onAnimationRepeat(p0: Animator?) { } override fun onAnimationEnd(p0: Animator?) { val intent = Intent(applicationContext, MainActivity::class.java) finish() startActivity(intent) overridePendingTransition(0, 0) } override fun onAnimationCancel(p0: Animator?) { } override fun onAnimationStart(p0: Animator?) { } }) .setInterpolator(DecelerateInterpolator(1f)) .start() }
Các bước thực hiện :
- Đầu tiên lấy kích thước chiều rộng và chiều cao của màn hình để có thể dịch chuyển nó
- Chúng ta sẽ sử dụng hàm animate() của Relative Layout. Nó sẽ trả về cho tôi đối tượng ViewPropertyAnimator.
- Sau khi gọi animate(), chúng ta sẽ gọi setStartDelay để tạo thời gian delay trước khi bắt đầu Animation, Sau đó chúng ta tạo các thuộc tính translation cả 2 chiều X và Y theo tương ứng với awidth và height của màn hình mà ta mới lấy được ở bên trên.
- Sau khi thiết lập các thuộc tính của Animation. Chúng ta set thêm Listener vào trong ViewPropertyAnimator để lấy callback OnAnimationEnd và hiển thị Activity thứ 2 ngay khi callback OnAnimationEnd được gọi.
- Sau đó cuối cùng ở ViewPropertyAnimator chúng ta thiết lập Interpolator và gọi start()
4. Khởi chạy Spring Animation
Sau khi kết thúc khởi tạo thì chúng ta sẽ gọi start() để bắt đầu thực thi animation
https://github.com/amanjeetsingh150/SpringBasedSplash
https://android.jlelse.eu/splash-screen-using-physics-animation-4bd98eedfe04