Battery Widget - dji-sdk/Mobile-UXSDK-Beta-iOS GitHub Wiki

The battery widget is used to monitor the state of the Aircraft's battery or batteries. It has multiple appearances based on the type of product connected as well as the status of the battery.

Battery states are as follows:

  • DUXBetaBatteryStatusNormal- The battery is operating correctly and is safe to fly.
  • DUXBetaBatteryStatusWarningLevel1 - The battery level is below the threshold for returning home.
  • DUXBetaBatteryStatusWarningLevel2 - The battery level is below the threshold for landing immediately.
  • DUXBetaBatteryStatusOverheating - The battery temperature is above a safe threshold.
  • DUXBetaBatteryStatusError- The battery has an issue.
  • DUXBetaBatteryStatusUnknown - The state of the battery is not known (or is currently being loaded).

Unknown State / Initialization / Disconnect

Normal

Low Battery / Warning Level 1

Low Battery / Warning Level 2

Battery Error

Overheating

Normal

Low Battery / Warning Level 1

Low Battery / Warning Level 2

Overheating

Usage

If creating the battery widget through code it can be added using the convenience method:

- (void)installInViewController:(nullable UIViewController *)viewController

If creating the widget through storyboard use the object library to drag a container view controller into the desired view controller like so:

Following this make sure to change the class of the child view controller to be DUXBetaBatteryWidget. From here you can create the constraints on the container view using the Battery Widget's widgetSizeHint property. You can also implement the Battery Widget's delegate method - (void)batteryWidgetChangedDisplayState:(DUXBetaBatteryWidgetDisplayState)newState; to get update constraints when the widget changes state.

Customizations

The Battery Widget supports customization of its icon as well as text. An example of a customized battery widget showing the battery is in a normal state could look something like this:

To get this effect we would use the following code:

Swift

batteryWidget.setColor(UIColor.green, for: .normal)
batteryWidget.setImage(UIImage.init(named: "Test")!, forSingleBatteryStatus: .normal)

Objective C

[batteryWidget setColor:UIColor.greenColor forBatteryStatus:DUXBetaBatteryStatusNormal];
[batteryWidget setImage[UIImage imageNamed:@"Test"] forSingleBatteryStatus:DUXBetaBatteryStatusNormal];

The widget can be customized by the user to serve their purpose and theme with the following methods and properties:

Full list of methods and properties

List of customization methods and properties

  • - (void)setVoltageColor:(UIColor *)color forBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Set the color of the battery widget voltage text for the battery status.

  • - (void)setPercentageColor:(UIColor *)color forBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Set the color of the battery widget percentage text for the battery status.

  • - (UIColor *)getPercentageColorForBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Get the color of the battery widget percentage text for the battery status.

  • - (UIColor *)getVoltageColorForBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Get the current color for the battery status.

  • - (void)setImage:(UIImage *)image forSingleBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Set the image of the battery widget when it is displaying a single battery's information.

  • - (UIImage *)getImageForSingleBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Get the current image for when the widget is displaying a single battery's information.

  • - (void)setImage:(UIImage *)image forDualBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Set the image of the battery widget when it is displaying dual battery information.

  • - (UIImage *)getImageForDualBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Get the current image for when the widget is displaying a dual battery information.

  • - (void)setTintColor:(UIColor *)color forBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Set the tint color for the widget icon for the battery status.

  • - (UIColor *)getTintColorForBatteryStatus:(DUXBetaBatteryStatus)batteryStatus; Get the tint color for the widget icon for the battery status.

  • @property (nonatomic, strong) UIFont *percentageFontSingle; The font for the battery percentage in single battery state.

  • @property (nonatomic, strong) UIFont *percentageFontDual; The font for the battery percentage in dual battery state.

  • @property (nonatomic, strong) UIFont *voltageFontDual; The font for the battery voltage in dual battery state.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The Battery Widget provides the following hooks:

  1. BatteryWidgetModelState - Provides hooks for events received by the widget from the widget model.
  • + (instancetype)productConnected:(BOOL)isConnected; - Event when product is connected or disconnected.
  • + (instancetype)batteryStateUpdated:(DUXBetaBatteryState *)batteryState; - Event when the battery widget state changes.
  1. BatteryWidgetUIState - Provides hooks for events received by the widget from user interactions.
  • + (instancetype)widgetTapped; - Event when user taps the widget.

DJI UX SDK Version 5 Beta 4.1

⚠️ **GitHub.com Fallback** ⚠️