Skip to content

RTK Widget

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

The RTK Widget controls and gets information related to RTK. It will only appear for products that are equipped with an RTK system.

The RTK Widget contains the following sub-widgets:

  • RTK Enabled Widget: Contains the widget header and a switch which enables or disables RTK.
  • RTK Satellite Status Widget: Contains all the information related to RTK. This includes coordinates and altitude of the aircraft and base station or network receiver, course angle, GLONASS, Beidou, Galileo, and GPS satellite counts for both antennas and the base station, and overall status of the RTK system.

Table of Contents

RTK Widget

This widget contains all sub-widgets in a scrollable view, as well as an "OK" button at the bottom which hides the widget when pressed.

When RTK is disabled the RTKSatelliteStatusWidget will be hidden and an informative message will be displayed in its place.

Usage

<dji.ux.beta.accessory.widget.rtk.RTKWidget
    android:id="@+id/widget_rtk"
    android:layout_width="500dp"
    android:layout_height="350dp" />

The ideal dimension ratio for this widget is 10:7.

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.accessory.widget.rtk.RTKWidget
    android:id="@+id/widget_rtk"
    android:layout_width="500dp"
    android:layout_height="350dp"
    app:uxsdk_rtkDescriptionTextColor="@color/black"
    app:uxsdk_dialogOkTextColor="@color/black"
    app:uxsdk_rtkSeparatorsColor="@color/black_50_percent" />

Attributes

List of the customizable XML attributes
  • uxsdk_rtkDescriptionTextAppearance - The text appearance of the RTK description text view.
  • uxsdk_rtkDescriptionTextSize - The text size of the RTK description text view.
  • uxsdk_rtkDescriptionTextColor - The text color for the RTK description text view.
  • uxsdk_rtkDescriptionBackgroundDrawable - The background for the RTK description text view.
  • uxsdk_dialogOkTextAppearance - The text appearance of the dialog OK text view.
  • uxsdk_dialogOkTextSize - The text size of the dialog OK text view.
  • uxsdk_dialogOkTextColor - The text color of the dialog OK text view.
  • uxsdk_dialogOkBackgroundDrawable - The background for the dialog OK text view.
  • uxsdk_rtkSeparatorsColor - The color of the separator lines for this widget and all sub-widgets.

Java Example

RTKWidget rtkWidget = findViewById(R.id.widget_rtk);
rtkWidget.setRTKDescriptionTextColor(getResources().getColor(R.color.black));
rtkWidget.setDialogOkTextColor(getResources().getColor(R.color.black));
rtkWidget.setRTKSeparatorsColor(getResources().getColor(R.color.black_50_percent));
rtkWidget.setBackgroundColor(getResources().getColor(R.color.white));

Kotlin Example

val rtkWidget: RTKWidget = findViewById(R.id.widget_rtk)
rtkWidget.rtkDescriptionTextColor = resources.getColor(R.color.black)
rtkWidget.dialogOkTextColor = resources.getColor(R.color.black)
rtkWidget.rtkSeparatorsColor = resources.getColor(R.color.black_50_percent)
rtkWidget.setBackgroundColor(resources.getColor(R.color.white))

APIs

