运动-无目标组件

更新时间：2021-11-18 09:29:21下载pdf

SportNoTarget

组件预览图

组件属性

字段名	类型	描述	必传	默认值
style	ViewStyle \| TextStyle \| ImageStyle	最外层样式	是	{}
bgImage	number	背景图	是	0
centerImage	number	目标图片	是	0
spotImage	number	运动的点	是	0
centerView	React.ReactNode	子组件	是	无

使用示例

import React from 'react';
import { View } from 'react-native';
import { SportNoTarget, SportTargetContent } from '@tuya/tuya-panel-outdoor-sdk';
import { Utils } from 'tuya-panel-kit';
import icons from './res/icons';
import images from './res/index';

const { convertX: cx } = Utils.RatioUtils;

const Component = () => {
  return (
    <View style={{ flex: 1, backgroundColor: '#FFF', paddingTop: 10 }}>
      <View style={{ height: cx(400) }}>
        <SportNoTarget
          style={{ backgroundColor: '#0376FF' }}
          bgImage={images.sport_border_circle1}
          centerImage={images.sport_target_content}
          spotImage={images.step_spot1}
          centerView={
            <SportTargetContent
              step={100}
              targetIcon={icons.target}
              targetIconColor="blue"
              stepColor="blue"
              stepValue="步"
              stepOpacity={0.5}
            />
          }
        />
      </View>
    </View>
  );
};
export default Component;

上一篇日历列表组件

下一篇运动-有目标组件