当前位置:   article > 正文

【物联网】JavaScript快速开发智能硬件应用—ruff开箱篇(一)

ruff 只能用fuff开发板么

前言

最近听到有小伙伴们对ruff感兴趣,我也跟着加入了大军中,本篇文章展示了ruff的开发套件,以及入手后的小demo,后续持续更新
参考文献
ruff官网
ruff思否首页

开箱

如同ruff官网展示的配件如下
图片描述
图片描述
图片描述

上手

ruff官方API

  • 我开发时使用的是windows系统,所以下载 Ruff SDK 1.11.10 (Windows-64bit): msi 安装包
  • 创建项目文件,在当前目录执行下面命令
  1. # 查看版本号 (首次安装好MSI如果执行下面命令不成功,可以尝试重启电脑)
  2. rap --version
  3. # 初始化 Ruff 应用
  4. rap init
  • init后会创建项目工程,使用编辑器打开由 rap 自动生成的 src/index.js js文件进行编写代码,具体可以参照下文demo,或者官网
  • 将 Ruff 开发板上的 USB 接口与 USB 电源线连接,开发板成功启动后,会搭建一个名为Ruff_[]的无线热点
  • 连接这个无线热点后,执行项目部署,执行下面命令
  1. #项目部署
  2. rap deploy -s
  • 红色板载 LED 点亮后表示已经运行成功

图片描述

  • 主板运行起来后,开始好玩的东西,就是添加不同外设(外设就是图一的配件)
  • 添加外设
  1. #添加botton外设
  2. rap device add button
  3. #CK002为外设型号 外设型号包装上有写 详见上文图三
  4. ? model: *CK002*
  5. #添加LED外设 下文DEMO需要用到LED外设,所以我这边提前添加,流程参考上方
  6. rap device add led
  • 添加后开始进行硬件布局,这时候记得将主板断电
  1. #硬件进行布局和连接撒旦
  2. rap layout
  3. #查看硬件布局的可视图(不懂的外设怎么装,可以看看这个)
  4. rap layout --visual

图片描述
visual的视图

  • 部署
  1. #开始部署
  2. rap deploy -s
  3. #查看日志
  4. rap log

七彩循环灯

ruff七彩循环灯

  1. // 做了个按下botton外设,led外设 循环闪烁颜色,松开botton外设,停止led灯的小demo
  2. $.ready(function (error) {
  3. if (error) {
  4. console.log(error);
  5. return;
  6. }
  7. const color = {
  8. red: 0xff0000,
  9. blue: 0x0000ff,
  10. green: 0x00ff00,
  11. purple: 0xff00ff,
  12. cyan: 0x00ffff,
  13. yellow: 0xffff00,
  14. white: 0x000000
  15. };
  16. const light = function(){
  17. setInterval(function () {
  18. $('#led').setRGB(color.blue);
  19. setTimeout(function () {
  20. $('#led').setRGB(color.green);
  21. }, 100);
  22. setTimeout(function () {
  23. $('#led').setRGB(color.cyan);
  24. }, 200);
  25. setTimeout(function () {
  26. $('#led').setRGB(color.red);
  27. }, 300);
  28. setTimeout(function () {
  29. $('#led').setRGB(color.purple);
  30. }, 400);
  31. setTimeout(function () {
  32. $('#led').setRGB(color.yellow);
  33. }, 500);
  34. setTimeout(function () {
  35. $('#led').setRGB(color.white);
  36. }, 600)
  37. }, 30);
  38. }
  39. // 在 `#button` 按下时点亮 `#led-r`.
  40. $('#button').on('push', function () {
  41. console.log('Button pushed.');
  42. light();
  43. $('#led-r').turnOn();
  44. });
  45. // 在 `#button` 释放时熄灭 `#led-r`.
  46. $('#button').on('release', function () {
  47. console.log('Button released.');
  48. clearInterval(light);
  49. $('#led-r').turnOff();
  50. });
  51. });

最终效果图
图片描述

声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop】
推荐阅读
相关标签
  

闽ICP备14008679号