List of the customization APIs
  • val rtkEnabledWidget: RTKEnabledWidget - Get the RTK Enabled Widget so it can be customized.
  • val rtkSatelliteStatusWidget: RTKSatelliteStatusWidget - Get the RTK Satellite Status Widget so it can be customized.
  • var rtkDescriptionTextColors: ColorStateList - Text color state list for the RTK description text view.
  • var rtkDescriptionTextColor: Int - The text color for the RTK description text view.
  • var rtkDescriptionTextSize: Float - The text size of the RTK description text view.
  • var rtkDescriptionTextBackground: Drawable? - The background for the RTK description text view.
  • var dialogOkTextColors: ColorStateList? - The text color state list of the dialog OK text view.
  • var dialogOkTextColor: Int - The text color of the dialog OK text view.
  • var dialogOkTextSize: Float - The text size of the dialog OK text view.
  • var dialogOkTextBackground: Drawable? - The background for the dialog OK text view.
  • var rtkSeparatorsColor: Int - The color of the separator lines for this widget and all sub-widgets.
  • fun setRTKDescriptionTextAppearance(@StyleRes textAppearance: Int) - Set text appearance of the RTK description text view.
  • fun setRTKDescriptionTextBackground(@DrawableRes resourceId: Int) - Set the background for the RTK description text view.
  • fun setDialogOkTextAppearance(@StyleRes textAppearance: Int) - Set text appearance of the dialog OK text view.
  • fun setDialogOkTextBackground(@DrawableRes resourceId: Int) - Set the background for the dialog OK text view.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The RTK widget 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 product is connected or disconnected.
  • data class RTKEnabledUpdated(val isRTKEnabled: Boolean) : ModelState() - Event when the RTK enabled state is updated.

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

  1. UIState - Provides hooks in events related to user interaction with the widget.
  • object DialogActionDismissed : UIState() - Event when the OK button is tapped.
  • data class VisibilityUpdated(val isVisible: Boolean) : UIState() - Event when visibility state is tapped.

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

RTK Enabled Widget

This widget contains a switch to enable or disable RTK as well as a message to the user. If the user tried to enable RTK when the motors are running, a toast will appear notifying the user to stop the motors and try again.

Usage

<dji.ux.beta.accessory.widget.rtk.RTKEnabledWidget
    android:id="@+id/widget_rtk_enabled"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

The ideal dimension ratio for this widget is 49:10.

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.accessory.widget.rtk.RTKEnabledWidget
    android:id="@+id/widget_rtk"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:uxsdk_descriptionTextColor="@color/black"
    app:uxsdk_titleTextColor="@color/black"
    app:uxsdk_rtkEnabledSwitchTrackIcon="@drawable/custom_switch_track" />

Attributes

List of the customizable XML attributes
  • uxsdk_titleTextSize - The size of the title text.
  • uxsdk_titleTextColor - The color of the title text.
  • uxsdk_titleTextBackground - The background of the title text.
  • uxsdk_titleTextAppearance - The text appearance of the title text.
  • uxsdk_rtkEnabledSwitchThumbIcon - The drawable resource for the RTK enabled switch's thumb.
  • uxsdk_rtkEnabledSwitchTrackIcon - The drawable resource for the RTK enabled switch's track.
  • uxsdk_descriptionTextSize - The size of the description text.
  • uxsdk_descriptionTextColor - The color of the description text.
  • uxsdk_descriptionTextBackground - The background of the description text.
  • uxsdk_descriptionTextAppearance - The text appearance of the description text.

Java Example

RTKEnabledWidget rtkEnabledWidget = rtkWidget.getRTKEnabledWidget();
rtkEnabledWidget.setDescriptionTextColor(getResources().getColor(R.color.black));
rtkEnabledWidget.setTitleTextColor(getResources().getColor(R.color.black));
rtkEnabledWidget.setRTKEnabledSwitchTrackIcon(getResources().getDrawable(R.drawable.custom_switch_track));

Kotlin Example

val rtkEnabledWidget: RTKEnabledWidget = rtkWidget.rtkEnabledWidget
rtkEnabledWidget.descriptionTextColor = resources.getColor(R.color.black)
rtkEnabledWidget.titleTextColor = resources.getColor(R.color.black)
rtkEnabledWidget.rtkEnabledSwitchTrackIcon = resources.getDrawable(R.drawable.custom_switch_track)

APIs

