Skip to content

Flight Mode List Item Widget

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

Flight Mode List Item Widget is a LABEL type of widget which will display the current FlightMode. Following are examples of the widget states:

Disconnected

Sport

Tripod

P-Atti

Usage

<dji.ux.beta.core.panel.listitem.flightmode.FlightModeListItemWidget
     android:id="@+id/flight_mode_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 LABEL widget supports.

XML Example

<dji.ux.beta.core.panel.listitem.flightmode.FlightModeListItemWidget
   android:id="@+id/flight_mode_list_item"
   android:layout_width="match_parent"
   android:background="@color/uxsdk_gray_58"
   app:uxsdk_list_item_title_text_color="@color/black"
   app:uxsdk_list_item_normal_color="@color/green"
   app:uxsdk_list_item_disconnected_color="@color/uxsdk_red"
   android:layout_height="wrap_content"/>

Java Example

FlightModeListItemWidget flightModeListItemWidget = findViewById(R.id.flight_mode_list_item);
flightModeListItemWidget.setListItemTitleTextColor(getResources().getColor(R.color.black));
flightModeListItemWidget.setBackgroundColor(getResources().getColor(R.color.uxsdk_gray_58));
flightModeListItemWidget.setNormalValueColor(getResources().getColor(R.color.uxsdk_green));
flightModeListItemWidget.setDisconnectedValueColor(getResources().getColor(R.color.uxsdk_red));

Kotlin Example

val flightModeListItemWidget = FlightModeListItemWidget(context)
flightModeListItemWidget.listItemTitleTextColor = resources.getColor(R.color.black)
flightModeListItemWidget.setBackgroundColor(resources.getColor(R.color.uxsdk_gray_58))
flightModeListItemWidget.normalValueColor = resources.getColor(R.color.uxsdk_green)
flightModeListItemWidget.disconnectedValueColor = resources.getColor(R.color.uxsdk_red)

Hooks

The widget provides hooks for the users to add functionality based on the state changes in the widget. The FlightModeListItemStateWidget 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 FlightModeUpdated(val flightModeText: String) : ModelState() - Event when the flight mode is updated.

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

Clone this wiki locally