如何获得可在Android Studio模拟器上使用的android通知徽章/应用程序图标徽章? (反应本机应用程序)

时间:2018-07-12 16:55:05

标签: android react-native notifications android-notifications react-native-android

如何配置应用程序图标标记以在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

0 个答案:

没有答案