List of the customization APIs
  • var titleTextBackground: Drawable? - The background of the title text.
  • var titleTextSize: Float - The size of the title text.
  • var titleTextColor: Int - The color of the title text.
  • var rtkEnabledSwitchThumbIcon: Drawable - The drawable resource for the RTK enabled switch's thumb.
  • var rtkEnabledSwitchTrackIcon: Drawable - The drawable resource for the RTK enabled switch's track.
  • var rtkEnabledSwitchTrackColor: ColorStateList? - The text color state list for the RTK enabled switch's track.
  • var descriptionTextBackground: Drawable? - The background of the description text.
  • var descriptionTextSize: Float - The size of the description text.
  • var descriptionTextColor: Int - The color of the description text.
  • fun setTitleTextAppearance(@StyleRes textAppearanceResId: Int) - The text appearance of the title text.
  • fun setRTKEnabledSwitchThumbIcon(@DrawableRes resourceId: Int) - Set the drawable ID for the RTK enabled switch's thumb.
  • fun setRTKEnabledSwitchTrackIcon(@DrawableRes resourceId: Int) - Set the drawable ID for the RTK enabled switch's track.
  • fun setDescriptionTextAppearance(@StyleRes textAppearanceResId: Int) - The text appearance of the description text.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The RTK Enabled widget 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 product is connected or disconnected.
  • data class RTKEnabledUpdated(val isRTKEnabled: Boolean) : ModelState() - Event when the RTK enabled state is updated.

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

  1. UIState - Provides hooks in events related to user interaction with the widget.
  • data class SwitchChanged(val isChecked: Boolean) : UIState() - Event when the switch is toggled.

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

RTK Satellite Status Widget

The RTK Satellite Status Widget displays the connection status of the RTK Reference Station Source and a table of other information related to the status of the RTK.

Image Status Item Description
Orientation The orientation of the aircraft. Displays as an image with on and off states for older products and text for newer products.
Positioning The positioning of the aircraft.
Coordinates The latitude, longitude, and altitude of the aircraft and base station or network receiver
Course Angle The heading of the aircraft.
Satellite Counts The number of satellites detected by each receiver for each of the satellite providers. The Antenna 2 column will only appear on products with two antennae attached to the aircraft.
Standard Deviation The standard deviation of location accuracy for the latitude, longitude, and altitude. Only supported by Phantom 4 RTK.

Usage

<dji.ux.beta.accessory.widget.rtk.RTKSatelliteStatusWidget
    android:id="@+id/widget_rtk"
    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.

XML Example

<dji.ux.beta.accessory.widget.rtk.RTKSatelliteStatusWidget
    android:id="@+id/widget_rtk"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:rtkLabelsTextColor="@color/black"
    app:rtkValuesTextColor="@color/black"
    app:rtkConnectionStatusTitleTextColor="@color/black"
    app:orientationIconEnabledColor="@color/green"
    app:orientationIconDisabledColor="@color/red"
    app:rtkConnectionStatusDisconnectedTextColor="@color/gray"
    app:rtkConnectionStatusConnectedNotInUseTextColor="@color/orange"
    app:rtkConnectionStatusConnectedInUseTextColor="@color/blue"
    app:tableBackground="@drawable/custom_table_background" />

RTK Satellite Status Widget Attributes

