[ Ruff 开发套件 ] Lesson 3 - LCD 抢答器


(Bonnie) #1

第三课 LCD 抢答器

  • 谁将登场
    • LCD 模块
    • 按键模块
  • 你将学会
    • LCD 模块的初级使用

介绍

第一课课后作业“抢答器”大家实现了么?这节课将实现一个带 LCD 屏的抢答器:

  • LCD 屏初始显示 “Welcome !” 欢迎字样;

  • 3秒后,显示“Who faster?”;

  • 按键 A 按下,板载蓝灯(led-b)亮,LCD 屏显示 “Blue faster!” ;

  • 按键 B 按下,板载红灯(led-r)亮,LCD 屏显示 “Red faster!” ;

  • 按键 C 用于重置抢答器,C 键按下,LCD 屏显示 “Who faster?” ;

    • 按键 A 或 B 按下后,直到按下按键 C 重置抢答器,即使另一按键按下,LCD 屏也不会有变化。
    • 直到显示“Who faster?”,之前按键 A 或 B 按下 LCD 屏也不会有变化。

元件

  • Ruff 开发板
  • 大按键模块(3个)
  • LCD 模块

外设添加

向项目中添加三个大按键模块,

  • button_r 对应红按键

  • button_b 对应蓝按键

  • button_reset 对应重置按键,
    model 都选择 CK002,驱动版本选择最新版。

    • 添加红色大按键;
    • 添加蓝色大按键;
    • 添加重置按键;
  • 向项目中添加名为lcd的 LCD 模块,

    • model 选择 lcd1602-02,驱动版本选择最新版。

    • 添加 LCD 模块

代码

  • 在编写代码之前需要完成 Ruff 开发板的设置连接、硬件连线。如果有疑问大家可以在第零课了解,也可以到这里了解。

  • 想了解 Ruff 应用开发步骤和模型,可以到这里

初始化

我们首先初始化 LCD 屏以及抢答标志位:

  • 初始化抢答标志位为 false,该标志位用于控制是否允许抢答;

  • 打开 LCD 屏幕,并打印欢迎语;

  • 很短的延迟后,使用print() 函数在屏幕上打印抢答开始语;

  • 设置抢答标志位为 true,允许红蓝双方抢答;

  • 抢答器初始化代码如下:

  • 可以在这里进一步学习 LCD 模块知识;

抢答

接下来,我们实现抢答。

  • 检测红蓝按键模块的 push 事件,一旦检测到信号,执行相对应的“行为”函数。

  • 行为函数中判断抢答标志位是否为 true:

    • 如果为 true,
      • 使用clear() 函数将 LCD 清屏;
      • 使用print() 函数打印“ red win !” 或 “blue win !”;
      • 设置抢答标志位为 false,红蓝双方抢答无效。
    • 如果为 false,不进行操作。
  • 想复习大按键模块的知识,可以前往Ruff-大按键模块

  • 大按键抢答实现:

重置

抢答器的多次使用需要将抢答器重置到初始状态。

我们将解决:如何重置抢答器

  • 检测重置按键模块的 push 事件,一旦检测到信号,执行相对应的“行为”函数。

  • 行为函数中

    • 使用clear() 函数将 LCD 清屏;
    • 使用print() 函数打印抢答开始语;
    • 设置抢答标志位为 true,允许红蓝双方抢答;
  • 抢答器重置实现:

    ​​

最后,

  • 初始化抢答重置 的实现放在 $.ready 事件下。

完整代码

'use strict';

$.ready(function (error) {
    if (error) {
        console.log(error);
        return;
    }

    var r_or_b = false;
    $('#lcd').turnOn();
    $('#lcd').print('welcome!');
    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('Who faster?');
            r_or_b = true;
    }, 3000);

    $('#button_r').on('push', function () {
        if (r_or_b) {
            $('#lcd').clear();
            $('#lcd').print('Red faster!');
            r_or_b = false;
        }
    });
  
    $('#button_b').on('push', function () {
        if (r_or_b) {
            $('#lcd').clear();
            $('#lcd').print('Blue faster!');
            r_or_b = false;
        }
    });
  
    $('#button_reset').on('push', function () {
        $('#lcd').clear();
        $('#lcd').print('Who faster?');
        r_or_b = true;
    });
});

课后练习

为本节课的抢答器加入倒数计时功能,完善成一个实用的抢答器:

  • LCD 屏初始显示 “Welcome !” 欢迎字样;
  • 2秒后显示“Who is the faster?”,
  • LCD 屏上开始倒数3秒:“3”“2”“1”“GO!!!”;
  • 按键 A 按下,板载蓝灯(led-b)亮,LCD 屏显示 “Blue faster!” ;
  • 按键 B 按下,板载红灯(led-r)亮,LCD 屏显示 “Red faster!” ;
  • 按键 C 用于重置抢答器,C 键按下,
    • LCD 屏显示 “Who is the faster?”
    • 开始倒数3秒,3秒后A 和 B 按键可以抢答;
  • 按键 A 或 B 按下后,直到按下按键 C 重置抢答器,即使另一按键按下,LCD 屏也不会有变化。

(sunbreak) #2

课后练习

'use strict';

$.ready(function (error) {
    if (error) {
        console.log(error);
        return;
    }

    var r_or_b = false;
    $('#lcd').turnOn();
    $('#lcd').print('Welcome!');
    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('Who faster?');
    }, 2000);

    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('3');
    }, 3000);

    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('2');
    }, 4000);

    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('1');
    }, 5000);

    setTimeout(function () {
            $('#lcd').clear();
            $('#lcd').print('GO!!!');
            r_or_b = true;
    }, 6000);

    $('#button_a').on('push', function () {
        if (r_or_b) {
            $('#lcd').clear();
            $('#lcd').print('Red faster!');
            r_or_b = false;
        }
    });
  
    $('#button_b').on('push', function () {
        if (r_or_b) {
            $('#lcd').clear();
            $('#lcd').print('Blue faster!');
            r_or_b = false;
        }
    });
  
    $('#button-k2').on('push', function () {
        $('#lcd').clear();
        $('#lcd').print('Who faster?');
        r_or_b = true;
    });
});