Splash là gì ?
- Chắc hẳng các bạn từng làm bất kì ứng dụng android nào thì cũng đã từng tạo splash cho app của mình rồi đúng k nhỉ! Splash là màn hình bắt đầu khi người dùng click vào app của chúng ta, thường đó sẽ là màn hình chạy slogan của app hoặc show logo, thông thường trong các app hiện nay
SingleActivity
thì Splash của chúng ta sẽ là 1fragment
.Ở Android 12 bổ sung SplashScreen API, cho phép tạo hoạt ảnh khởi chạy ứng dụng mới cho tất cả các ứng dụng. Điều này bao gồm chuyển động trong ứng dụng khi khởi chạy,Splash Screen
hiển thị biểu tượng ứng dụng của bạn và chuyển đổi sangMainActivity
.
1. Cách hoạt động của Splash
- Khi người dùng khởi chạy ứng dụng trong khi quy trình của ứng dụng không chạy(
a cold start
) hoặc các Activity chưa được tạo (a warm start
), các sự kiện sau sẽ xảy ra.(The splash screen is never shown during ahot start
).
- Hệ thống hiển thị
Splash Screen
sử dụng cáctheme
và bất kỳaction
nào mà bạn đã xác định. - Khi ứng dụng đã sẵn sàng,
Splash Screen
sẽ bị loại bỏ và ứng dụng được hiển thị.
Các bạn tìm hiểu thêm về
a cold start, a warm start, a hot start
tại : https://developer.android.com/topic/performance/vitals/launch-time#cold nhé
2. Các yếu tố và cơ chế của Splash
- Các phần tử của
Splash Screen
được xác định bởi các tệp tài nguyên XML trongAndroid Manifest
. Có các phiên bản chế độlight
vànight
cho mỗi loại.
Chúng bao gồm background, logo ứng dụng động và backgroundLogo: *Lưu ý các yếu tố sau đây:
- Logo ứng dụng (1) phải là dạng vectơ có thể vẽ được và nó có thể ở dạng tĩnh hoặc động. Mặc dù hoạt ảnh có thể có thời lượng không giới hạn, nhưng mình khuyên bạn không nên vượt quá 1.000 mili giây.
- Logo (2) là tùy chọn và hữu ích nếu cần thêm độ tương phản giữa logo và màn hình. Nếu bạn sử dụng logo phù hợp, nền của nó sẽ được hiển thị nếu có đủ độ tương phản với màn hình.
- Như với các biểu tượng phù hợp, nó sẽ là ⅓ của màn hình cho trước bị che đi (3).
Window background
(4) chỉ có một màu mờ đục. NếuWindow background
được đặt và là màu sáng, thì nó sẽ được sử dụng theo mặc định nếu thuộc tính không setup.
*Cơ chế hoạt động của Splash Screen
bao gồm action out và in:
- Action in bao gồm chế độ xem hệ thống đến
Splash Screen
. Điều này được kiểm soát bởi hệ thống và không thể custom. - Action out bao gồm action hiden
Splash Screen
. Nếu bạn muốn tùy chỉnh nó , bạn sẽ có quyền truy cậpSplashScreenView
và logo của nó và có thể chạy bất kỳ action nào trên chúng, với các cài đặt về biến đổi, độ mờ và màu sắc. Trong trường hợp đó,Splash Screen
cần phải được xóa theo cách thủ công khi action được thực hiện xong.
3. Tùy chỉnh Splash Screen
- Theo mặc định,
SplashScreen
sử dụngwindowBackground
theme của bạn nếu đó là một màu duy nhất vàlauncher icon
. Việc tùy chỉnhSplash Screen
được thực hiện bằng cách thêm các thuộc tính vào theme app.
Splash Screen
của ứng dụng bạn có thể được tùy chỉnh theo bất kỳ cách nào sau đây:
- Đặt thuộc tính
theme
để thay đổi client. - Giữ nó trên màn hình trong một thời gian dài hơn(tối đa 1s như mình đề cập ban đầu)
- Tùy chỉnh action để loại bỏ
Splash Screen
Đặt Theme cho Splash Screen để thay đổi giao diện của nó
- Bạn có thể chỉ định các thuộc tính sau trong
attributes in your Activity theme
của mình để tùy chỉnhSplash Screen
cho ứng dụng của mình. Nếu bạn đã làm bước trên rồi thì hãy thực hiện như sau tạiSplash Screen
sử dụng các thuộc tính nhưandroid:windowBackground
, hãy xem xét và implement thư viện cần thiết choAndroid 12
nhé.
-
Sử dụng
windowSplashScreenBackground
để setBackground bằng một màu cụ thể:<item name="android:windowSplashScreenBackground">@color/...</item>
-
Sử dụng
windowSplashScreenAnimatedIcon
để thay thế một logo ngay giữa màn hình. Nếu logo có thể có animation và có thể vẽ quaAnimationDrawable
vàAnimatedVectorDrawable
, nó cũng sẽ phát action trong khi hiển thị window start.<item name="android:windowSplashScreenAnimatedIcon">@drawable/...</item>
-
Sử dụng
windowSplashScreenAnimationDuration
để đặt khoảng thời gianSplash Screen
xuất hiện trước khi nó bị loại bỏ. Thời gian tối đa là1.000 ms
. -
Sử dụng
windowSplashScreenIconBackground
để đặt background đằng sau logo củaSplash Screen
. Điều này rất hữu ích nếu không có đủ độ tương phản giữawindows background
và logo.<item name=”android:windowSplashScreenIconBackground”>@color/...</item>
-
Theo tùy chọn, bạn có thể sử dụng
windowSplashScreenBrandingImage
để đặt hình ảnh được hiển thị ở cuốiSplash Screen
. Các nguyên tắc thiết kế khuyên bạn không nên sử dụng hình ảnh thương hiệu. Để tránh bị đánh bản quyền nhé<item name=”android:windowSplashScreenBrandingImage”>@drawable/...</item>
Giữ màn hình Splash trên màn hình trong thời gian dài hơn
Splash Screen
sẽ bị loại bỏ ngay sau khi ứng dụng của bạn vẽ khung hình đầu tiên. Nếu bạn cần tải một lượng nhỏ dữ liệu, chẳng hạn như cài đặttheme
trong ứng dụng từ một ổ đĩa cục bộ không đồng bộ, bạn có thể sử dụngViewTreeObserver.OnPreDrawListener
cách tạm ngưng ứng dụng để vẽ khung hình đầu tiên của nó.
// Create a new event for the activity.
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
// Set the layout for the content view.
setContentView(R.layout.main_activity)
// Set up an OnPreDrawListener to the root view.
val content: View = findViewById(android.R.id.content)
content.viewTreeObserver.addOnPreDrawListener(
object : ViewTreeObserver.OnPreDrawListener {
override fun onPreDraw(): Boolean {
// Check if the initial data is ready.
return if (viewModel.isReady) {
// The content is ready; start drawing.
content.viewTreeObserver.removeOnPreDrawListener(this)
true
} else {
// The content is not ready; suspend.
false
}
}
}
)
}
Tùy chỉnh hoạt ảnh để loại bỏ màn hình Splash
- Bạn có thể tùy chỉnh thêm hoạt ảnh của
Splash Screen
thông quaActivity.getSplashScreen
.
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
// ...
// Add a callback that's called when the splash screen is animating to
// the app content.
splashScreen.setOnExitAnimationListener { splashScreenView ->
// Create your custom animation.
val slideUp = ObjectAnimator.ofFloat(
splashScreenView,
View.TRANSLATION_Y,
0f,
-splashScreenView.height.toFloat()
)
slideUp.interpolator = AnticipateInterpolator()
slideUp.duration = 200L
// Call SplashScreenView.remove at the end of your custom animation.
slideUp.doOnEnd { splashScreenView.remove() }
// Run your animation.
slideUp.start()
}
}
- Khi bắt đầu gọi lại này, vector động có thể vẽ trên
Splash Screen
đã bắt đầu. Tùy thuộc vào thời gian khởi chạy ứng dụng, tệp có thể vẽ có thể nằm ở giữa hoạt ảnh của nó. Sử dụngSplashScreenView.getIconAnimationStartMillis
để biết khi action bắt đầu. Bạn có thể tính thời lượng còn lại của action logo như sau:
// Get the duration of the animated vector drawable.
val animationDuration = splashScreenView.iconAnimationDurationMillis
// Get the start time of the animation.
val animationStart = splashScreenView.iconAnimationDurationMillis
// Calculate the remaining duration of the animation.
val remainingDuration = (
animationDuration - (SystemClock.uptimeMillis() - animationStart)
).coerceAtLeast(0L)
4. Kết luận
- Như vậy các bạn có thể áp dụng và demo thử
Splash
này trên Android 12 Beta nhé, chúc các bạn thành công xem thêm và hiểu hơn về Splash củaandroid 12
tại web develop nha các bạn - Source: https://developer.android.com/about/versions/12/features/splash-screen