Max Flight Distance List Item Widget

Max Flight Distance List Item Widget is an EDIT BUTTON type of widget which will display the current value of the maximum flight distance up to which the drone is restricted to fly. The widget also provides functionality to modify this value. The user can tap on the value and edit it in the permitted range. The permitted range is shown next to the edit field as a hint. The success or failure of setting the value will be shown to the user via a toast message. The maximum flight restriction can be disabled using the disable button. When the restriction is disabled the widget will only show a button to enable it.

The widget will show values in feet instead of meters when the unit mode is Imperial. This can be achieved using Unit Mode List Item Widget.

Following are examples of the widget states:

Disconnected

Disabled

Normal

Out of range

Beginner Mode

Usage

<dji.ux.beta.core.panel.listitem.maxflightdistance.MaxFlightDistanceListItemWidget
     android:layout_width="match_parent"
     android:layout_height="wrap_content"/>

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. The widget supports all the customizations that its parent EDIT BUTTON supports.

XML Example

<dji.ux.beta.core.panel.listitem.maxflightdistance.MaxFlightDistanceListItemWidget
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@color/white"
     app:uxsdk_list_item_button_background="@drawable/button_background_selector"
     app:uxsdk_list_item_edit_background="@drawable/edit_background_selector"
     app:uxsdk_list_item_disconnected_color="@color/dark_gray"
     app:uxsdk_list_item_normal_color="@color/blue"
     app:uxsdk_list_item_hint_text_color="@color/black"
     app:uxsdk_list_item_title_text_color="@color/black"
     app:uxsdk_list_item_icon_color="@color/black"/>

Attributes

List of the customizable XML attributes

uxsdk_toast_messages_enabled - The flag for enabling or disabling toast messages.
uxsdk_enable_action_button_string - The string for the button for action of enabling flight restriction.
uxsdk_disable_action_button_string - The string for the button for action of disabling flight restriction.

Java Example

MaxFlightDistanceListItemWidget maxFlightDistanceListItemWidget = new MaxFlightDistanceListItemWidget(this);
maxFlightDistanceListItemWidget.setBackgroundColor(getResources().getColor(R.color.white));
maxFlightDistanceListItemWidget.setListItemEditTextBackground(getResources().getDrawable(R.drawable.edit_background_selector));
maxFlightDistanceListItemWidget.setDisconnectedValueColor(getResources().getColor(R.color.dark_gray));
maxFlightDistanceListItemWidget.setNormalValueColor(getResources().getColor(R.color.blue));
maxFlightDistanceListItemWidget.setListItemHintTextColor(getResources().getColor(R.color.black));
maxFlightDistanceListItemWidget.setListItemButtonBackground(getResources().getDrawable(R.drawable.button_background_selector));
maxFlightDistanceListItemWidget.setListItemTitleIconColor(getResources().getColor(R.color.black));
maxFlightDistanceListItemWidget.setListItemTitleTextColor(getResources().getColor(R.color.black));

Kotlin Example

val maxFlightDistanceListItemWidget = MaxFlightDistanceListItemWidget(this)
maxFlightDistanceListItemWidget.setBackgroundColor(resources.getColor(R.color.white))
maxFlightDistanceListItemWidget.listItemEditTextBackground = resources.getDrawable(R.drawable.edit_background_selector)
maxFlightDistanceListItemWidget.disconnectedValueColor = resources.getColor(R.color.dark_gray)
maxFlightDistanceListItemWidget.normalValueColor = resources.getColor(R.color.blue)
maxFlightDistanceListItemWidget.listItemHintTextColor = resources.getColor(R.color.black)
maxFlightDistanceListItemWidget.listItemButtonBackground = resources.getDrawable(R.drawable.button_background_selector)
maxFlightDistanceListItemWidget.listItemTitleIconColor = resources.getColor(R.color.black)
maxFlightDistanceListItemWidget.listItemTitleTextColor = resources.getColor(R.color.black)

APIs

List of the customization APIs

var toastMessagesEnabled: Boolean - The flag used to enable or disable toast messages in the widget.
var enableActionButtonString: String - The string for the button for action of enabling flight restriction.
var disableActionButtonString: String - The string for the button for action of disabling flight restriction.

Hooks

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

ModelState - Provides hooks in events received by the widget from the widget model.
- data class ProductConnected(val isConnected: Boolean) : ModelState() - Event when the product is connected or disconnected.
- data class MaxFlightDistanceStateUpdated(val maxFlightDistanceState: MaxFlightDistanceState) : ModelState() - Event when the max flight distance state is updated.
- object SetMaxFlightDistanceSuccess : ModelState() - Event when setting the max flight distance value is successful.
- data class SetMaxFlightDistanceFailed(val error: UXSDKError) : ModelState() - Event when setting the max flight distance value fails.

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 EditStarted : UIState() - Event when the edit text is tapped for editing.
- object EditFinished : UIState() - Event when the user completes inputting the value and hits done.
- object ButtonClicked : UIState() - Event when a button is clicked.

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

DJI UX SDK Version 5 Beta 5