When you create a new .NET MAUI project in VS2022, you automatically get an application icon and a splash screen. In this post, we will look at customising these.
The files are in the Resources folder, and the AppIcon and Splash folders within Resources. The files we will be looking at are:-
appicon.svg is simply a square box of the primary colour
appiconfg.svg looks blank, but actually contains ".NET" in white text
splash.svg is a square box containing ".NET" in white text
Simply launching the app that has been created, you will see the splash screen on the left, and when the app launches, you see the ".NET" icon and colour for the application icon.
We are going to change the splash screen and the application icon. So - where are they? If you search for "MauiIcon" you will find what we are going to change. They are found in the '.csproj' file.
We are going to have a splash screen of "Make A Quiz"
And application icon of:-
I had these files already as .png files, but there are many free sites allowing .png to .svg conversion. I used Visio to open the .png and then saved the file as .svg. After conversion, I copied the new .svg files into the \Resources\Appicon and \Resources\Splash folders. Remember that all file names MUST be in lower case.
I use a blue of #336699 for my 'corporate' colour - using it in Logos, and with white, as standard colours in my application. I wanted a background of white in my splash screen. The changes to the .csproj file are:-
Make sure you delete the app from your device, and clean the solution. All being well, you should see:-
For those of us who have used Xamarin in the past, this is SO much simpler. No longer do you have to populate loads of Android folders with different resolutions, and getting different sizes of icons for your iOS apps. Kudos to the .NET MAUI team for making life so much simpler - Thanks!