IPC UI BizBundle

IPC UI BizBundle is the panel SDK that provides a series of IPC features developed based on Tuya IPC SDK. The following features are supported:

• Preview panel
• Playback panel
• Cloud storage panel
• Message center panel
• Photo album panel
• Setting panel

Things to note

• The IPC UI BizBundle already includes the IPC SDK of the same version. You do not need to add SDK dependencies again. Otherwise, conflicts might occur between different versions.
• We recommend that you integrate the whole IPC UI BizBundle into your project. If you access the entry to a specific panel only, a logical conflict might occur in the context.
• Before you use the IPC RN Panel BizBundle, you must integrate the Device Control UI BizBundle into your project.

Integrate with the UI BizBundle

1. Integrate with the framework of the UI BizBundle.

2. Add dependencies to the build.gradle file of the Android project.

   dependencies{
       implementation ('com.thingclips.smart:thingsmart-bizbundle-camera:2.0.0-cube.2'){
       exclude group: 'com.thingclips.smart', module: 'thingsmart-ipc-camera-sdk-api'
       exclude group: 'com.thingclips.smart', module: 'thingsmart-ipc-camera-base'
       exclude group: 'com.thingclips.smart', module: 'thingsmart-ipc-yuv-monitor'
       exclude group: 'com.thingclips.smart', module: 'thingsmart-p2p-sdk'
       exclude group: 'com.thingclips.smart', module: 'thingsmart-video-codec-sdk'
       exclude group: 'com.thingclips.smart', module: 'thingsmart-p2p-sdk-api'
   }
       api 'com.thingclips.smart:thingsmart-ipcsdk:2.0.0-cube.3'
       //... Other configurations.
   }
   

Implement features

IPC UI BizBundle provides the API methods to access different panels of Tuya-enabled IPCs. This helps you implement navigation between panels and custom features.
Follow the instructions on IPCs in ui-bizbundle-sample on GitHub to configure an IPC and perform tasks with the IPC panel.

Native preview panel

An IPC native preview panel supports a bunch of features. For example, you can implement live video preview, switching between video definition modes, audio switch control, screenshots, video recording, video talk, motion detection, PTZ control, preset point addition or deletion, and auto-patrol control.

API description

Navigation between panels is implemented through routes specified by camera_panel_2.

Parameters

Parameter	Description
extra_camera_uuid	The device ID. You can query the list of devices of the home to get the value.

Example

  Bundle bundle = new Bundle();
  bundle.putString("extra_camera_uuid", devId);
  UrlBuilder urlBuilder = new UrlBuilder(context, "camera_panel_2").putExtras(bundle);
  UrlRouter.execute(urlBuilder);

RN preview panel

Before the React Native (RN) preview panel is implemented, the Device Control UI BizBundle must be integrated.

API description

Navigates to the RN panel based on the service API method AbsPanelCallerService.goPanelWithCheckAndTip().

AbsPanelCallerService service = MicroContext.getServiceManager().findServiceByInterface(AbsPanelCallerService.class.getName());
 service.goPanelWithCheckAndTip(IPCPanelActivity.this, bean.getDevId());

Playback panel

The playback panel is used to play back video footage stored on an SD card. Multiple features can be implemented, for example, video playback, playback time selection, video seeking along the timeline, play and pause, audio control, screenshots, and video recording.

API description

Navigation between panels is implemented through routes specified by camera_playback_panel.

Parameters

Parameter	Description
extra_camera_uuid	The device ID.
destroyCamera	Specifies whether to close the connection after the playback panel is exited. Default value: false.

Example

