[Học Android] Tìm hiểu về các Animation cơ bản

Bài viết sẽ cung cấp các kiến thức cơ bản về Animation trong Android và hướng dẫn các bạn tạo một vài animation đơn giản

Để tránh người dùng nhàm chán khi sử dụng ứng dụng của bạn, bạn nên tạo các Animation (hiệu ứng) cho các đối tượng mà người dùng tương tác, qua đó ứng dụng của bạn sẽ trở nên sinh động hơn, tạo cho người dùng sự thích thú khi sử dụng.

Android framework cung cấp hai hệ thống hình ảnh động: property animation (android.animation) và view animation (android.view.animation). Để làm quen với animation trong Android, ta bắt đầu với view animation cùng với các hiệu ứng phóng to, thu nhỏ, ẩn hiện, quay…

Sử dụng

Bước 1: Tạo file xml trong thư mục res/anim

Ví dụ: res/anim/rotate.xml

Bước 2: Load animation

Gọi hàm startAnimation(animation) cho view mà mình muốn áp dụng:

ImageView image = (ImageView)findViewById(R.id.image_id);
Animation animRotate = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate);
image.startAnimation(animRotate );

Một số animation cơ bản

Fade – Hiệu ứng mờ dần, hiện ra

fromAlpha: chỉ số alpha ban đầu (0.0 – 1.0)

toAlpha: chỉ số alpha khi kết thúc hiệu ứng (0.0 – 1.0)

Fade out – Mờ dần (Biến mất)

Fade in – Hiện ra

Scale – Kéo dãn (Phóng to, thu nhỏ)

fromXScale: tỉ lệ chiều cao ban đầu

toXScale: tỉ lệ chiều cao kết thúc

fromYScale: tỉ lệ chiều rộng ban đầu

toXScale: tỉ lệ chiều rộng kết thúc

Phóng to

Thu nhỏ

Translate – Di chuyển

Kết hợp các animation

Khi muốn chạy 2 hiệu ứng liên tiếp thì ta có thể tạo ra 2 file xml khác nhau, và startAnimation cùng lúc với view đó hoặc kết hợp 2 hiệu ứng trong 1 file xml bằng thẻ set

Ví dụ: Kết hợp 2 animation bằng thẻ set

Video demo các hiệu ứng: https://www.youtube.com/watch?v=k1qTffZ5OMs

Qua bài viết này hi vọng bạn sẽ có những hiểu biết cơ bản về Animation trong Android và tự xây dựng cho mình những animation để làm ứng dụng của bạn thú vị hơn nhé.

Chào thân ái và quyết thắng!

Bài viết gốc: https://viblo.asia/p/cach-tao-anh-dong-hay-cac-hieu-ung-trong-android-android-animations-zoZVRgYQGmg5