14
SDK 开发快速上手 面板端 > SDK 开发 >5 分钟上手 > SDK 开发快速上手 文档版本: 20200221 查看在线版本

SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手

面板端 > SDK 开发 > 5 分钟上手 > SDK 开发快速上手

文档版本: 20200221

查看在线版本

Page 2: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 目录

目录

1 背景了解 1

2 体验面板 32.1 Tuya-Panel-Kit Template . . . . . . . . . . . . . . . . . . . . . . . . . 32.2 Tuya-Panel-Kit UI Explorer . . . . . . . . . . . . . . . . . . . . . . . . 3

3 创建面板工程 53.1 安装涂鸦开发工具包 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53.2 初始化模板工程 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53.3 启动虚拟设备 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63.4 开发调试 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73.5 使用组件 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83.6 打包 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

4 技术支持 10

5 FAQs 115.1 未受认证的企业级开发者 . . . . . . . . . . . . . . . . . . . . . . . . . . 115.2 Uncaught NetworkError: Failed to execute ‘importScripts’ on ‘Worker-

GlobalScope’ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115.3 bitmap 型如何使用 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115.4 如果安卓遇到始终无法加载本地 bundle 的情况 . . . . . . . . . . . . . . . 11

i

Page 3: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 1 背景了解

1 背景了解

在上手之前可以简单了解一下智能家居相关的一些基础概念

智能家居的产品一般都由一颗主控制器 MCU、无线模块 (Wifi、ZigBee、蓝牙 Mesh 等) 和一些外围电路 (传感器、继电器等) 组成。以智能插座为例,无线模块获取到手机 App 下发的指令,传给主控制器,主控制器根据指令控制外围电路 (比如开关继电器);同时传感器监测到的信息也可以通过无线模块发送到云端,直至上报到手机 App,以实现实时监控。

• 联网模块: 联网模块是一个可以集成到目标电子系统的模块,这里的联网即指连接到网络(Internet,以太网等),联网模块就是将嵌入式系统连接到网络的电路模块。涂鸦现在已有联网模块有:WiFi 模块、GPRS 模块、蓝牙 Mesh 模块,这些模块都是实现联网功能,但是联网的方式不同。

• MCU(微控制单元): Microcontroller Unit,微控制单元,设备有自己的控制板,产品的功能由控制板来定义,联网模块跟控制板连接,实现联网功能。

• SoC: System On Chip,硬件本身无 MCU,控制程序写入联网模块中。一般这种需求是比较确定、标准化的,如插座、灯泡等。

• 固件: Firmware,就是写入 EROM(可擦写只读存储器)或 EEPROM(电可擦可编程只读存储器) 中的程序。固件是指设备内部保存的设备 “驱动程序”,通过固件,操作系统才能按照标准的设备驱动实现特定机器的运行动作,比如光驱、刻录机等都有内部固件。固件是担任着一个系统最基础最底层工作的软件。

• DP 点: 产品开发中的最重要的东西,主要用于定于产品功能,在定义好产品功能点即DP 点以后,我们就可以根据 DP 点的类型进行开发了。

– 功能点:即具体智能设备功能的抽象,用于描述产品功能及其参数。– 功能点 ID:功能点的编码,后续设备与云端的功能数据传输通过功能点 ID 进行。– 数据类型:

∗ 布尔型(bool):非真即假的二值型变量。如:开关功能,开/关∗ 数值型(value):适用于可线性调节类型的数据。如:温度调节,温度范围

20-40℃∗ 枚举型(enum):自定义的有限集合值。如:工作档位,低档/中档/高档∗ Bitmap 型(bitmap):用于多状态的显示,一般是专门用于上报和统计故障的功能点,具体的使用方式可以参考FAQs

∗ 字符串型(string):以字符串形式传输的功能点,一般用于较复杂功能,只有当其他类型无法满足时多方协同好进行使用。

1 / 12

Page 4: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 1 背景了解

∗ 透传型(raw):raw 型简单来说就是经过 base64 加密过后的 string 型,在控制面板端,我们下发的流程只需要与 string 保持一致即可,native 端会帮我们进行 base64 编码及解码。

