React Native 使用本机模块获取电池状态/电量

React Native Get battery status / level Using Native Modules

我正在编写一个反应本机应用程序来获取 IOS 和 Android 电池状态。我在网上搜索,发现很少有库可以获得 phone 的电池电量。

https://github.com/robinpowered/react-native-device-battery

https://github.com/remobile/react-native-battery-status

https://github.com/oojr/react-native-battery

当我尝试这样做时,每个库都有问题,并且在 git 中心上提问时对开发人员的支持不多。

任何人都可以为我提供更好的解决方案或库来获取 IOS 和 Android 的电池状态。

提前致谢

我自己写了 IOS 和 Android 类 来获取电池状态。如果有人对此感兴趣,请按以下步骤操作,

对于IOS,

  1. 在XCode
  2. 中打开iOS项目
  3. 创建 2 个新文件调用 BatteryStatus.h 和 BatteryStatus.m

BatteryStatus.h 文件应包含以下代码

#import <Foundation/Foundation.h>
#import <React/RCTBridgeModule.h>
#import <React/RCTEventEmitter.h>

@interface BatteryStatus : RCTEventEmitter <RCTBridgeModule>
@end

BatteryStatus.m 文件应该

#import "BatteryStatus.h"

@implementation BatteryStatus
RCT_EXPORT_MODULE(BatteryStatus)

- (instancetype)init
{
 if ((self = [super init])) {

   [[UIDevice currentDevice] setBatteryMonitoringEnabled:YES];

 }
 return self;
}

RCT_EXPORT_METHOD(hide) {
}

RCT_EXPORT_METHOD(updateBatteryLevel:(RCTResponseSenderBlock)callback)
{
 callback(@[[self getBatteryStatus]]);
}

 //manually get battery status by calling following method

-(NSDictionary*)getBatteryStatus
{

 float batteryLevel = [UIDevice currentDevice].batteryLevel;

 NSObject* currentLevel = nil;

 currentLevel = [NSNumber numberWithFloat:(batteryLevel * 100)];

 NSMutableDictionary* batteryData = [NSMutableDictionary dictionaryWithCapacity:2];

 [batteryData setObject:currentLevel forKey:@"level"];
 return batteryData;

  }

@end
  1. 在你的 React Native 应用程序中,在你的 js 文件中添加以下代码

    import { NativeModules } from 'react-native';
    
    constructor(props) {
     super(props);
     this.state = {
     batteryLevel: null,
     };
    }
    
    componentDidMount() {
      NativeModules.BatteryStatus.updateBatteryLevel((info) => {
      //console.log(info.level)
      const level = Math.ceil(info.level);
      this.setState({ batteryLevel: level});
      });
    }
    

对于IOS,上面的代码正在为我获取电池电量

对于Android,

  1. 在 Android Studio 中打开 Android 项目
  2. 创建群组调用 BatteryStatus 并包含 2 个名为 BatteryStatusModule.java 和 BatteryStatusPackage.java
  3. 的文件

BatteryStatusModule.java 应包含以下代码

package com.yourproject.BatteryStatus;

import android.content.Intent;
import android.content.IntentFilter;
import android.os.BatteryManager;

import com.facebook.react.bridge.Callback;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;

public class BatteryStatusModule extends ReactContextBaseJavaModule  {
     public BatteryStatusModule(ReactApplicationContext reactContext) {

         super(reactContext);
     }

     @Override
     public String getName() {
    return "BatteryStatus";
}

@ReactMethod
public void getBatteryStatus(Callback successCallback) {
    Intent batteryIntent = getCurrentActivity().registerReceiver(null, new IntentFilter(Intent.ACTION_BATTERY_CHANGED));
    int level = batteryIntent.getIntExtra(BatteryManager.EXTRA_LEVEL, -1);
    int scale = batteryIntent.getIntExtra(BatteryManager.EXTRA_SCALE, -1);

    if(level == -1 || scale == -1) {
        level = 0;
    }
    //System.out.print("battery level");
    //System.out.print(level);
    successCallback.invoke(null ,((float)level / (float)scale) * 100.0f);
    }
 }

BatteryStatusPackage.java 应包含以下代码

 package com.yourproject.BatteryStatus;

 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 BatteryStatusPackage implements ReactPackage {
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
    List<NativeModule> modules = new ArrayList<>();

    modules.add(new BatteryStatusModule(reactContext));

    return modules;
}

@Override
public List<Class<? extends JavaScriptModule>> createJSModules() {
    return Collections.emptyList();
}

@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
    return Collections.emptyList();
}
}
  1. 里面MainApplication.java包括以下代码

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
            new MapsPackage(),
            new BatteryStatusPackage()
      );
    }
    
  2. 在你的 React Native 应用程序中,在你的 js 文件中添加以下代码

     import { NativeModules } from 'react-native';
    
     constructor(props) {
     super(props);
    
     this.state = {
       batteryLevel: null
     };
    }
    
    getBatteryLevel = (callback) => {
       NativeModules.BatteryStatus.getBatteryStatus(callback);
    }
    

6.Call 是这样的:

componentDidMount() {
 this.getBatteryLevel((batteryLevel) => {
   console.log(batteryLevel);
 });
}

对于Android,上面的代码正在为我获取电池电量

希望这会帮助一些人获得 IOS 和 ANDROID

的电池电量

只是对正确答案的补充。您必须覆盖 BatteryStatus.m 文件中的 'supportedEvents' 函数才能使其像这样工作:

-(NSArray<NSString *> *)supportedEvents{ 
  return @[@"level"];
}

我们可以使用 react-native-device-info 获取任何设备的特定信息。

使用命令安装

npm install --save react-native-device-info

通过 getBatteryLevel().

将设备的电池电量获取为介于 0 和 1 之间的浮点数
DeviceInfo.getBatteryLevel().then(batteryLevel => {
  // 0.759999
});

注:

Returns -1 在 iOS 模拟器上