CODEWITHSUNDEEP
maui
Matthew Pans
Matthew Pans

Reputation: 839

MAUI: How to add splash screen in android platform

I am trying to add splash screen on my new MAUI application. I tried the implementation on this blog but the image is in circle (Android 12 device) and only showing black and white color on the icon. Is there anyway to show the real color of the icon on the splash screen?

As per this thread, there are certain rules for the splash icon in MAUI. But I need the entire icon (my icon is in rectangle) in my UI with its real color. So I am trying the platform specific approach.

As per the Platform-specific configuration on this blog I have created values and drawable folders under Resources folder and added maui_colors.xml and maui_splash_image.xml.

I have added the splashscreen code like below:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap
            android:gravity="fill_horizontal|fill_vertical"
            android:src="@drawable/ic_splash_xx"/>
    </item>
</layer-list>

But after this also the MAUI SVG splash is showing on the UI. Do I need to delete the SVG icons from the splash folder for the proper working. Also do we need both files in both folders(values and drawable folders)?

Upvotes: 0

Views: 3789

Answers (2)

THENETSPIDER
THENETSPIDER

Reputation: 347

May be Below suggestions could help:

1. You are seeing Default MAUI Icon may be because you have not changed path of Splash Icon in your .csproj file, in the file find the Below line:

<MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#512BD4" BaseSize="128,128" />

Here You can specify Path of your Icon, Background Color for your Spalsh & Size of Spalsh Icon.

2. Check Your SVG icon fits in a circle Ratio, You can do this by Placing your icon in a circle and making sure that the rectangle Larger side fits into the circle. Now Take Length/Width of Circle as base and and place icon in the bas square.

3. Try creating a fresh MAUI project, and check if these problems are still there.

If you are still stuck, Please share steps to reproduce, and also your SVG file.

Hope this Helps

Upvotes: 0

Liyun Zhang - MSFT
Liyun Zhang - MSFT

Reputation: 14469

Since android 12.0, google used the splash screen api to display the splash screen. And accoring to the official document about the elements and mechanics of the splash screen, you will see the the icon is circular. If you want to display an rectangle icon, you may need to use a circle to round it.

But after this also the MAUI SVG splash is showing on the UI.

This is because you still used <MauiSplashScreen Include="Resources\Splash\splashscreen.svg", in the csproj file.

If you want to change the splash screen's image and background color, the official document you read has shown the steps to do that:

  1. Put your image file in the Resource\Splash folder and set its build action as MauiSplashScreen.
  2. Change the code about <MauiSplashScreen> in the csproj file(use your image file and set the color your want).

And you can still refer to this case about customing splash screen in the maui.

Upvotes: 1

Related Questions