– 数据传输类型:∗ 可下发可上报 (rw):指令数据可以下发给设备,设备数据可以上报给云端;∗ 只上报 (ro):数据只支持从设备上报;∗ 只下发:数据只支持从云端下发;

• 虚拟设备: 模拟的设备,在有限的模拟范围内能够帮助我们进行快速开发,但要注意的是,虚拟设备不会主动上报 DP 点以及处理联动的逻辑。举一个插座的例子来说(假设它有一个总开关以及两个子开关的 DP点,当我们下发了总开关开启的指令后,虚拟设备只会上报总开关开启,而真实设备通过固件的处理后它会上报回总开关以及两个子开关开启)。

• 真实设备: 集成了联网模块并且完成了固件逻辑处理的设备。

另外在开发之前,我们需要您确保正确安装及配置了 Node.js v8 以上的版本,除此之外我们默认您有 ES2015、React 及 React-Native 开发相关的经验。

2 / 12

Page 5: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 2 体验面板

2 体验面板

使用手机端扫描下载 涂鸦面板-RN App,注册新用户。

2.1 Tuya-Panel-Kit Template

涂鸦开发初始模板工程,具体代码托管在 Github,您可以 clone 或下载到本地查看。在涂鸦面板-RN App中扫描以下二维码您可以查看到该模板工程。

Figure 1: image.png

2.2 Tuya-Panel-Kit UI Explorer

涂鸦面板开发 UI 功能组件浏览库,示例代码托管在 Github,您可以 clone 或下载到本地查看。在涂鸦面板-RN App中扫描以下二维码您可以查看到目前涂鸦开放的功能组件,以供开发时使用,加快面板开发进度。

3 / 12

Page 6: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 2 体验面板

4 / 12

Page 7: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 3 创建面板工程

3 创建面板工程

在体验完面板后,我们可以开始准备搭建一个属于自己的面板。在实际的项目开发中,您会需要有项目初始化、开发组件库、代码构建、调试以及打包等一系列工程化的需求。因此我们提供了一套开发工具来辅助开发,下面我们以一个面板工程为实例进行说明。

3.1 安装涂鸦开发工具包

涂鸦提供官方的命令行工具 (CLI),和涂鸦的面板定制协作平台深度集成, 请务必安装。1 npm install tuya-panel -kit-cli -g

暂时不支持通过 yarn 安装 cli 工具安装之后,您就可以在命令行中访问 tuya-panel-kit-cli 命令。您可以通过简单运行 tuya-panel-kit-cli,看看是否展示出了一份所有可用命令的帮助信息,来验证它是否安装成功。1 $ tuya-panel -kit-cli help2 A command line App for developing Tuya panels.34 Usage:5 tuya-panel -kit-cli [command]67 Available Commands:8 help Help about any command9 init init awesome project with name `AwesomeProjectName `

10 package package project1112 Flags:13 -h, --help help for tuya-panel -kit-cli1415 Use "tuya-panel -kit-cli [command] --help" for more information about a

command.

详细功能请参考开发工具文档

3.2 初始化模板工程

在实际面板项目开发过程中,我们首先需要通过涂鸦开发工具中内置的脚手架创建一个模板工程,后续基于此模板工程进行面板开发。

5 / 12

Page 8: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 3 创建面板工程

1 tuya-panel -kit-cli init {YourProjectName}23 cd {YourProjectName}4 yarn5 yarn start

具体模板的解释和使用方式请参考,模板文档

3.3 启动虚拟设备

如果想要了解虚拟设备是什么,可以参考一下文档顶部的基础概念

• 如何配置 App 界面• 硬件及嵌入式程序开发

在开发具体产品之前,要先创建出一个产品,打开产品创建的第二步:

6 / 12

Page 9: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 3 创建面板工程

Figure 2: image.png

然后用涂鸦面板-RN App扫里面的二维码,将该产品对应的虚拟设备添加到 App里。之后根据本文下面的配置,手机连上本地电脑后,就可以在 App里点开这个虚拟设备的面板进行调试。创建产品的具体流程可以参考此处。

3.4 开发调试

IOS:

