Skip to content

Remote Controller Signal Widget

Cristina Suciu edited this page Dec 23, 2020 · 2 revisions

The remote controller signal widget shows the strength of the signal between the remote controller and the aircraft for all types of RCs. By default, an icon with 5 vertical bars represents the current signal strength between the RC and the aircraft.

The RC icon also changes color based on the connectivity status of the product. By default, it turns gray if the product is disconnected, and turns white if the product is connected.

Usage

If creating the remote controller signal 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 DUXBetaRemoteControllerSignalWidget. From here you can create the constraints on the container view using the RC Signal Widget's widgetSizeHint property.

Customizations

The RC Signal Widget supports customization of its icon, bars levels and text. An example of a customized rc signal widget could look something like this:

To get this effect we would use the following code:

Swift

rcWidget.connectedTintColor = UIColor.black
rcWidget.disconnectedTintColor = UIColor.red
rcWidget.setImage(UIImage.init(named: "customSignal0")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level0)
rcWidget.setImage(UIImage.init(named: "customSignal1")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level1)
rcWidget.setImage(UIImage.init(named: "customSignal2")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level2)
rcWidget.setImage(UIImage.init(named: "customSignal3")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level3)
rcWidget.setImage(UIImage.init(named: "customSignal4")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level4)
rcWidget.setImage(UIImage.init(named: "customSignal5")!, forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel.level5)
rcWidget.remoteControllerWidgetIcon = UIImage.init(named: "customRCIcon")!.withRenderingMode(UIImage.RenderingMode.alwaysTemplate)

Objective C

self.connectedTintColor = [UIColor blackColor];
self.disconnectedTintColor = [UIColor redColor];
[self setImage:[UIImage imageNamed:@"customSignal0"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel0];
[self setImage:[UIImage imageNamed:@"customSignal1"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel1];
[self setImage:[UIImage imageNamed:@"customSignal2"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel2];
[self setImage:[UIImage imageNamed:@"customSignal3"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel3];
[self setImage:[UIImage imageNamed:@"customSignal4"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel4];
[self setImage:[UIImage imageNamed:@"customSignal5"] forRemoteControllerBarLevel: DUXBetaRemoteSignalBarsLevel5];
self.remoteControllerWidgetIcon = [[UIImage named:@"customRCIcon"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];

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)setImage:(UIImage *)image forRemoteControllerBarLevel:(DUXBetaRemoteSignalBarsLevel)level; - Set the image for the signal strength level.

  • - (UIImage *)imageForBarLevel:(DUXBetaRemoteSignalBarsLevel)level; - Get the image for the signal strength level.

  • @property (nonatomic, strong) UIImage *remoteControllerWidgetIcon; - The icon that represents the remote controller.

  • @property (nonatomic, strong) UIColor *disconnectedTintColor; - The color of the icon when disconnected from product.

  • @property (nonatomic, strong) UIColor *connectedTintColor; - The color of the icon when connected from product.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The remote controller signal widget provides the following hooks:

  1. RemoteControllerSignalModelState - Provides hooks in events received by the widget from the widget model.
  • + (instancetype)productConnected:(BOOL)isConnected; - Event when product is connected or disconnected.
  • + (instancetype)remoteControllerSignalQualityUpdated:(NSInteger)signalQuality; - Event when signal quality is updated.
Clone this wiki locally