Appearance
4.2 功能定义
功能定义是最重要的一步，这个涉及到APP的展示效果，设备及APP实现的功能，以及后期导出的通信协议。
在配置功能定义前，请自行列举需要的产品功能以及需要实现的具体功能点等细节，以便后续更快、更准确的使用平台配置出需要的功能APP。
具体可参考下面的我们示例表格。我们还是4通道网络开关来列举下功能，再按照以下列举的功能列表，去平台配置对应的功能。
我们计划设计的网络开关可以采集当前的设备环境的温度和湿度，可以独立控制4个通道的开启和关闭，以及可以控制4路开关可以开启固定的时间。另外我们做个设备自检的按钮，判断网络连接和APP控制是否正常,还有就是可以显示通道的最大输出功率等级。
| 功能名称 | 功能描述 | 功能点 |
|---|---|---|
| 当前温度 | 设备目前所处环境的温度 | 负100 -到正100摄氏度，分辨率0.1 |
| 当前湿度 | 设备目前所处环境的湿度 | 0%RH-100%RH |
| 通道1开关 | 控制第1路继电器通断 | 布尔开关 |
| 通道2开关 | 控制第2路继电器通断 | 布尔开关 |
| 通道3开关 | 控制第3路继电器通断 | 布尔开关 |
| 通道4开关 | 控制第4路继电器通断 | 布尔开关 |
| 时间设置 | 设置多个保持开启时间的选择按钮 | 无限制，10秒，30秒, 60秒。 |
| 功率限制 | 设置限制输出的最大功率，采样电流 | 设置11个档位，1-10档位和不限制档位0 |
| 自检 | 设备收到信息触发蜂鸣器动作 | 蜂鸣器响1秒 |
4.2.1 通用功能
针对一些品类，我们会开发一些通用的功能，以减少用户的开发量，在通用功能界面，只需要点开这些功能，即可添加到当前项目中。下面我们演示下筋膜枪品类添加通用功能，进入功能定义流程，在通用功能界面点击“添加通用功能”按钮。
我们目前添加了连接状态和连接图标，我们先将这两个功能打开。我们可以看到这两个都是在状态操作区的功能，保存之后可以打开产品预览查看效果。
功能详情：
**1 ConnStatus：**状态操作区左侧显示“未连接”，在APP使用过过程中，未连接状态下显示“未连接”，连接过程中显示“连接中”，连接成功后显示“已连接”。
**2 ConnIcon：**状态操作区右侧蓝牙图标，在APP使用过过程中，未连接状态下显示“灰色图标”，连接过程中显示“转圈等待”，连接成功后显示“蓝色图标”
4.2.2 自定义功能
自定义功能属于开发者自定义的功能，根据产品功能需求，自行添加产品设备功能。
<1>：APP界面划分
介绍自定义功能之前，我们先了解下APP界面的区域划分，下图是我们配置好的一款筋膜枪示意图，供大家参考学习。
- 名称显示区：显示产品名称，示例定义的<探频1号筋膜枪>。
- 图片展示区：展示产品主图，logo图(可不展示)。
- 状态操作区：此区域可以做连接状态或者工作状态展示，显示产品主要数据，设备的开关功能等。
- 信息展示区：主要显示设备信息，设备的一些参数。
- 功能操作区：对设备的功能操作，启停控制等。
<2>：组件功能效果介绍
目前平台总共支持四种组件效果（后续会增加更多的组件效果），分别如下：其中单一控制组件为单向按键，APP仅下发指令，不接收数据。
不同组件有不同的功能和用途，以及展示给用户的效果也不一样：
1、二选一组件：主要用于实现控制开关。只有0和1（或者开和关）两种状态的功能。比如：打开按摩功能、打开灯、启动等。最终的效果类似下面截图：
2、多选一组件：主要用于实现不同场景的控制，可自定义不同字段对应的功能场景。一般是针对超过2种状态可能的控制功能。比如：控制按摩模式、控制RGB颜色、控制风扇左右摇头的角度等功能。最终的效果类似下面截图：
3、滑动选择组件：主要是用于用户快速调节设备从某个值到另外一个值的控制。比如：控制设备挡位调节，控制设备的速度等功能。最终的效果类似下面截图：
4、单一组件：主要用于遥控控制类功能，相当于按键，单一控制组件为单向按键，APP仅下发指令，不接收数据。
<3>：设备上报整数功能实现
我们目前在通用功能栏目，已经实现了WiFi的连接状态显示，接下来我们先从仅显示的功能做起，我们先做当前湿度显示。
进入功能定义流程，在自定义功能界面点击“添加自定义功能”按钮。功能栏最右侧的功能按钮（三个横杠)也可以。
功能名称：我们写<Humshow>，仅用于开发者自己区别功能的名称，APP不显示。
界面显示区域：我们定义到<信息展示区>。
功能组件效果：默认<设备上报的数据>。
数据类型：我们选择<整数型(int)>,开发者根据自己的功能需求填写。
数据长度：我们需要1个字节来传输数据，这里填写1。开发者根据自己的功能需求填写。
默认数据：我们填写<0>，开发者根据自己的功能需求填写，这个数据是APP未接收到有效数据时展示的数据。
状态显示：设置最大最小以及步长，我们根据需求填写最大值<100>,最小值<0>,步长<1>,开发者根据自己的功能需求填写。
单位：中文<%RH>，英文<%RH>,这个需要展示到APP，请按照需求填写。
描述信息：我们中文写<当前湿度>，英文写<Humidity>，这个是需要展示到APP里面对此功能的描述。
按照项目需求配置完成保存后，我们可以在下方的显示示意图看到效果，如下：
也可以在保存后，产品预览界面查看。
<4>：设备上报小数和负数功能实现
接下来我们做当前温度显示，查看功能定义，我们定义。
进入功能定义流程，在自定义功能界面点击“添加自定义功能”按钮。
功能名称：我们写<TEMPSHOW>，仅用于开发者自己区别功能的名称，APP不显示。
界面显示区域：我们定义到<信息展示区>。
功能组件效果：默认<设备上报的数据>。
数据类型：我们选择<整数型(int)>,开发者根据自己的功能需求填写。
数据长度：我们填写两个字节，开发者根据自己的功能数据需求填写。
默认数据：我们填写<-25.5>，开发者根据自己的功能需求填写，这个数据是APP未接收到有效数据时展示的数据。
状态显示：设置最大最小以及步长，我们根据需求填写最大值<1000>,最小值<-1000>,步长<0.1>,定义小数点后一位，开发者根据自己的功能需求填写。
单位：中文<℃>，英文<℃>,这个需要展示到APP，请按照需求填写。
描述信息：我们中文写<设备温度>，英文写<temp>。这个是需要展示到APP里面对此功能的描述。
按照项目需求配置完成保存后，我们可以在下方的显示示意图看到效果，如下：
也可以在保存后，产品预览界面查看。
- [x] 特别注意（步长非1，以及负数显示请仔细阅读下面说明）：
1、界面显示的数据=设备上报的数据*步长。也就是说，如果步长设置为0.1，APP需要显示12.6，那么，设备上报的数据实际应该为126，APP收到数据会自动乘以步长显示。
2、负数显示最小值调整为负数。
<5>：滑动选择组件功能实现（滑动条）
接下来我们功率等级限制，我们设置1-10安培以及不设限11个等级。
进入功能定义流程，在自定义功能界面点击“添加自定义功能”按钮，我们先做挡位设置功能，产看产品功能定义，挡位需要做8个等级。
功能名称：我们写<PowerLevel>，仅用于开发者自己区别功能的名称，APP不显示。
名称配置：中文写<功率等级>，英文写<Power Level>。这个是控件的命名，会显示到APP上。
界面显示区域：我们定义到<功能操作区>。
功能组件效果：我们选择<滑动选择组件>，后续将会开放更多的组件效果供选择。
数据类型：我们<整数型(int)>,开发者根据自己的功能需求填写。
数据长度：我们需要一个字节，开发者根据自己的功能需求填写。
默认标签：我们填写<0>，0我们作为不设限，我们开发者根据自己的功能需求填写，这个数据是APP未接收到有效数据时展示的数据。
状态显示：设置最大最小以及步长，我们根据需求填写最大值<10>,最小值<0>,步长<1>,开发者根据自己的功能需求填写。
单位：中文<档>，英文<geer>,这个需要展示到APP，这个是需要展示到APP里面对此功能的描述。
按照项目需求配置完成保存后，我们可以在下方的显示示意图看到效果，如下：
也可以在保存后，产品预览界面查看。
<6>：多选一组件功能实现（枚举类型）
接下来我们我们编辑开启时间，查看产品定义，定义无限制，10秒，30秒，60秒四个工作模式。我们进入功能定义流程，在自定义功能界面点击“添加自定义功能”按钮。
功能名称：我们写<timeseting>，仅用于开发者自己区别功能的名称，APP不显示。
名称配置：中文写<开启时间>，英文写<Opentime>。这个是控件的命名，会显示到APP上。
界面显示区域：我们定义到<功能操作区>。
功能组件效果：我们选择<多选一组件>，目前每个类型仅有一个组件效果，后续将会开放更多的组件效果供选择。
数据类型：我们选择<枚举型(enum)>,开发者根据自己的功能需求填写。
数据长度：我们需要一个字节，开发者根据自己的功能需求填写。
默认标签：我们填写中文<无限制>，英文<Unlimited>, 图标选择合适的即可，可以在我们的公有素材库找，也可以找美工自己设计。具体开发者根据自己的功能需求填写，这个数据APP未接收到有效数据时展示的数据。我这里选择的是公共素材库面妆图标里面的图标。
状态显示：我们在里面先添加添加<无限制>模式，点击新增按钮，再添加10秒，20秒，30秒，并可以添加相应的图标，开发者根据自己的功能需求填写。
按照项目需求配置完成保存后，我们可以在下方的显示示意图看到效果，如下：
也可以在保存后，产品预览界面查看。
<7>：二选一组件功能实现（布尔开关）
接下来我们做通道控制功能。设备有四个通道，这里我们只演示一个通道，其余三个通道类似操作填写即可。
功能名称：我们写<switch1>，仅用于开发者自己区别功能的名称，APP不显示。
名称配置：中文写<通道1>，英文写<CH1>。这个是控件的命名，会显示到APP上。
界面显示区域：我们定义到<功能操作区 >。
功能组件效果：我们选择<二选一组件 >，目前每个类型仅有一个组件效果，后续将会开放更多的组件效果供选择。
数据类型：我们选择<布尔型 (boolean)>,开发者根据自己的功能需求填写。
数据长度：我们需要一个字节，开发者根据自己的功能需求填写。
默认标签：我们填写中文<已关闭>，英文<OFF>, 图标选择合适的即可，可以在我们的公有素材库找，也可以找美工自己设计。具体开发者根据自己的功能需求填写，这个数据APP未接收到有效数据时展示的数据。
状态显示：开启状态下显示中文<已启动 >，英文<ON>，开关图标我们选择已开启状态。关闭状态下显示中文<已关闭 >,英文<OFF>，开关图标我们选择已关闭状态的图标。我这里选择的是公共素材库线状图标里面的开关。
按照项目需求配置完成保存后，我们可以在左侧展示区看到效果图，如下：
至此我们完成了所有的功能实现。
<8>：单一控制组件功能实现（按键类型）
接下来我们设备自检功能，需要app按键触发一次，设备蜂鸣器响应一次。
功能名称：我们写<Devicetesting>，仅用于开发者自己区别功能的名称，APP不显示。
名称配置：中文写<自检>，英文写<Self-check>。这个是控件的命名，会显示到APP上。
界面显示区域：我们定义到<功能操作区 >。
功能组件效果：我们选择<单一控制组件 >，目前每个类型仅有一个组件效果，后续将会开放更多的组件效果供选择。
数据类型：我们选择<单一控制>,开发者根据自己的功能需求填写。
数据长度：我们需要一个字节，开发者根据自己的功能需求填写。
默认数据：<01>，这个不必更改。
默认图标： 图标选择合适的即可，可以在我们的公有素材库找，也可以找美工自己设计。
状态显示：图标选择合适的即可，其中未触发图标指的是APP上未点击时候的图标，触发时图标指的是按中瞬间显示的图标。
至此我们完成了APP的所有界面和功能开发，点击产品预览，我们可以大体看到我们所设计开发的APP所有功能。
- [x] **特别注意：**APP功能顺序是可以自定义的，在自定义功能栏，左侧操作区域，可以调整权重排序。