如何配置应用程序图标标记以在React Native应用程序的上下文中工作,并与某种Android模拟器一起工作(我知道这仅适用于某些设备)。
示例,其中gmail在其应用程序图标徽章中显示62条新电子邮件: https://static1.squarespace.com/static/559ca9fce4b0015f541296e6/t/597ae902197aeafed282e5b7/1501227280088/action_launcher_unread_badges_with_notification_preview.png?format=1500w
我相信我的代码正确,但是它不能与我使用的仿真器一起使用。这是我正在使用的代码:
BadgesModule.java:
```
package com.myapp.badges;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import me.leolin.shortcutbadger.ShortcutBadger;
public class BadgesModule extends ReactContextBaseJavaModule {
private final ReactApplicationContext reactContext;
/* constructor */
public BadgesModule(ReactApplicationContext reactContext) {
super(reactContext);
this.reactContext = reactContext;
}
@Override
public String getName() {
return "BadgesModule";
}
@ReactMethod
public void applyCount(){
ShortcutBadger.applyCount(reactContext, 3);
}
}
```
BadgesPackage.java: ```
package com.myapp.badges;
import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.JavaScriptModule;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
public class BadgesPackage implements ReactPackage {
@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
return Collections.emptyList();
}
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
List<NativeModule> modules = new ArrayList<>();
modules.add(new BadgesModule(reactContext));
return modules;
}
// Deprecated from RN 0.47
public List<Class<? extends JavaScriptModule>> createJSModules() {
return Collections.emptyList();
}
}
```
MainApplication.java:
```
package com.myapp;
import android.app.Application;
import com.facebook.react.ReactApplication;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.myapp.badges.*;
import java.util.Arrays;
import java.util.List;
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
protected String getJSBundleFile() {
return CodePush.getJSBundleFile();
}
@Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new RNHockeyAppPackage(MainApplication.this),
new MainReactPackage(),
new VectorIconsPackage(),
new MapsPackage(),
new RNI18nPackage(),
new LocationPackage(),
new BadgesPackage(),
new RNFusedLocationPackage(),
new CodePush(null, getApplicationContext(), BuildConfig.DEBUG)
);
}
@Override
protected String getJSMainModuleName() {
return "index";
}
};
@Override
public ReactNativeHost getReactNativeHost() {
return mReactNativeHost;
}
@Override
public void onCreate() {
super.onCreate();
SoLoader.init(this, /* native exopackage */ false);
}
}
```
App.js:
```
...
import { NativeModules, } from 'react-native';
class App extends Component{
...
componentDidMount(){
NativeModules.BadgesModule.applyCount()
}
...
render(){...}
}
```
我使用的仿真器是: Galaxy Nexus API 27 Nexus 5X API 28 Nexus 6 API 27 Pixel 2 XL API 26