Exciting news!Announcing our $4.6M Series Seed. Learn more
Socket
LoveBlogFAQ
Install
Log in

@hawkrives/react-native-alternate-icons

Package Overview
Dependencies
0
Maintainers
1
Versions
12
Issues
File Explorer

Advanced tools

@hawkrives/react-native-alternate-icons

React Native Alternate Icons for iOS 10.3+

    0.6.0latest

Version published
Maintainers
1
Yearly downloads
9,120
increased by84.39%

Weekly downloads

Readme

Source

react-native-alternate-icons

React Native Alternate Icons for iOS 10.3+

Requirements

  • React Native 0.44+ (only tested on 0.44)

Installation

npm install @hawkrives/react-native[email protected] --save react-native link

Manual Linking

https://facebook.github.io/react-native/docs/linking-libraries-ios.html

Preparation & Code Sample

Preparation

Add your icons into your Xcode Project

Icons in your Xcode Project

Add the following code to your info.plist

<key>supportsAlternateIcons</key> <true/> <key>CFBundleIcons</key> <dict> <key>CFBundlePrimaryIcon</key> <dict> <key>CFBundleIconFiles</key> <array> <string>icon_filename</string> </array> <key>UIPrerenderedIcon</key> <true/> </dict> <key>CFBundleAlternateIcons</key> <dict> <key>icon_type_alternate_name</key> <dict> <key>CFBundleIconFiles</key> <array> <string>alternate_icon_filename</string> </array> <key>UIPrerenderedIcon</key> <true/> </dict> </dict> </dict>

Using in your React Native applications

  • setIconName(name: string): Promise<void> – takes one of the icon "names" defined in your Info.plist (icon_type_alternate_name, in the example above)
  • getIconName(): Promise<string> – returns the current icon's name
  • reset(): Promise<void> – resets the icon to the default bundle icon
  • isSupported(): Promise<boolean> – checks if the current devide is supported. Always returns false on Android.

Because these all return promises, you can use them with ES2016's async/await syntax, too!

For example, you can import all of the functions as a namespace:

import * as Icons from '@hawkrives/react-native-alternate-icons'; await Icons.setIconName(iconName);

or import just one or two of them:

import {getIconName} from '@hawkrives/react-native-alternate-icons'; await getIconName();

Keywords

Socket

Product

Subscribe to our newsletter

Get open source security insights delivered straight into your inbox. Be the first to learn about new features and product updates.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc