---
title: 前言导读
summary: 面板小程序方案概述，介绍核心特点（JS/TS 开发、IDE 调试、IoT 集成、多平台分发）、与产品的强关联关系、设备列表唤起入口、内置设备环境及从创建到上线的完整流程。
---

# 方案介绍

面板小程序即面板开发方案，是专为智能设备控制面板设计的轻量化开发解决方案，基于小程序框架，支持跨平台开发和强大的 IoT 功能，帮助开发者快速、低成本地构建智能设备管理方案。

## 核心特点

- **简单易用**：采用 `JavaScript` / `Typescript` 开发，类似 `H5` 页面开发，上手快。
- **设备工具**：提供集成 `IDE` 和设备调试工具，支持从编码到测试的全流程开发，提升效率。
- **IoT 集成**：内置设备控制 `API` 和 `SDK`，简化 `IoT` 功能集成，实现智能管理。
- **多平台分发**：一次编写，适配 `Android` 和 `iOS`，节省开发时间。


## 区别与约束

### 与产品强关联

面板小程序专为智能设备控制设计，与设备产品紧密关联。开发者需在涂鸦开发者平台上将小程序与产品绑定，如下图所示。

<Image
  src='/images/panel/panel-solution-related.png'
  alt='面板小程序与产品绑定流程'
  style={{
    borderRadius: '10px',
    boxShadow: '0 0 5px rgba(0,0,0,0.3)',
    maxWidth: '375px',
    maxHeight: '667px',
  }}
/>

### 唤起入口不同

面板小程序通过设备列表入口唤起，与智能设备强关联。用户和开发者需从设备列表进入小程序，如下图所示在开发阶段必须要从 IDE 的设备工具中的设备列表入口进入，同理在 App 环境也必须从设备列表入口进入。

<Image
  src='https://images.tuyacn.com/content-platform/hestia/1729068192d8ebbf0f183.png'
  alt='设备列表入口示意图'
  style={{
    borderRadius: '10px',
    boxShadow: '0 0 5px rgba(0,0,0,0.3)',
    maxWidth: '375px',
    maxHeight: '667px',
  }}
/>

### 内置设备环境

面板小程序运行时依赖虚拟或真实设备环境，内置设备 ID、群组 ID 和产品多语言支持。以下是获取设备 ID 和多语言的示例代码：

```typescript
import { getLaunchOptionsSync } from '@ray-js/ray';

// 获取设备 ID（单设备）
const { deviceId } = getLaunchOptionsSync()?.query ?? {};

// 获取群组 ID（群组设备）
const { groupId } = getLaunchOptionsSync()?.query ?? {};

// 获取设备或群组对应的产品多语言值
Strings.getDpLang('switch_led');
```

## 方案流程

<Callout type="info" emoji="ℹ️">
  完整的开发流程请前往 [快速开始-面板小程序](/cn/miniapp/develop/ray/guide/start/quick-start) 进行查阅。
</Callout>

<Image
  src='/images/panel/panel.png?t=1'
  style={{
    borderRadius: '10px',
    boxShadow: '0 0 5px rgba(0,0,0,0.3)',
    maxWidth: '375px',
    maxHeight: '667px',
  }}
/>

- **创建产品**：首先，我们需要在涂鸦开发者平台创建产品，面板开发工程师，硬件开发工程师以及产品设计师进行功能点的定义。

- **开发调试**：然后，面板开发工程师来开发围绕操作功能点的面板小程序，在开发阶段可以直接使用 Tuya MiniApp IDE 提供的虚拟设备进行调试。与此同时，硬件开发工程师也同样围绕功能点进行嵌入式程序的开发。

- **体验测试**：在联调阶段，面板小程序发布体验版本，通过智能生活 App 连接到真实设备进行测试（或者使用真机调试功能）。

- **审核上线**：测试完成后，我们可以将面板小程序提交审核，并发布正式版本。然后在 涂鸦开发者平台进行产品和面板小程序的绑定，那么，您就完成了面板小程序的整个开发工作了。
