#Feature Introduction

#Prerequisites

#Applicable Scope

This extension is applicable to lighting categories with scenario functionality, enabling visualization during the development process and significantly improving development efficiency.

#Applicable Scenarios

The product has scene dp (scene_data\mix_light_scene\dreamlight_scene_mode), and there is a requirement to develop the scene function.

#Function

• Cloud Scenario Library
• Local Scenario Library

#Usage Process

#Installation

1. In Tuya MiniApp Tools, open the device tool, authorize login, and select a device from the device list. Click to enter the device page.

2. On the device page, click on 'Extension Management' in the top right corner to enter the extension market.

3. In the extension market, find '面板 IDE 照明情景库扩展' and click install.

#Usage

1. After a successful installation, an 'Scene Library' entry will appear in the top navigation bar on the device page. Click on 'Scenario Library' to enter the scenario library management page.

2. On the scenario library management page, you can develop both the cloud scenario library and the local scenario library.

2.1 Cloud Scenario Library

2.1.1 After switching to the cloud scenario library
2.1.2 Click to inject scenario library code capabilities

2.1.3 If it has already been injected, a confirmation box will pop up. After confirmation, the code will be overwritten and injected into the project.

2.1.4 Reference the corresponding code in the project to complete the development

import { useDevice } from '@ray-js/panel-sdk';
import { jumpToCoolBar } from '@/standModel/sceneModel/CloudScene';

type Props = {};

export const Demo: React.FC<Props> = ({ style }) => {
  const { devInfo } = useDevice();

  const handleJumpToCoolBar = () => {
    const { devId, groupId } = devInfo || {};
    jumpToCoolBar(devId, groupId);
  };

  return (
    <View onClick={handleJumpToCoolBar}>
      Jump to Online Scenario Library
    </View>
  );
};

2.2 Local Device Scenario

2.2.1 Switch to local scenario library
2.2.2 Select the desired scenario effects, either single or all.
2.2.3 After selecting the desired effect item, click Scenario Library Code Injection

2.2.4 If it has already been injected, a confirmation box will pop up, and after confirmation, the code will be overwritten into the project.

2.2.5 By referencing the corresponding code in the project, you can complete the development (If there are custom development needs, you can modify the corresponding code adaptation in the @/standModel/sceneModel/LocalScene folder)

import LocalScene from '@/standModel/sceneModel/LocalScene';

export const Scene: React.FC<Props> = ({ style }) => {
  return (
    <View style={style} className={styles.list}>
      <LocalScene />
    </View>
  );
};

#Precautions

• Attention ⚠️: The online scenario library requires activation of advanced capabilities. You can directly ask in the official group or post an inquiry at https://tuyaos.com/viewforum.php?f=10.
• Note ⚠️: If the cloud scenario library fails to jump, please check whether it is configured in app.config.ts.

"functionalPages": {
  "rayPlayCoolFunctional": {
    "appid": "tyg0szxsm3vog8nf6n"
  }
}

#Release Notes

#v0.0.9

Release Date: 2024.10.25

• Support cloud scenario library
• Support local scenario library