Node-RED系列（九）：Node-RED面板dashboard节点的使用

Node-RED系列文章目前已经写了8篇，介绍了Node-RED的安装以及默认安装的一些基本节点的使用，作为物联网的一个可视化拖动的流程,Node-RED的确实很容易上手。还没开始学习的同学可以先看下我以前的文章

物联网平台Node-RED系列（一）：Node-RED的介绍与安装

物联网平台Node-RED系列（二）：Node-RED的面板的操作

物联网平台Node-RED系列（三）：Node-RED公共节点的使用

物联网平台Node-RED系列（四）：Node-RED函数节点的使用

物联网平台Node-RED系列（五）：Node-RED序列节点的使用

物联网平台Node-RED系列（六）：Node-RED解析节点的使用

物联网平台Node-RED系列（七）：Node-RED存储节点的使用

物联网平台Node-RED系列（八）：Node-RED网络节点的使用

本期我给大家认识一下Node-RED的第三方节点库，dashboard，该库提供另一个可配置的UI页面，可以配置一些表单元素，以及图表。 先来看一下别人使用dashboard制作的面板吧

是不是很漂亮。

接下来我们一起来安装一下这个节点库，并且体验一下他的一些节点。

首先我们要安装一下这个库 点击设置

打开设置面板

搜索dashboard 节点库

完整的名字叫做node-red-dashboard 搜索出来后，点击安装即可，

安装需要一点时间，稍等一会。安装完成后，刷新一下页面.就可以在节点列表的左侧看到相应的节点

一共有16个节点，分别是

button 按钮节点 dropdown 下拉选择节点 switch 开关节点 slider 轮播图 numeric 数字滑块 text input 文本输入 date picker 日期选择 colour picker 颜色选择器 form 表单 text 文本显示 gauge 仪表板 chart 图表，折线图 audio out 音频输出 notification 通知 ui control ui控制 template 模板

安装之后，我们就可以使用了，首先我们将一个button的节点拖放到Flow中 双击button节点，进行编辑详情。 首先Group的输入框是红色的，意味着我们首先要把Group属性完善一下。

点击右侧的笔

点击之后进入了一个Group的配置页面

但表单项Tab也是红色的，所以继续下潜，完善更底层的配置， 点击之后

是一个配置Tab的页面，配置Tab的名称，以及图标。图标可用的在 https://klarsys.github.io/angular-material-icons/

都配置完成后

点击完成。 点击部署

这样我们就部署了一个按钮节点到Dashboard中， 部署后我们到哪里去看配好的页面那。 默认是到这个地址访问UI。 http:// ip+port/ui

以我的为例，Node-RED的访问地址是http://192.168.99.102:1880/#

那么ui的访问地址就是 http://192.168.99.102:1880/ui/