[ruff学习]按键抢答器的实现


前几天入了ruff的板子,今天撸了官网的官方教程SOS 求救灯 ,还有后面的课后练习-按键抢答器。

按键抢答器

使用三个按键模块和两个板载LED灯。

  • 如果按键 A 按下,板载蓝灯(led-b)亮;
  • 按键 B 按下,板载红灯(led-r)亮;
  • 按键 C 用于重置抢答器,C 键按下,两灯都灭;
  • 按键 A 或 B 按下后,直到按下按键 C 重置抢答器,即使另一按键按下,两LED 灯也不会有变化。

效果演示

实践

材料清单

我看了看后面的回复

因为套件里面只有两个大按钮,就使用板载的button-k2来作为重置按钮了

  • 2个大按键模块
  • ruff板子
  • 6根杜邦线图1 材料清单

部署项目

在此之前你需要参看官网写的

我这里用的是AP模式部署

step1:新建项目文件夹

1
2
mkdir responder
cd responder

step2:项目初始化

1
rap init

step3:添加外设(参照这里)

1
2
rap device add button_a
? model: CK002

1
2
rap device add button_b
? model: CK002

step4:硬件布局按图连线

1
rap layout --visual

连线示意图

事件绑定

src/index.js具体的代码
switchLed() 根据按钮的id来选择要触发的事件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function switchLed(id){
switch(id){
case 'button_a':
if(!$('#led-b').isOn()) $('#led-r').turnOn();
break;
case 'button_b':
if(!$('#led-r').isOn()) $('#led-b').turnOn();
break;
case 'button-k2':
$('#led-r').turnOff();
$('#led-b').turnOff();
break;
}
}

$.ready 中代码逻辑

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$.ready(function (error) {
if (error) {
console.log(error);
return;
}
$('#button_a').on('push', function(){
console.log('Button_a pushed.');
switchLed('button_a');
});
$('#button_b').on('push', function(){
console.log('Button_b pushed.');
switchLed('button_b');
});
$('#button-k2').on('push', function(){
console.log('Button-k2 pushed.');
switchLed('button-k2');
});
});

------ 本文结束 ------
谢谢打赏~
Fork me on GitHub