1. 打开涂鸦面板-RN App注册并登录2. 点击底部栏中的RN调试,进入 RN 调试设置页面3. 开启顶部的滑块开启 RN 调试功能,并按照 App 提供的步骤输入 产品 ID / 本机调试 ip地址 / 本机调试端口和 bundle (用于载入本地 bundle)

4. 输入完毕后,回到首页进入指定面板后即可载入本地资源包

7 / 12

Page 10: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 3 创建面板工程

5. 如需查看调试日志或开启 hot reload,可在面板界面摇一摇进行选择

安卓:

1. 找到下载安装后附带的 com.ty.panelIdev 应用2. 输入开发主机的 IP 地址,输入完毕后必须点击确认,并打开开关3. 打开涂鸦面板-RN App注册并登录4. 进入指定面板后将会载入本地资源包5. 如需查看调试日志或开启 hot reload,可在面板界面摇一摇进行选择

如果遇到未受信任的企业级开发者提示,请参考FAQs,另需注意在调试前需在本地npm start启动 RN 服务;

3.5 使用组件

脚手架内部已经添加 tuya-panel-kit组件库依赖,后续如有升级版本需求,可自行查看组件更新日志选择版本进行升级;

3.6 打包

在项目开发完毕以后,运行以下命令即可打包1 tuya-panel -kit-cli package {YourAwesomeProject}

打包前会对项目的合法性进行一次校验,校验通过才会开始构建。开始打包时,tuya-panel-kit-cli会将所选择的项目打包到临时目录,成功后,会自动打开该临时目录。打包会生成 3 个 UI 包, 打出三个包名示例如下:

• {name}-android_{rnVersion}_{version}.tar.gz 安卓面板 UI 包• {name}-ios_{rnVersion}_{version}.tar.gz 苹果面板 UI 包• {name}-sources.tar.gz

请将得到的 UI 包,按照规定提交到涂鸦的面板定制协作平台。打包过程如果遇到错误,请修复工程源码错误后再继续构建, 或者求助 [email protected](请在邮件中附上企业名称和联系方式)

更新约定

8 / 12

Page 11: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 3 创建面板工程

为了您能更好地使用涂鸦开发者服务,tuya-panel-kit-cli内置了更新检查,请尽量升级到最新版,以免错过更多精彩:).

9 / 12

Page 12: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 4 技术支持

4 技术支持

如果您在使用我们提供的模板面板时遇到无法运行或开发完毕后无法打包的问题时,请确保:

1. node版本为 8 以上且正确安装了模板所需要的依赖2. 安装了涂鸦提供的 debug 专用 App3. 正确使用了涂鸦提供的tuya-panel-cli工具进行模板初始化及打包

如果您确认按照我们提供的文档以及步骤后仍然遇到问题无法解决,请在我们的论坛或者项目Github 上提交一个Issue,方便我们排查问题并让后续遇到问题的人能更快地解决问题。

10 / 12

Page 13: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 5 FAQS

5 FAQs

5.1 未受认证的企业级开发者

您需要手动给信任企业级应用,具体操作见此

5.2 Uncaught NetworkError: Failed to execute ‘importScripts’ on‘WorkerGlobalScope’

请确保真机和开发电脑在同一网段下,且没有开启全局 VPN

5.3 bitmap 型如何使用

一般用于定义故障类型节约空间,通过二进制的位表示对应的故障是否存在,上报回来的是对应的十进制。

• 假设一个产品有四种故障型:• 无故障:十进制 -> 0; 二进制 -> 0000;• 第一种故障出现: 十进制 -> 1; 二进制 -> 0001;• 第一种和第二种故障同时出现: 十进制 -> 3; 二进制 -> 0011;• 所有故障同时出现: 十进制 -> 15; 二进制 -> 1111;

5.4 如果安卓遇到始终无法加载本地 bundle 的情况

请检查下手机 系统设置 -> 应用程序权限设置 -> 涂鸦面板 -RN -> 悬浮窗权限是否开启

11 / 12

Page 14: SDK 开发快速上手 - airtake-public-data-1254153901 ...... · 涂鸦面板开发UI功能组件浏览库,示例代码托管在Github,您可以clone或下载到本地查 看。

SDK 开发快速上手 5 FAQS

Figure 3: image.png

12 / 12