Skip to content

Overview List Item Widget

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

Overview List Item Widget is a LABEL type of widget which will display the overall status of the drone. The color of the text changes depending on the severity of the status. Following are examples of the widget states:

Disconnected

Normal

Warning

Error

Usage

<dji.ux.beta.core.panel.listitem.overview.OverviewListItemWidget
     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.overview.OverviewListItemWidget
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="@color/white"
     app:uxsdk_list_item_title_text_color="@color/black"
     app:uxsdk_list_item_icon_color="@color/black"
     app:uxsdk_list_item_disconnected_color="@color/dark_gray"
     app:uxsdk_list_item_normal_color="@color/blue" />

Java Example

OverviewListItemWidget overviewListItemWidget = new OverviewListItemWidget(this);
overviewListItemWidget.setBackgroundColor(getResources().getColor(R.color.white));
overviewListItemWidget.setListItemTitleIconColor(getResources().getColor(R.color.black));
overviewListItemWidget.setListItemTitleTextColor(getResources().getColor(R.color.black));
overviewListItemWidget.setDisconnectedValueColor(getResources().getColor(R.color.dark_gray));
overviewListItemWidget.setNormalValueColor(getResources().getColor(R.color.blue));

Kotlin Example

val overviewListItemWidget = OverviewListItemWidget(this)
overviewListItemWidget.setBackgroundColor(resources.getColor(R.color.white))
overviewListItemWidget.listItemTitleIconColor = resources.getColor(R.color.black)
overviewListItemWidget.listItemTitleTextColor = resources.getColor(R.color.black)
overviewListItemWidget.disconnectedValueColor = resources.getColor(R.color.dark_gray)
overviewListItemWidget.normalValueColor = resources.getColor(R.color.blue)

Hooks

The widget provides hooks for the users to add functionality based on the state changes in the widget. The OverviewListItemWidget 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 OverviewStateUpdated(val overviewState: OverviewState) : ModelState() - Event when the status of the drone is updated.

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

Clone this wiki locally