Photo Video Switch Widget

(Updated widget in develop branch)

This widget can be used to switch between Shoot Photo Mode and Record Video Mode. There are two states

Icon	Description
	Shoot Photo Mode
	Record Video Mode

Usage

<dji.ux.beta.cameracore.widget.cameracontrols.photovideoswitch.PhotoVideoSwitchWidget
     android:id="@+id/widget_camera_control_photo_video_switch"
     android:background="@drawable/uxsdk_background_black_rectangle"
     android:layout_width="100dp"
     android:layout_height="100dp"/>

Customizations

The widget can be customized by the user to serve their purpose and theme.

Example

<dji.ux.beta.cameracore.widget.cameracontrols.photovideoswitch.PhotoVideoSwitchWidget
     android:id="@+id/widget_camera_control_photo_video_switch"
     android:background="@color/white"
     app:uxsdk_connectedStateIconColor="@color/green"
     android:layout_width="100dp"
     android:layout_height="100dp"/>

Icon	Description
	Shoot Photo Mode
	Record Video Mode

Attributes

List of the customizable XML attributes

uxsdk_cameraIndex - The camera index to which the widget should react.
uxsdk_iconBackground - The background of the icon.
uxsdk_connectedStateIconColor - The color of icon when product is connected.
uxsdk_disconnectedStateIconColor - The color of icon when product is disconnected.
uxsdk_photoModeIcon - The icon to be shown for photo mode.
uxsdk_videoModeIcon - The icon to be shown for video mode.

Kotlin Example

val photoVideoSwitchWidget: PhotoVideoSwitchWidget = findViewById(R.id.widget_camera_control_photo_video_switch)
photoVideoSwitchWidget.setBackgroundColor(getResources().getColor(R.color.white))
photoVideoSwitchWidget.connectedStateIconColor = getResources().getColor(R.color.green)

Java Example

PhotoVideoSwitchWidget photoVideoSwitchWidget = findViewById(R.id.widget_camera_control_photo_video_switch);
photoVideoSwitchWidget.setBackgroundColor(getResources().getColor(R.color.white));
photoVideoSwitchWidget.setConnectedStateIconColor(getResources().getColor(R.color.green));

APIs

List of the customization APIs

var cameraIndex: CameraIndex - The camera index for which the widget should react.
var lensType: LensType - The type of the lens the widget is reacting to.
var photoModeIcon: Drawable? - Icon when the widget is photo mode.
public void setPhotoModeIcon(@DrawableRes int resourceId) - Set the icon when the widget is in photo mode.
var videoModeIcon: Drawable? - Icon when the widget is video mode.
public void setVideoModeIcon(@DrawableRes int resourceId) - Set the icon when the widget is in video mode
var iconBackground: Drawable? - Background of the icon.
public void setIconBackground(@DrawableRes int resourceId) - Set the background of the icon
var connectedStateIconColor: Int - Color tint for icon when product is connected.
var disconnectedStateIconColor: Int - Color tint for icon when product is disconnected.

Hooks

The widget provides hooks for users to add functionality based on state changes in the widget. The Photo Video Switch widget provides two types of hooks

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 PhotoVideoSwitchUpdated(val photoVideoSwitchState: PhotoVideoSwitchState) : ModelState() - Event when photo video switch state is updated.

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 WidgetClicked : UIState() - Event when widget is clicked.

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

DJI UX SDK Version 5 Beta 5