List of the customizable XML attributes
  • uxsdk_rtkConnectionStatusTitleTextAppearance - The text appearance of the RTK connection status title.
  • uxsdk_rtkConnectionStatusTitleTextSize - The text size of the RTK connection status title.
  • uxsdk_rtkConnectionStatusTitleTextColor - The text color of the RTK connection status title.
  • uxsdk_rtkConnectionStatusTitleBackgroundDrawable - The background of the RTK connection status title.
  • uxsdk_rtkConnectionStatusTextAppearance - The text appearance of the RTK connection status.
  • uxsdk_rtkConnectionStatusTextSize - The text size of the RTK connection status.
  • uxsdk_rtkConnectionStatusConnectedInUseTextColor - The text color of the RTK connection status when the RTKBaseStationStatus is CONNECTED.
  • uxsdk_rtkConnectionStatusConnectedNotInUseTextColor - The text color of the RTK connection status when the RTKBaseStationStatus is CONNECTED_NOT_IN_USE.
  • uxsdk_rtkConnectionStatusDisconnectedTextColor - The text color of the RTK connection status when the RTKBaseStationStatus is DISCONNECTED.
  • uxsdk_rtkConnectionStatusBackgroundDrawable - The background of the RTK connection status.
  • uxsdk_rtkLabelsTextAppearance - The text appearance of the RTK labels text views.
  • uxsdk_rtkLabelsTextSize - The text color of the RTK labels text views.
  • uxsdk_rtkLabelsTextColor - The text color of the RTK labels text views.
  • uxsdk_rtkLabelsBackgroundDrawable - The background for the RTK labels text views.
  • uxsdk_rtkValuesTextAppearance - The text appearance of the RTK values text views.
  • uxsdk_rtkValuesTextSize - The text size of the RTK values text views.
  • uxsdk_rtkValuesTextColor - The text color of the RTK values text views.
  • uxsdk_rtkValuesBackgroundDrawable - The background for the RTK values text views.
  • uxsdk_orientationIconEnabledColor - The color of the orientation enabled image view.
  • uxsdk_orientationIconDisabledColor - The color of the orientation disabled image view.
  • uxsdk_orientationIcon - The drawable resource for the orientation icon.
  • uxsdk_rtkSeparatorsColor - The color for the separator line views.
  • uxsdk_tableBackground - The image displayed behind the satellite status table.
  • uxsdk_beiDouSatellitesVisibility - The visibility of the BeiDou satellite information.
  • uxsdk_glonassSatellitesVisibility - The visibility of the GLONASS satellite information.
  • uxsdk_galileoSatellitesVisibility - The visibility of the Galileo satellite information.

Java Example

RTKSatelliteStatusWidget rtkWidget = rtkWidget.getRTKSatelliteStatusWidget();
rtkSatelliteStatusWidget.setRTKLabelsTextColor(getResources().getColor(R.color.black));
rtkSatelliteStatusWidget.setRTKValuesTextColor(getResources().getColor(R.color.black));
rtkSatelliteStatusWidget.setRTKConnectionStatusTitleTextColor(getResources().getColor(R.color.black));
rtkSatelliteStatusWidget.setOrientationEnabledColor(getResources().getColor(R.color.green));
rtkSatelliteStatusWidget.setOrientationDisabledColor(getResources().getColor(R.color.red));
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.DISCONNECTED, getResources().getColor(R.color.gray));
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.CONNECTED_NOT_IN_USE, getResources().getColor(R.color.orange));
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.CONNECTED_IN_USE, getResources().getColor(R.color.blue));
rtkSatelliteStatusWidget.setTableBackground(getResources().getDrawable(R.drawable.custom_table_background));

Kotlin Example

val rtkSatelliteStatusWidget: RTKSatelliteStatusWidget = rtkWidget.rtkSatelliteStatusWidget
rtkSatelliteStatusWidget.rtkLabelsTextColor = resources.getColor(R.color.black)
rtkSatelliteStatusWidget.rtkValuesTextColor = resources.getColor(R.color.black)
rtkSatelliteStatusWidget.rtkConnectionStatusTitleTextColor = resources.getColor(R.color.black)
rtkSatelliteStatusWidget.orientationEnabledColor = resources.getColor(R.color.green)
rtkSatelliteStatusWidget.orientationDisabledColor = resources.getColor(R.color.red)
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.DISCONNECTED, resources.getColor(R.color.gray))
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.CONNECTED_NOT_IN_USE, resources.getColor(R.color.orange))
rtkSatelliteStatusWidget.setRTKConnectionStatusLabelTextColor(RTKSatelliteStatusWidgetModel.RTKBaseStationStatus.CONNECTED_IN_USE, resources.getColor(R.color.blue))
rtkSatelliteStatusWidget.tableBackground = resources.getDrawable(R.drawable.custom_table_background)

APIs

