Common Timers

The NormalTiming object provides three components: Timer (a list of timers), AddTimer (add a timer), and Repeat (set a repetitive cycle). This simplifies the comprehensive interactive process to add, edit, select, or delete timers, and set a repetitive cycle. Cloud-based timers can be configured and saved to smart devices and the cloud using API requests in the cloud.

Preview

Timer

Properties

Properties of themeConfig:

Properties of timerConfig

AddTimer

Properties

Properties of route

Repeat

Properties

Properties of route

Example

Route configuration file routers.js

Use TYSdk.Navigator to implement route-based navigation.

import NormalTimingScene from './NormalTiming';
import AddTimerScene from './NormalTiming/addTimer';
import RepeatScene from './NormalTiming/repeat';
import TestWhiteScene from './NormalTiming/white';

const mainRouter = [
  {
    id: 'main',
    Scene: NormalTimingScene,
  },
  {
    id: 'addTimer',
    Scene: AddTimerScene,
  },
  {
    id: 'repeat',
    Scene: RepeatScene,
  },
  {
    id: 'testWhite',
    Scene: TestWhiteScene,
  },
];

NormalTIming/index.tsx

import React from 'react';
import { NormalTiming } from '@tuya/tuya-panel-lamp-sdk';

const { Timer } = NormalTiming;

const NormalTimingScene: React.FC<any> = () => {
  const themeConfig = {};
  const timerConfig = {
    addTimerRouter: 'addTimer',
    weeksRouter: 'repeat',
    openLampRouter: 'testWhite',
    useNavigation: false,// Uses `TYSdk.Navigator` to enable route-based navigation.
  };

  const route = {
    params: {
      timerConfig,
      themeConfig,
    },
  };
  return <Timer route={route} navigation={navigation} />;
};
export default NormalTimingScene;

NormalTIming/addTimer.tsx

import React from 'react';
import { NormalTiming } from '@tuya/tuya-panel-lamp-sdk';

const { AddTimer } = NormalTiming;

const AddTimerScene: React.FC<any> = props => {
  const themeConfig = {
    rowStyle: {
      backgroundColor: 'rgba(0,0,0,0.05)',
    },
  };
  const route = {
    params: {
      ...themeConfig,
      ...props,
    },
  };

  return <AddTimer route={route} />;
};

export default AddTimerScene;

NormalTIming/repeat.tsx

import React from 'react';
import { NormalTiming } from '@tuya/tuya-panel-lamp-sdk';

const { Repeat } = NormalTiming;

const RepeatScene: React.FC<any> = props => {
  const route = {
    params: {
      weekOptionStyle: {
        centerBgc: 'rgba(0,0,0,0.05)',
        borderBottomColor: 'rgba(0,0,0,0.1)',
        borderColor: 'rgba(0,0,0,0.2)',
      },
      ...props,
    },
  };

  return <Repeat route={route} />;
};
export default RepeatScene;

NormalTIming/white.tsx

import React from 'react';
import { View } from 'react-native';
import { TYSdk,TYText, Button} from 'tuya-panel-kit';

const TestWhiteScene: React.FC<any> = route => {
 const handleSave = () => {
    TYSdk.Navigator.pop();
    if (route.handleOpenSave) {
      route.handleOpenSave({
        workMode: 'white',
        hue: 10,
        saturation: 1000,
        value: 10,
        brightness: 500,
        temperature: 100,
      });
    }
  };

  return (
    <View style={styles.main}>
      <TYText>White Light Page</TYText>
      <Button
        size={24}
        text='Save'
        onPress={handleSave}
      />
    </View>
  );
};
export default TestWhiteScene;