Change your App Icon with Firebase Realtime Database — iOS Swift
Change the image regardless of the application version.
Imagine that you need to change the icon of your application for the Black Friday period, you go and change the icon normally, but it turns out that not everyone updates the application always, and many people will not even know that the icon has been changed, or worse , there are people who will use the Black Friday icon at Christmas 😱.
We cannot depend on updates!! To change the icon when we want we will need supportsAlternateIcons. Apple introduced this in iOS 10.3, that feature make possible for developers to offer App Icon customization to their users with predefined additional icons, and using that with Firebase Realtime Database we can change the icon when we want 🥳.
If your projects don’t use Firebase Realtime, use this guide.
Here are the 5 steps to add this cool feature to your App. Let’s get started.
Step 1: Add your App Icons
To get started, we need some icons. These should be placed loose in your project or in a group, rather than inside an asset catalogue. Remember to use the @2x and @3x naming convention to ensure iOS automatically picks the correct icon for users’ devices.
For this example, we’re using these example icon files:
- Icon-blue@2x.png, Icon-blue@3x.png
- Icon-red@2x.png, Icon-red@3x.png
They are all just regular PNGs, with the @2x being 120x120 and the @3x being 180x180.
Step 2: Register your new Icons in the Info.plist
First in Info.plist, add a new CFBundleIcons (this will change to "Icon files (iOS 5)"), then add another entry CFBundleAlternateIcons.
Inside CFBundleAlternateIcons add all alternate icon you have. For each alternate icon, add a new entry CFBundleIconFiles array, which is an array containing the filenames for your icon.
We can define the primary icon as in the image.
Here is the xml code added from info.plist:
Step 3: Configuring Firebase Realtime Database
Write data in the Firebase Realtime Database. Put iconName as a key and the icon name as a value.
Step 4: Create the class that will change the icon
1- Access the firebase database and get the value of the key iconName.
2- Take the obtained value and send it as a parameter to the setAppIcon function.
3- Inside the function, we will check if the icon obtained is the same as the current one, we will use UIApplication.shared.alternateIconName to check the current icon.
4- Let’s check if it is possible to change the cellphone icon using this UIApplication.shared.supportsAlternateIcons.
5- After verified, we will finally change the icon using UIApplication.shared.setAlternateIconName(name).
6- For some cases we will need to set the delay to work 100%.
Step 5: Using
It’s so easy, you just need to call class func validateAppIcon where you want.
See this project in the git:
That’s all, folks!! 😉
