Skip to content

Max Altitude List Item Widget

Siddharth Utgikar edited this page Dec 22, 2020 · 3 revisions

Max Altitude List Item Widget is a EDIT type of widget which will display the current value of the maximum altitude that the drone is restricted to fly at. 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 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

Normal

Out of range

The modification of the maximum altitude value depends on the mode the of the drone and flight restrictions at the current location.

  1. Beginner Mode - If the drone has beginner (novice) mode enabled, the maximum altitude is restricted to 30m / 100ft. The user will not be able to edit this value while in this mode.

  1. Flight Restriction - If the current location of the drone falls under a flight restriction, the maximum altitude value cannot be modified over 120m / 400ft.

  1. Flight Restriction - If there is no flight restriction at the location the maximum altitude value can be modified over 120m / 400ft. The user will, however, be shown a dialog to accept responsibility for flying above the FAA 400-foot flight ceiling.

If the user modifies the maximum altitude value, to a value lower than the current Failsafe Return To Home Altitude, the Failsafe Return To Home Altitude will also be modified to that value. The user will be shown a dialog to confirm this action.

Usage

<dji.ux.beta.core.panel.listitem.maxaltitude.MaxAltitudeListItemWidget
     android:id="@+id/max_altitude_list_item"
     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 supports.

XML Example

<dji.ux.beta.core.panel.listitem.maxaltitude.MaxAltitudeListItemWidget
     android:id="@+id/max_altitude_list_item"
     android:background="@color/uxsdk_gray_58"
     app:uxsdk_list_item_title_text_color="@color/black"
     app:uxsdk_list_item_edit_text_normal_color="@color/green"
     app:uxsdk_list_item_edit_background="@drawable/custom_back"
     app:uxsdk_list_item_error_color="@color/uxsdk_yellow"
     app:uxsdk_list_item_dialog_theme="@style/UXSDKDialogCustomTheme"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"/>

The dialogs can be customized by using a custom theme.

<style name="UXSDKDialogCustomTheme" parent="Theme.AppCompat.Dialog.Alert">
   <item name="colorAccent">@color/uxsdk_red</item>
   <item name="android:background">@color/uxsdk_gray_58</item>
</style>

Attributes

List of the customizable XML attributes
  • uxsdk_list_item_dialog_theme - The style resource for theming the dialogs.
  • uxsdk_toast_messages_enabled - The flag for enabling or disabling toast messages.
  • uxsdk_list_item_confirmation_dialog_icon - The icon for confirmation dialog.
  • uxsdk_list_item_error_dialog_icon - The icon for error dialog.

Java Example

MaxAltitudeListItemWidget maxAltitudeListItem = findViewById(R.id.max_altitude_list_item);
maxAltitudeListItem.setBackgroundColor(getResources().getColor(R.color.uxsdk_gray_58));
maxAltitudeListItem.setListItemTitleTextColor(getResources().getColor(R.color.uxsdk_black));
maxAltitudeListItem.setErrorValueColor(getResources().getColor(R.color.uxsdk_yellow));
maxAltitudeListItem.setEditTextNormalColor(getResources().getColor(R.color.green));
maxAltitudeListItem.setDialogTheme(R.style.UXSDKDialogCustomTheme);
maxAltitudeListItem.setListItemEditTextBackground(getResources().getDrawable(R.drawable.custom_back));

Kotlin Example

val maxAltitudeListItem: MaxAltitudeListItemWidget = findViewById(R.id.max_altitude_list_item)
maxAltitudeListItem.setBackgroundColor(resources.getColor(R.color.uxsdk_gray_58))
maxAltitudeListItem.listItemTitleTextColor = resources.getColor(R.color.uxsdk_black)
maxAltitudeListItem.errorValueColor = resources.getColor(R.color.uxsdk_yellow)
maxAltitudeListItem.editTextNormalColor = resources.getColor(R.color.green)
maxAltitudeListItem.dialogTheme = R.style.UXSDKDialogCustomTheme
maxAltitudeListItem.listItemEditTextBackground = resources.getDrawable(R.drawable.custom_back)

APIs

List of the customization APIs
  • @StyleRes var dialogTheme: Int - The style resource for all the format dialogs.
  • var toastMessagesEnabled: Boolean - The flag used to enable or disable toast messages in the widget.
  • var confirmationDialogIcon: Drawable? - The icon for confirmation dialog.
  • var errorDialogIcon: Drawable? - The icon for error dialog.

Hooks

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

  1. 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 MaxAltitudeStateUpdated(val maxAltitudeState: MaxAltitudeState) : ModelState() - Event when the max altitude level state is updated.
    • object SetMaxAltitudeSucceeded : ModelState() - Event when setting the max altitude value is successful.
    • data class SetMaxAltitudeFailed(val error: UXSDKError) : ModelState() - Event when setting the max altitude value fails.

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

  1. 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.
    • data class DialogDisplayed(val info: Any?) : UIState() - Event when a dialog is displayed.
    • data class DialogActionConfirmed(val info: Any?) : UIState() - Event when the positive button on the dialog is clicked.
    • data class DialogActionCanceled(val info: Any?) : UIState() - Event when the negative button on the dialog is clicked.
    • data class DialogDismissed(val info: Any?) : UIState() - Event when a dialog is dismissed.

The info param is an instance of DialogType and can be used as a dialog identifier. Its types are

  • MaxAltitudeOverAlarmConfirmation - Dialog shown when max altitude is over alarm levels.
  • FlightLimitNeededError - Dialog shown when flight limit is restricted and the user tries to set a higher value.
  • ReturnHomeAltitudeUpdate - Dialog shown to confirm that the user will have to update return home altitude along with max flight limit.

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

Clone this wiki locally