List of the customization APIs
  • var rtkConnectionStatusTitleTextSize: Float - The text size of the RTK connection status title.
  • var rtkConnectionStatusTitleTextColor: Int - The text color of the RTK connection status title.
  • var rtkConnectionStatusTitleTextBackground: Drawable? - The background of the RTK connection status title.
  • var rtkConnectionStatusTextSize: Float - The text size of the RTK connection status.
  • var rtkConnectionStatusTextBackground: Drawable? - The background of the RTK connection status.
  • var orientationDisabledColor: Int - The color for the orientation disabled image view.
  • var orientationEnabledColor: Int - The color of the orientation enabled image view.
  • var rtkLabelsTextColors: ColorStateList? - The text color state list of the RTK labels text views.
  • var rtkLabelsTextColor: Int - The text color of the RTK labels text views.
  • var rtkLabelsTextSize: Float - The text size of the RTK labels text views.
  • var rtkLabelsTextBackground: Drawable? - The background for the RTK labels text views.
  • var rtkValuesTextColors: ColorStateList? - The text color state list of the RTK values text views.
  • var rtkValuesTextColor: Int - The text color of the RTK values text views.
  • var rtkValuesTextSize: Float - The text size of the RTK values text views.
  • var rtkValuesTextBackground: Drawable? - The background for the RTK values text views.
  • var orientationIcon: Drawable? - The drawable resource for the orientation icon.
  • var rtkSeparatorsColor: Int - The color for the separator line views.
  • var isBeiDouSatelliteInfoVisible: Boolean - Shows or hides the BeiDou satellite information.
  • var isGLONASSSatelliteInfoVisible: Boolean - Shows or hides the GLONASS satellite information.
  • var isGalileoSatelliteInfoVisible: Boolean - Shows or hides the Galileo satellite information.
  • var tableBackground: Drawable? - The image displayed behind the satellite status table.
  • fun setRTKConnectionStatusTitleTextAppearance(@StyleRes textAppearance: Int) - Set the text appearance of the RTK connection status title.
  • fun setRTKConnectionStatusTextAppearance(@StyleRes textAppearance: Int) - Set the text appearance of the RTK connection status.
  • fun setRTKConnectionStatusLabelTextColor(status: RTKBaseStationStatus, @ColorInt color: Int) - Set the text color of the RTK connection status when the RTKBaseStationStatus is the given value.
  • fun getRTKConnectionStatusLabelTextColor(status: RTKBaseStationStatus): Int - Get the text color of the RTK connection status when the RTKBaseStationStatus is the given value.
  • fun setRTKLabelsTextAppearance(@StyleRes textAppearance: Int) - Set text appearance of the RTK labels text views.
  • fun setRTKValuesTextAppearance(@StyleRes textAppearance: Int) - Set text appearance of the RTK values text views.
  • fun setOrientationIcon(@DrawableRes resourceId: Int) - Set the resource ID for the orientation icon.
  • fun setTableBackground(@DrawableRes resourceId: Int) - Set the image displayed behind the satellite status table.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The RTK Satellite Status widget 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 product is connected or disconnected.
  • data class RTKConnectionUpdated(val isConnected: Boolean) : ModelState() - Event when the RTK connected state is updated.
  • data class RTKStateUpdate(val rtkState: RTKState) : ModelState() - Event when the RTK state is updated.
  • data class ModelUpdated(val model: Model) : ModelState() - Event when the product model is updated.
  • data class RTKSignalUpdated(val source: RTKSignal) : ModelState() - Event when the RTK signal is updated.
  • data class StandardDeviationUpdated(val standardDeviation: StandardDeviation) : ModelState() - Event when the standard deviation is updated.
  • data class RTKBaseStationStateUpdated(val status: RTKBaseStationState) : ModelState() - Event when the RTK base station status is updated.
  • data class RTKNetworkServiceStateUpdated(val status: RTKNetworkServiceState) : ModelState() - Event when the network service status is updated.

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

Clone this wiki locally