[Cocos Creator][Android] Cách tích hợp Splash Screen vào Cocos

Từ Android 12, Google đã bắt đầu hỗ trợ API giúp việc tích hợp Splash Screen vào Cocos Creator dễ dàng hơn. Sau khi build app bằng Cocos Creator, mở dự án bằng Android Studio rồi tiến hành các bước sau:

1. Sửa file proj.android-studio/app/build.gradle

//thêm vào cuối file
implementation 'androidx.core:core-splashscreen:1.1.0-alpha02'

2. Sửa file proj.android-studio/app/AndroidManifest.xml

//Thay thế
android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
//bằng
android:theme="@style/Theme.App.Starting"

3. Tạo file proj.android-studio/res/values/styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
   <color name="black">#000000</color>
   <drawable name="icon"></drawable>

   <style name="Theme.App.Starting" parent="Theme.SplashScreen">
      <!-- Set the splash screen background, animated icon, and animation duration. -->
      <item name="windowSplashScreenBackground">@color/black</item>

      <!-- Use windowSplashScreenAnimatedIcon to add either a drawable or an
           animated drawable. One of these is required. -->
      <item name="windowSplashScreenAnimatedIcon">@drawable/splash</item>
      <!-- Required for animated icons -->
      <item name="windowSplashScreenAnimationDuration">200</item>

      <!-- Set the theme of the Activity that directly follows your splash screen. -->
      <!-- Required -->
      <item name="postSplashScreenTheme">@android:style/Theme.NoTitleBar.Fullscreen</item>
   </style>
</resources>

4. Tạo file ảnh “splash.png”

Google yêu cầu ảnh splash screen không có background phải có kích thước 288×288 dp, nội dung ảnh phải nằm vừa trong vòng tròn có đường kính 192 dp. Để tính ra kích thước của ảnh theo đơn vị “px”, vào trang http://labs.rampinteractive.co.uk/android_dp_px_calculator/ hoặc https://www.pixplicity.com/dp-px-converter

Như vậy cần có 4 file ảnh với các kích thước px sau:

• mdpi: 288×288, nội dung phải nằm trong 192×192
• hdpi: 432×432, , nội dung phải nằm trong 288×288
• xhdpi: 576×576, nội dung phải nằm trong 384×384
• xxhdpi: 864×864, , nội dung phải nằm trong 576×576

Bỏ vào các đường dẫn sau:

• build/jsb-default/frameworks/runtime-src/proj.android-studio/res/drawable-mdpi/splash.png
• build/jsb-default/frameworks/runtime-src/proj.android-studio/res/drawable-hdpi/splash.png
• build/jsb-default/frameworks/runtime-src/proj.android-studio/res/drawable-xhdpi/splash.png
• build/jsb-default/frameworks/runtime-src/proj.android-studio/res/drawable-xxhdpi/splash.png

5. Sửa file proj.android-studio/app/src/org/cocos2dx/javascript/AppActivity.java

//thêm vào
import androidx.core.splashscreen.SplashScreen;
...
 @Override
    protected void onCreate(Bundle savedInstanceState) {
        // init SplashScreen, need to implement before super.onCreate()
        SplashScreen splashScreen = SplashScreen.installSplashScreen(this);
        ...
        // pause and wait for ad load 
        splashScreenWaitForAdLoad();
        ...
    }
...
private void splashScreenWaitForAdLoad() {
        final View content = findViewById(android.R.id.content);
        content.getViewTreeObserver().addOnPreDrawListener(
                new ViewTreeObserver.OnPreDrawListener() {
                    @Override
                    public boolean onPreDraw() {
                        // Check whether the initial data is ready.
                        if (appOpenAdManager.isAdAvailable()) {
                            // The content is ready. Start drawing.                            content.getViewTreeObserver().removeOnPreDrawListener(this);
                            // start showing ad
appOpenAdManager.showAdIfAvailable();
                            return true;
                        } else {
                            // The content isn't ready. Suspend.
                            return false;
                        }
                    }
                });
    }