Simulator Indicator Widget

Simulator Indicator Widget will display the current state of the simulator. Simulator Indicator Widget has two states

Disconnected - Gray icon indicates that product is currently disconnected
Active - Green icon indicates simulator is currently running on the device
Inactive - White icon indicates simulator is currently turned off on the device

Usage

<dji.ux.beta.core.widget.simulator.SimulatorIndicatorWidget
   android:id="@+id/widget_simulator_indicator"
   android:layout_width="50dp"
   android:layout_height="50dp" />

The ideal dimension ratio for this widget is 1:1.

Customizations

The UI elements can be customized to match the style of the user's application. The customizations can be done using attributes in XML or programmatically using the APIs.

XML Example

<dji.ux.beta.core.widget.simulator.SimulatorIndicatorWidget
        android:id="@+id/widget_simulator_indicator"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:padding="@dimen/topbar_padding"
        app:uxsdk_simulatorActiveDrawable="@drawable/ic_sim_on"
        app:uxsdk_simulatorInactiveDrawable="@drawable/ic_sim_off"/>

Attributes

List of the customizable XML attributes

uxsdk_simulatorActiveDrawable - The drawable used when the simulator is running
uxsdk_simulatorInactiveDrawable - The drawable used when the simulator is not running
uxsdk_iconBackground - The drawable used for the background of the widget icon
uxsdk_connectedStateIconColor - The color used for icon when in connected state
uxsdk_disconnectedStateIconColor - The color used for icon when in disconnected state
uxsdk_onStateChange - The ID of the Simulator Control Widget that should react when this widget is tapped.

Java Example

SimulatorIndicatorWidget simulatorIndicatorWidget = findViewById(R.id.widget_simulator_indicator);
simulatorIndicatorWidget.setSimulatorInactiveDrawable(getResources().getDrawable(R.drawable.ic_sim_off));
simulatorIndicatorWidget.setSimulatorActiveDrawable(getResources().getDrawable(R.drawable.ic_sim_on));

Kotlin Example

val simulatorIndicatorWidget: SimulatorIndicatorWidget = findViewById(R.id.widget_simulator_indicator)
simulatorIndicatorWidget.simulatorActiveDrawable = resources.getDrawable(R.drawable.ic_sim_on)
simulatorIndicatorWidget.simulatorInactiveDrawable = resources.getDrawable(R.drawable.ic_sim_off)

APIs

List of the customization APIs

var simulatorActiveIcon: Drawable? - Icon drawable for simulator in active state.
fun setSimulatorActiveIcon(@DrawableRes resourceId: Int) - Set the icon resource for simulator in active state.
var simulatorInactiveIcon: Drawable? - Icon drawable for simulator in inactive state.
fun setSimulatorInactiveIcon(@DrawableRes resourceId: Int) - Set the icon resource for simulator in inactive state.
@ColorInt var connectedStateIconColor: Int - Color of icon when drone is connected.
@ColorInt var disconnectedStateIconColor: Int - Color of icon when drone is disconnected.
var iconBackground: Drawable? - Background of the simulator state icon.
fun setIconBackground(@DrawableRes resourceId: Int) - Set the background of the simulator state icon.
var stateChangeCallback: OnStateChangeCallback<Any>? - The interface to react to the tapping of the widget.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The Simulator Indicator widget provides two types of hooks

ModelState - Provides hooks in events received by the widget from the widget model.
- data class ProductConnected(val isConnected: Boolean) : ModelState() - Event when product is connected or disconnected.
- data class SimulatorStateUpdated(val isActive: Boolean) : ModelState() - Event when simulator state is updated.

The user can subscribe to this using public override fun getWidgetStateUpdate(): Flowable<ModelState>.

UIState - Provides hooks in events related to user interaction with the widget.
- object WidgetClicked : UIState() - Event when widget is clicked.

The user can subscribe to this using fun getUIStateUpdates(): Flowable<UIState>.

DJI UX SDK Version 5 Beta 5