Bundle bundle = new Bundle();
bundle.putExtra("extra_camera_uuid", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(context,"camera_playback_panel").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Cloud storage panel

The cloud storage panel is used to view and play back cloud-stored video footage. Multiple features can be implemented, for example, cloud-stored video playback, cloud storage time selection, video seeking along the timeline, play and pause, audio control, screenshots, video recording, and display of the motion detection list.

API description

Navigation between panels is implemented through routes specified by camera_cloud_panel.

Parameters

Parameter	Description
extra_camera_uuid	The device ID.
extra_position	The timestamp when a certain motion detection video clip was stored in the cloud on the most recent date. Unit: seconds. This parameter is optional.

Example

Bundle bundle = new Bundle();
bundle.putExtra("extra_camera_uuid", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(context,"camera_cloud_panel").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Message center panel

The message center panel is used to display messages that are generated during video recording. The messages are sorted by date and message type and classified by images, video, audio, or other types. Users can preview the messages and delete one or all messages.

API description

Navigation between panels is implemented through routes specified by camera_message_panel.

Parameters

Parameter	Description
extra_camera_uuid	The device ID.
extra_album_theme	Theme color

Example

Bundle bundle = new Bundle();
bundle.putExtra("extra_camera_uuid", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(context,"camera_message_panel").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Photo album panel

The photo album panel is used to display the files saved by device ID. These files are local screenshots and video footage generated during video preview, playback, and cloud-stored video playback. Users can preview the files and delete one or all files.

API description

Navigation between panels is implemented through routes specified by ipc_album_panel.

Parameters

Parameter	Description
extra_camera_uuid	The device ID.

Example

Bundle bundle = new Bundle();
bundle.putExtra("extra_camera_uuid", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(context,"ipc_album_panel").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Doorbell panel

The doorbell panel is used to display notifications in the case of doorbell calls. Multiple features are supported, for example, basic doorbell information, real-time screenshots, and answering or hanging up a call. After a call is answered, users are navigated to the IPC preview panel.

API description

Navigation between panels is implemented through routes specified by camera_door_bell.

Parameters

Parameter	Description
devId	The device ID. You can get the value from the doorbell notification.

Example

Bundle bundle = new Bundle();
bundle.putString("devId", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(MicroContext.getApplication(), "camera_door_bell").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Live video doorbell panel

The live video doorbell panel is used to display notifications in the case of live video doorbell calls. Multiple features are supported, for example, doorbell status, and answering or hanging up a call. A doorbell call is valid for less than 25 seconds. After it is answered within this validity period, a live video talk is implemented.

API description

Navigation between panels is implemented through routes specified by camera_action_doorbell.

Parameters

Parameter	Description
extra_camera_uuid	The device ID. You can get the value from the doorbell notification.
doorbell_start_time	The start time of long type when the doorbell is pressed. The live video doorbell panel counts down for 25 seconds from this time point. In actual scenarios, a doorbell call might last for less than 25 seconds.

Example

Bundle bundle = new Bundle();
bundle.putString("extra_camera_uuid", deviceId);
bundle.putLong("doorbell_start_time", startTime);
UrlBuilder urlBuilder = new UrlBuilder(MicroContext.getApplication(),  "camera_action_doorbell").putExtras(bundle);
UrlRouter.execute(urlBuilder);

Setting panel

The setting panel is used to display data point (DP) settings. For more information, see IPC Control. The following features are supported:

• Set the device icon and name.
• Set device information, such as the owner, IP address, device ID, time zone, and signal strength.
• Set basic options, such as the privacy switch, basic features, infrared night vision, image quality adjustment (brightness and contrast), and working mode.
• Set advanced options, such as the detection alert settings, passive infrared (PIR) switch, power management, bell settings, buzzer adjustment, video layout, and preset settings.
• Set storage options, such as SD card capacity management and formatting.
• Configure value-added services, such as the subscription to cloud storage.
• Device offline notification
• Set other options such as FAQ and feedback.
• Restart a device
• Remove a device

API description

Navigation between panels is implemented through routes specified by camera_panel_more.

Parameters

Parameter	Description
extra_camera_uuid	The device ID.

Example

Bundle bundle = new Bundle();
bundle.putString("extra_camera_uuid", deviceId);
UrlBuilder urlBuilder = new UrlBuilder(context, panel).putExtras(bundle);
UrlRouter.execute(urlBuilder);

Theme settings

Dark and light themes are supported. Multiple features can be implemented: IPC video playback, cloud storage, message center, settings, and local albums.

API description

You can call the method CameraUIThemeUtils.setCurrentThemeId(@ThemeIDs int themeIDs) to set themes.

CameraUIThemeUtils.setCurrentThemeId(@ThemeIDs int themeIDs);

Parameters

Parameter	Description
themeId	The theme color ID. Valid values: BLACK_THEME_ID: dark theme WHITE_THEME_ID: light theme

Example

CameraUIThemeUtils.setCurrentThemeId(Constants.BLACK_THEME_ID);

Custom panel

The IPC UI BizBundle supports custom panels. You can implement panel features by yourself. For more information, see IPC SDK.

Implement the panel

Go to app > assets > module_app.json, find and delete the undesired route, capture the deleted route, and then customize the navigation. Perform the following steps:

1. Find and delete the undesired route camera_panel_more.

   

2. Follow the instructions in Integrate with Framework to get the unimplemented route and navigate to the target page.

   ThingWrapper.init(this, new RouteEventListener() {
           @Override
           public void onFaild(int errorCode, UrlBuilder urlBuilder) {
               // The original route specified by `urlBuilder.originUrl`.
               ToastUtil.shortToast(ThingPanelSDK.getCurrentActivity(), urlBuilder.originUrl);
           }
       },new ServiceEventListener() {
               @Override
               public void onFaild(String serviceName) {
                   Log.e("service not implement", serviceName);
               }
       });
   

Panel route table

Route target	Feature
camera_panel_2	Dark preview panel
camera_playback_panel	Playback panel
camera_cloud_panel	Cloud storage panel
camera_message_panel	Message center panel
camera_door_bell	Doorbell call panel
doorbell_camera_panel	Doorbell preview panel
doorbell_camera_playback_panel	Doorbell playback panel
camera_action_doorbell	Mains-powered doorbell panel
camera_panel_more	Setting panel
dev_base_info	Setting > Rename a device
camera_panel_info	Setting > Device information
ipc_alarm_detected_feature_list	Setting > Motion detection setting
dev_share_edit	Setting > Device sharing, not supported currently
not_share_support_help	Setting > Sharing help, not supported currently

Rename a device

API description

Call the API method renameDevice() of Smart Life App SDK to rename an IPC.

ThingHomeSdk.newDeviceInstance(deviceId).renameDevice(String deviceName, IResultCallback callback);

Parameters

Parameter	Description
deviceId	The device ID.
deviceName	The new name.
callback	The success or failure callback implemented by IResultCallback.

Example

/**
* Renames a device.
* @param context
* @param deviceId      The device ID.
* @param deviceName    The new name.
*/
public void renameDevice(final Context context, String deviceId, String deviceName) {
    IThingDevice mDevice = ThingHomeSdk.newDeviceInstance(deviceId);
    mDevice.renameDevice(deviceName, new IResultCallback() {
        @Override
        public void onError(String code, String error) {

        }

        @Override
        public void onSuccess() {

        }
    });
}

Modify a device icon

API description

Call the API method modifyDeviceImg() of Smart Life App SDK to modify the icon of an IPC.

DeviceInfoRepository deviceInfoRepository = new DeviceInfoRepositoryImpl(context);
ModifyDevInfoInteractor mModifyDevInfoInteractor = new ModifyDevInfoInteractorImpl(deviceInfoRepository);
mModifyDevInfoInteractor.modifyDeviceImg( deviceId, deviceName, imageFile, callback);

Parameters

Parameter	Description
deviceId	The device ID.
imageFile	The type of image file to be uploaded.
deviceName	The name of the device. You can call DeviceBean of Smart Life App SDK to get the name.
callback	The success or failure callback implemented by ModifyDevInfoInteractor.ModifyDeviceImgCallback.

Example

/**
* Modify a device icon
*
* @param context
* @param deviceId     The device ID.
* @param iconFilePath The URL of the device icon to be uploaded.
*/
public void uploadIcon(final Context context, String deviceId, String iconFilePath) {
    DeviceBean deviceBean = ThingHomeSdk.getDataInstance().getDeviceBean(deviceId);
    String panelName = "";
    if (deviceBean != null) {
        panelName = deviceBean.getName();
    }
    DeviceInfoRepository deviceInfoRepository = new DeviceInfoRepositoryImpl(context);
    ModifyDevInfoInteractor mModifyDevInfoInteractor = new ModifyDevInfoInteractorImpl(deviceInfoRepository);

    mModifyDevInfoInteractor.modifyDeviceImg(deviceId, panelName, new File(iconFilePath),
            new ModifyDevInfoInteractor.ModifyDeviceImgCallback() {
                @Override
                public void onModifyDeviceImgSuccess(String url) {

                }

                @Override
                public void onModifyDeviceImgFailure() {

                }
            });
}

Auxiliary protocol of push notifications

To improve the timeliness and success rate of push notifications sent through active app processes, Tuya has opened an auxiliary protocol of push notifications for IP cameras (IPCs).

• You can implement access to the push notification channel by yourself. For more information, see Message Center.

• Register a listener for push notifications and query and process push notifications returned by the callback.

  Sample message body

  {
      "a": "view",
      "c": "action",
      "cc": "Low-power IPC, someone is ringing the bell.",
      "ct": "fcm You have a visitor",
      "devId": "6cfaf335a8d6e752e0wrpy",
      "msgId": "4da4dcf61573555995",
      "p": {
      "media": 13
  },
      "specialChannel": false,
      "ts": "1573555995000",
      "type": "doorbell"
  }
  

Register and unregister a listener

You must register a listener after login and unregister the listener after logout.

API description

Tuya’s push notification auxiliary protocol requires you to register a listener after login and unregister the listener after logout.

// Registers a listener for push notifications.
ThingHomeSdk.getCameraInstance().registerCameraPushListener(IThingGetBeanCallback<CameraPushDataBean> callback)

// Unregisters a listener for push notifications.
ThingHomeSdk.getCameraInstance().unRegisterCameraPushListener(IThingGetBeanCallback<CameraPushDataBean> callback);

Parameters

Parameter	Description
callback	The callback returned by IThingGetBeanCallback to listen for push notifications. CameraPushDataBean encapsulates push notifications.

Data model of CameraPushDataBean

Field	Type	Description
devId	String	The device ID.
timestamp	Integer	The message timestamp.
etype	String	The type of message.
edata	String	The message ID.

Example

private IThingHomeCamera homeCamera;
private static IThingGetBeanCallback<CameraPushDataBean> mThingGetBeanCallback = new IThingGetBeanCallback<CameraPushDataBean>() {
    @Override
    public void onResult(CameraPushDataBean o) {
        L.d(TAG, "onMqtt_43_Result on callback");
        L.d(TAG, "Message timestamp: timestamp=" + o.getTimestamp());
        L.d(TAG, "Device ID: devid=" + o.getDevId());
        L.d(TAG, "Message ID: msgid=" + o.getEdata());
        L.d(TAG, "Message type: etype=" + o.getEtype());
    }
};

/**
* Registers a listener after login.
*/
public void registerCameraPushListener() {
    homeCamera = ThingHomeSdk.getCameraInstance();
    if (homeCamera != null) {
        homeCamera.registerCameraPushListener(mThingGetBeanCallback);
    }
}

/**
* Unregisters a listener after logout.
*/
public void unRegisterCameraPushListener() {
    if (homeCamera != null) {
        homeCamera.unRegisterCameraPushListener(mThingGetBeanCallback);
    }
}

Options on setting page

You can customize each feature on the setting page. For example, display or hide a feature, and capture tap events.

API description

Passes in settings by using the service API method AbsCameraUiService.configCameraSettingCustomItem.

public abstract void configCameraSettingCustomItem(List<ThingCameraSettingConfigBean> items);

Example

AbsCameraUiService service = MicroServiceManager.getInstance().findServiceByInterface(AbsCameraUiService.class.getName());
if (service != null) {
    List<ThingCameraSettingConfigBean> configs = new ArrayList<>();
    configs.add(new ThingCameraSettingConfigBean("cameraSetting_iconInfoItem", false));
    service.configCameraSettingCustomItem(configs);
}

Data model of ThingCameraSettingConfigBean

Parameter	Description
visible	Specifies whether to display a feature.
operateCallback	The captured event of tapping a button.
tag	Each setting page is assigned a unique name specified by name as listed in the following table.

Values of tag

Value of tag	Feature
cameraSetting_iconInfoItem	Device icon and name
cameraSetting_infoItem	Device information
cameraSetting_autoItem	Tap-to-run and automation scenes
cameraSetting_networkItem	Device network information
cameraSetting_thirdPartyItem	Third-party services supported
cameraSetting_privateModeCfgItem	Privacy mode switch
cameraSetting_basicSectionHeaderCfgItem	Title of basic setting
cameraSetting_basicFuncCfgItem	Basic settings
cameraSetting_nightvisionCfgItem	Night vision mode
cameraSetting_irNightCfgItem	Infrared night vision
cameraSetting_displaySettingCfgItem	Display settings
cameraSetting_soundCfgItem	Audio adjustment
cameraSetting_workModeCfgItem	Working mode
cameraSetting_advanceSectionHeaderCfgItem	Title of advanced setting
cameraSetting_detectCfgItem	Detection alerts
cameraSetting_pirFuncCfgItem	PIR
cameraSetting_powerCfgItem	Battery management
cameraSetting_bellCfgItem	Bell settings
cameraSetting_sirenSettingCfgItem	Siren adjustment
cameraSetting_videoLayoutCfgItem	Video layout
cameraSetting_presentPointCfgItem	Preset point setting
cameraSetting_onvifCfgItem	Open Network Video Interface Forum (ONVIF) protocol
cameraSetting_gatewaySectionHeaderCfgItem	Gateway title
cameraSetting_gatewayCfgItem	Gateway
cameraSetting_storageSectionHeaderCfgItem	Title of storage setting
cameraSetting_storageCfgItem	Storage settings
cameraSetting_valueAddedSectionHeaderCfgItem	Value-added service title
cameraSetting_valueAddedCfgItem	Value-added services
cameraSetting_offlineSectionHeaderCfgItem	Title of a device offline notification
cameraSetting_offlineCfgItem	Device offline notification
cameraSetting_otherSectionHeaderCfgItem	Other titles
cameraSetting_feedbackCfgItem	FAQ & feedback
cameraSetting_addToHomeCfgItem	Added to the home screen
cameraSetting_firmwareCfgItem	Device update
cameraSetting_restartCfgItem	Restart a device
CameraSetting_removeCfgItem	Remove a device
CameraSetting_indicatorLightItem	Status indicator
CameraSetting_besharedItem	Device source
CameraSetting_soundDetectedItem	Sound detection
CameraSetting_apModeItem	AP mode
CameraSetting_unlockItem	Remote unlocking
CameraSetting_cloudDisk	Pages of cloud disks managed on a base station
CameraSetting_privacyZone	Privacy area setting
CameraSetting_recording_time	Time setting of a single video clip
CameraSetting_parking_mode	Parking mode setting
CameraSetting_collision_alert	Collision alert
CameraSetting_antiDismantle	Anti-pry alert switch
CameraSetting_notification	Push notification settings
cameraSetting_carInspection	Vehicle model detection switch
cameraSetting_nonCarInspection	Non-motor vehicle detection switch
cameraSetting_thirdPartyHeaderItem	Third-party title supported
cameraSetting_pirSetItem	PIR setting
cameraSetting_stationDoorbellItem	Setting of base station bell
cameraSetting_stationDetectionItem	Base station detection alert

Panel multilingual settings

For more information, see Configuration files.