react-native-altering-app-icon
v1.0.7
Published
Dynamically change the app icon on iOS in React Native"
Downloads
21
Maintainers
Readme
React Native Alterning App Icon
Dynamically change the App Icon on iOS in your React Native App.
Table of Contents
Install
$ yarn add react-native-altering-app-icon
or with npm
$ npm i react-native-altering-app-icon
Link Package
$ react-native link react-native-altering-app-icon
Add alternate icons
- Create a folder within your Xcode project. (
NameOfYourProject/NameOfYourApp/AlteringIcons
). - Add the icons you want to change between to that folder. Follow the usual naming convention (
[email protected], [email protected]
). - If you create the folder from the finder, make sure to create a folder reference in Xcode.
Adjust your info.plist
Copy the following to your info.plist
and adjust it as needed. Omit the file extension (and @2x
) part, Xcode will pick them accordingly. You can add more alternate icons by copying the an alternate block.
<key>CFBundleIcons</key>
<dict>
<key>CFBundleAlternateIcons</key>
<dict>
<key>default</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>AppIcons/Icon-60</string>
</array>
<key>UIPrerenderedIcon</key>
<false/>
</dict>
<key>alternate</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>AppIcons/Icon-60_alternate</string>
</array>
<key>UIPrerenderedIcon</key>
<false/>
</dict>
<key>CFBundlePrimaryIcon</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>AppIcons/Icon-60</string>
</array>
</dict>
</dict>
</dict>
Usage
import DynamicIcons from 'react-native-altering-app-icon';
DynamicIcons.dynamicAppIconSupported() // Returns false on Android
.then((supportsDevice: boolean) => {
// Do stuff
});
DynamicIcons.switchAppIcon('alternate'); // Key you set in your in your info.plist
DynamicIcons.switchAppIcon(null); // Switch back to the default Icon
DynamicIcons.getIconName(result => alert( 'Icon name: ' + result.iconName));
Api
switchAppIcon(key: string)
To change the app icon call this method with one of the alternate app icons keys specified in your plist.info
. To reset to the default app icon pass null
.
dynamicAppIconSupported()
Returns a promise which resolves to a boolean. Always false on android
getIconName(callback(result))
Returns a callback with an object containing the icon name. Example: {iconName: 'default'}
.