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,
- 在XCode
中打开iOS项目
- 创建 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
在你的 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,
- 在 Android Studio 中打开 Android 项目
- 创建群组调用 BatteryStatus 并包含 2 个名为 BatteryStatusModule.java 和 BatteryStatusPackage.java
的文件
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();
}
}
里面MainApplication.java包括以下代码
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new MapsPackage(),
new BatteryStatusPackage()
);
}
在你的 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 模拟器上
我正在编写一个反应本机应用程序来获取 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,
- 在XCode 中打开iOS项目
- 创建 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
在你的 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,
- 在 Android Studio 中打开 Android 项目
- 创建群组调用 BatteryStatus 并包含 2 个名为 BatteryStatusModule.java 和 BatteryStatusPackage.java 的文件
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();
}
}
里面MainApplication.java包括以下代码
@Override protected List<ReactPackage> getPackages() { return Arrays.<ReactPackage>asList( new MainReactPackage(), new MapsPackage(), new BatteryStatusPackage() ); }
在你的 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()
.
DeviceInfo.getBatteryLevel().then(batteryLevel => {
// 0.759999
});
注:
Returns -1 在 iOS 模拟器上