Scene Library

The scene library involves three API methods and the custom hook method useSceneData.

Scene library API methods

getSceneVersionInfo

Returns the current version and all versions of the scene library.

Request parameters

None

Response parameters

interface ISceneInfo {
  currVersion: string; //'1.0'
  allVersionList: string[];//['1.0','1.1']
}

getSceneData

Returns scene resources.

Request parameters

Response parameter type

interface ISceneData {
  dpCode: string;
  icon: string;
  sceneName: string;
  sceneData: string;
  sceneId: number;
  gmtCreate?: number;
  gmtModified?: number;
}

updateVersion

Updates the version of the scene library.

Request parameters

Response parameter type

Custom hook method useSceneData

The custom hook method useSceneData is used to update the scene library and return the data of the latest scene library.

Request parameters

Response parameters

Actions

Method

const [data, currentVersion, { renderUpdateScene }] = useSceneData('1.0');

Example

import React, { useState, useEffect } from 'react';
import { View, StyleSheet, Image, TouchableOpacity, ScrollView } from 'react-native';
import { lampApi } from '@tuya/tuya-panel-api';
import { Hooks } from '@tuya/tuya-panel-lamp-sdk';
import { Utils, TYText } from 'tuya-panel-kit';
import { useUpdateEffect } from 'ahooks';

const { getSceneData, getSceneVersionInfo } = lampApi.sceneApi;
const { useSceneData } = Hooks;

const { winWidth, convertX: cx } = Utils.RatioUtils;

const SceneFunScene: React.FC<any> = () => {
  const [list, setList] = useState([]);
  const [initVersion, setInitVersion] = useState('1.0');
  const [maxVersion, setMaxVersion] = useState('1.0');
  const [data, currentVersion, { renderUpdateScene }] = useSceneData('1.0');

// Accesses the panel to get the version information and data of the scene library.
  useEffect(() => {
    getSceneVersionInfo()
      .then((response: any) => {
        const { currVersion, allVersionList } = response;
        const max = allVersionList[allVersionList.length - 1];
        setInitVersion(currVersion);
        setMaxVersion(max);
        // Returns the data of the scene library.
        getSceneData(currVersion)
          .then((d: any) => {
            setList(d);
          })
          .catch(() => {});
      })
      .catch(() => {});
  }, []);

// Returns the latest version number and data of the scene library after the user updates the scene library.
  useUpdateEffect(() => {
    setList(data);
    setInitVersion(currentVersion);
  }, [data, currentVersion]);

  const handleUpdate = () => {
    // Calls the custom hook method.
    renderUpdateScene(maxVersion);
  };



    return (
      <View>
        <ScrollView
          contentContainerStyle={styles.scrollViewContent}
          showsVerticalScrollIndicator={false}
        >
          {initVersion < maxVersion && (
            <TouchableOpacity onPress={handleUpdate}>
              <TYText>update download</TYText>
            </TouchableOpacity>
          )}
          {list.map((item: any) => {
            return (
              <View  key={item.sceneId}>
                  <Image  source={{ uri: item.icon }} resizeMode="cover" />
                  <TYText >{item.sceneName}</TYText>
              </View>
            );
          })}
        </ScrollView>
      </View>
    );
};
export default SceneFunScene;