_SKU_MBT0018__micro_diorama_microbit屏幕扩展板 - jimaobian/DFRobotWikiCn GitHub Wiki

本产品是一款基于micro:bit的彩色屏幕扩展板。采用了2.2寸彩色显示屏作为核心显示部件。可储存及显示彩色BMP图片、彩色文字、点、线、几何形状等众多元素。结合IoT应用场景，可绘制图表、显示天气状况等复杂显示场景。 板载五向摇杆和AB按键，集成蜂鸣器、振动电机，在用户输入和输出反馈上更加完善易用。 产品提供多种供电方式：PH2.0外接电源、USB外接电源、和金手指供电三种方式。使用灵活方便。 产品支持makecode图形化编程平台。

• 供电方式：1、micro:bit I/O扩展板供电 2、PH2.0接口供电，3.5V~5V（3节4.5V电池盒或3.7V锂电池）3、USB接口外接供电
• 方向键（上：P6 下：P7 左：P9 右：P10 中：P8）及A B 按键
• 蜂鸣器 ×1
• 振动电机 ×1
• LED显示屏:2.2寸
• 产品尺寸：75 × 60 mm
• 编程平台：makecode图形化编程

屏幕X轴Y轴方向：

MakeCode基础教程：点击进入makecode在线图形化编程基础操作教程 micro:bit屏幕扩展库地址：https://github.com/DFRobot/pxt-Micro-Diorama 关于如何添加软件库 IoT扩展库地址：https://github.com/DFRobot/pxt-HTTP-MQTT[关于如何添加软件库](http://wiki.dfrobot.com.cn/index.php?title=MakeCode%E5%9C%A8%E7%BA%BF%E5%9B%BE%E5%BD%A2%E5%8C%96%E7%BC%96%E7%A8%8B%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C%E6%95%99%E7%A8%8B)

开始例程运行结果：初始化参数，清除屏幕内容。在使用本扩展板的时候，必须使用一次这个程序模块。

设置背景颜色例程运行结果：将屏幕扩展的屏幕背景颜色设为蓝色。 使用方法：

显示字符例程运行结果：在micro:bit屏幕扩展板的屏幕上，坐标为（X：50 Y：60）的位置显示"HI DFRobot"，显示字符颜色为黑色。

按键P8按下后程序运行结果：在micro:bit屏幕扩展板的屏幕上，坐标为（X：50 Y：60）的位置显示"HI DFRobot"，显示字符颜色为黑色。

振动电机例程运行结果：振动电机振动1秒后停止振动，等待1秒后继续振动。

画线例程运行结果：在micro:bit屏幕扩展板的屏幕上画X起始位置10，X结束位置310，Y起始位置50，Y结束位置50的一条红色直线。 画线效果图：

画圆例程运行结果：在micro:bit屏幕扩展板的屏幕上画半径为40，圆心X为120，圆心Y为120的红色圆，画完后将圆定义为对象，对象名为Circle2。 画圆效果图：

画矩形例程运行结果：在micro:bit屏幕扩展板的屏幕上画X起始位置120，X结束位置160，Y起始位置50，Y结束位置150的红色矩形，并将画出的矩形定义为对象，对象名为Rectangle。 画矩形效果图：

画点例程运行结果：在micro:bit屏幕扩展板的屏幕上，坐标X为50，坐标Y为80的位置画一个红点。 画点效果图：

支持的图片格式：BMP图片，不支持其它格式的图片，如：jpg，png等图片，图片分辨率不能大于320*240 使用图片前，请将BMP格式的图片通过扩展板的USB口拷贝到内存中。程序中使用的图片名称，必须和磁盘内的文件名相同，图片文件名必须为英文字符，不能是中文 1、插上扩展板的USB接口连接电脑，此时，电脑出现一个空间为2M可移动磁盘； 2、将BMP格式的图片拷贝到可移动磁盘； 例程图片下载地址：https://github.com/DFRobot/LCD-picture 图片显示来源为屏幕扩展板的内存中。 图片导入：将POWER按键拨到ON端，接上USB数据线，将照片放入micro:bit屏幕扩展的内存中，分辨率320X240。 显示图片程序运行结果：全屏显示名为：“Car”图片。 注意：在设置显示图片时，当Y位置设为70则图片的高度不能超过170，如果X位置为70则图片宽度不能超过250，如果图片位置设置好，图片大小就必须在设置的范围内如果超出图片将无法显示。 显示图片效果图：

判断图片是否重叠依据：通过判断两张图片的像素点是否重叠。 判断图片是否重叠程序运行结果：如果图片A与图片B像素点重叠，在micro:bit屏幕扩展板的屏幕上，坐标为（X:80,Y:80）的位置显示HI DFROBOT。

导入图片例程运行结果：导入内存中的图片，并将图片定义为对象，分辨率：128X128

释放句柄例程运行结果：将导入图片的对象释放掉，因为只能导入4张64X64的小图 4张128X128的大图，如果不释放句柄就会导致不能在导入其他的图片为对象。

以下，我们将通过一个例程，来获取新加坡的天气，这个例程的运行结果：在屏幕上显示新加坡城市sentosa的天气、温度、湿度、风速。

一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005）×1 micro:bit 屏幕扩展板 ×1 OBLOQ物联网模块 ×1 CR123A锂电池（3.6V） ×1

二、然后，我们需要在makecode中导入物联网的库以及屏幕扩展板的库： 1、导入屏幕扩展板运行库（已导入的请忽略）：https://github.com/DFRobot/pxt-Micro-Diorama 2、导入makecode的物联网运行库：https://github.com/DFRobot/pxt-HTTP-MQTT

三、将模块、主板、扩展板正确的连接： OBLOQ的绿色线接到扩展板的P1口，蓝色线接到P2口，红色线接到VCC，黑色线接到GND； 当通电后，OBLOQ模块的指示灯显示蓝色，表示正在连接网络，显示绿色，表示网络连接成功。

四、编写makecode程序： 五、效果展示：

以下，我们将通过一个发送邮件的例程，来讲解IFTTT的使用方法。 一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005）×1 OBLOQ物联网模块 ×1 CR123A锂电池（3.6V） ×1

二、然后，我们需要在makecode中导入物联网的库： 1、导入makecode的物联网运行库：https://github.com/DFRobot/pxt-HTTP

三、将模块、主板、扩展板正确的连接： OBLOQ的绿色线接到扩展板的P1口，蓝色线接到P2口，红色线接到VCC，黑色线接到GND； 当通电后，OBLOQ模块的指示灯显示蓝色，表示正在连接网络，显示绿色，表示网络连接成功。 四、使用IFTTT发送邮件配置： 1、首先进入IFTTT官网，注册账号，IFTTT官网：https://ifttt.com。 2、账号注册完成后会出现如下界面点击Get more然后下滑找到Create your own点击进入。 3、点击进入后就可以看到如下界面 然后点击This进行This配置，在输入框中输入webhooks。 4、找到之后点击进去第一次会出现第一张图点击Connect，在选择“Receive a web request”，点击进去后填写Event Name就完成this的创建。 5、创建完成后会自动返回，然后在点击That进行That设置，找到Email点击进入，如果没有找到可以在方框中进行搜索。 进入后选择send me an email 接下来就是选择给你邮件里的内容了，我这里直接选择默认的。 点击Create action 即可创建完成。 查看密钥点击HOME进入“webhooks”主页面在点击“Documentation”就能查看到密钥了。

五、makecode代码： 当按下A键后将“HI DFROBOT”发送到我的邮箱中去。 六、效果展示：

前面我们已经介绍过如何通过IFTTT给邮箱发送邮件，以下我们将介绍通过IFTTT给印象笔记发送笔记： IFTTT向印象笔记发送笔记的硬件、库地址及硬件链接电路同使用IFTTT发送邮件相同，这里就不在阐述，请参见使用IFTTT发送邮件。 一、首先配置IFTTT 1、点击账户选择create后就可以看到如下界面 然后点击This在输入框中输入webhooks。 2、点击进去之后在点击“Receive a web request”，进去后填写Event Name就完成this的创建。 3、this创建完成后会自动返回，在点击That搜索Evernote并选择他 印象笔记中内容解释： 1、创建注释：在指定的笔记中创建注释。 2、附加说明：将说明附加到标题和笔记的注释中。 3、附加待办事项及注意：将一个待办事项复选框添加到标题和笔记的注释中。 4、创建链接备注：将指定笔记中的源URL创建新的链接备注。 5、从URL创建图像注释：在指定的笔记中创建带有图像附件的注释。 6、从URL中创建音频笔记：在指定的笔记中创建带有音频附件的笔记。 我选择的是“Create a note” 4、格式选择的默认格式 5、点击Create action 即创建完成。 二、makecode代码： 当按下A键后向我的笔记中发送“HI DFROBOT”。

三、效果展示：

• 接下来，我们需要对 microbit 设备进行编程，配置上网的密码等等，程序设置好就可以上网了。但是，我们这些信息传到互联网上之后，这些信息是怎么被查看的呢？这个信息到底发送给谁呢？
• 打开网址：http://iot.dfrobot.com.cn/，可以进入终端网页 Easy IoT。

• micro:bit主控板、micro:bit物联网扩展板配合Easy IoT终端网页，是一整套物联网系统。
• 注册登录

  • 1.进入终端网页Easy IoT之前，需要注册一个个人后台监控账号。点击右上角的“注册/登录”。

  • 2.填写个人信息，可以通过个人手机或者邮箱注册。

  • 3.注册成功后，登录账号进入工作间，就是可以检测microbit设备的数据界面了。需要通过添加新设备，才能够和自己microbit设备进行配对。

File:注册登录.png|1.进入工作间 File:填写个人信息.png|2.填写个人信息 File:登录easyIOT.png|3.添加新设备

• Easy IoT设置
  • 1.新设备建立之后，会自动生成随机的设备的Topic: elJA7JHZg，每个人的都不一样；点击设备名称，可以进行重新命名。
  • 2.点击发送消息，可以看见接收信息与发送信息的终端页面，详细的看到终端收到的数据，并且可生成图表。（点击查看详情，可以查看生成的图表）。
  • 3.认识页面的其他信息——ID账号界面。

File:EASY.png|1.设置设备 File:查看生成图表.png|2.查看生成的图表 File:认识其他页面.png|3.认识ID账号界面

makecode源程序：智能表情包源程序 功能描述：通过Easy IoT平台发送消息，当Obloq收到消息后，micro:bit显示设定好的表情。 参考程序

File:表情包 w.png|智能表情�

程序效果：

• 进入 Easy IoT 网页发送信息给 micro:bit 设备。找到相应的 Topic，点击“发送消息”。

• 将想要发送的指令，填写在对话框中，点击发送，即可将消息发送出去，发送指令“yes”，micro:bit显示“√”图案；发送指令“no”，显示“×”；发送指令“cry”，显示“哭脸”；发送指令“smile”，显示“笑脸”。

makecode源程序：远程开灯程序 功能描述：将LED灯接在16引脚上，通过Easy IoT平台发送消息，当Obloq收到“ON”时，将16引脚定义为“1”，开灯;当Obloq收到“OFF”时，将16引脚定义为“0”，关灯。 参考程序 程序效果：

• 进入 Easy IoT 网页发送信息给 micro:bit 设备。找到相应的 Topic，点击“发送消息”。

• 将想要发送的指令，填写在对话框中，点击发送，即可将消息发送出去，发送指令“ON”，LED灯亮；发送指令“OFF”,LED灯灭。

接下来我们将介绍Beebotte使用方法： 向Beebotte发送数据的硬件、库地址及硬件链接电路同使用IFTTT发送邮件相同，这里就不在阐述，请参见使用IFTTT发送邮件。 一、首先配置Beebotte 1、官网地址https://beebotte.com 2、进入官网，注册自己的账号，注册完成后，回到主页，点击Get Started for Free 3、创建自己的Channels 4、进入到Create New界面创建你的Channel Name、 Channel Description、Resource name、 Resource Description。可以创建多个Resource。 5、例如创建一个简单的接收数据 创建完成后就可以看到 6、云平台就创建好了，接下来我们开始获取API Key 和 Secret Key，先点击Account Settings在点击Access Management就可以查看。 7、如果想要查看上传的历史值，可以通过创建Dashboards来查看值的曲线图及具体的值。

• 创建时间线图表

二、效果展示： 当按下A键后向Beebotte中的Digital发送56。 向Beebotte发送数据例程效果：

前面我们介绍了Beebotte的物联网平台的使用，接下来我们在来介绍一下ThingSpeak物联网的使用方法。 一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005）×1 OBLOQ物联网模块 ×1 CR123A锂电池（3.6V） ×1 Gravity模拟环境光线传感器 ×1 二、然后，我们需要在makecode中导入物联网的库： 1、导入makecode的物联网运行库：https://github.com/DFRobot/pxt-HTTP-MQTT

三、将模块、主板、扩展板正确的连接： OBLOQ的绿色线接到扩展板的P1口，蓝色线接到P2口，红色线接到VCC，黑色线接到GND； 当通电后，OBLOQ模块的指示灯显示蓝色，表示正在连接网络，显示绿色，表示网络连接成功。 再将Gravity模拟环境光线传感器接在P0引脚上面。 四、ThingSpeak配置: 1、ThingSpeak的官方网址：https://thingspeak.com。 2、进入官网进行注册，注册完成后就可以以下界面。 如果没有看到，也可以点击Channels会出现下拉框，在点击My Channels也可以找到上面的界面。 2、前面步骤完成后就可以创建频道了，点击New Channels就可以看到下面的界面 在这里面我们只需要将Name填写上和勾选上field数量就可以了，在makecode库中只定义三个参数，所以最多勾选三个，在用时填写几个参数就勾选几个，我在这里勾选三个， field的名称也可以自定义，我这里就使用默认的，将这些处理完就可保存频道了下面是我创建的频道。 3、保存后频道就创建完成，创建好的频道就如下图，在里就能看到传输上来的参数，在点击API Keys就可以查看对应频道的密钥。 五、makecode完整代码: 当按下A键后向ThingSpeak发送变量X，温度，光线强度。 六、效果展示:

前面我们介绍了如何使用定义的模块向ThingSpesk发送数据，接下来我们介绍一下如何使用HTTP直接发送数据，不使用定义的模块,这里使用GET模块。 直接使用HTTP定义的模块发送数据的硬件、库地址及硬件链接电路同使用IFTTT发送邮件相同，这里就不在阐述，请参见使用IFTTT发送邮件。 ThingSpesk如何使用请参见向ThingSpeak发送数据。 现在开始画重点，在ThingSpeak官网注册好并创建好频道后，点击频道中的API Keys就会看到如下界面，在标注的红色框中就可以看到我们需要填写在HTTP中的API。 将库导入makecode中去，先将WIFI配置和HTTP配置拖入模块中去，将WIFI配置好在填写HTTP配置模块，HTTP模块端口号填写80，前面的IP填写下图红色方框中内容， 注意不要将斜线填入，填写好效果如下。 前面填写好后就是GET模块的URL的填写,URL填写部分为斜线后面的部分，内容为下图红色方框中内容，“=”后面为传输的数据, 如果需要传输多个数据，数据之间用“&”链接,数据前面需要加上子频道的标号，标号为下图红色方框中内容， 如果不知道可以点击频道中的“Channel Settings ”进行查看，下图为填写好效果，将发送两个数据上去，一个78，一个39,按下A键将数据推送到ThingSpesk。 效果展示：

前面讲解了如何使用定义好的模块通过IFTTT来发送邮件，现在我们来讲解一下如何直接通过HTTP模块，如何填写里面的内容，这里使用HTTP的POST模块， IFTTT如何使用在前面已经讲解过，这里就不在阐述，如有疑问请参见IFTTT发送邮件，这里我们同样的使用IFTTT发送邮件，之前我们讲解过如何查看秘钥，如下图 这里我们同样使用相同的方法进入到这个页面中去，在这里就可看到我们需要填写在HTTP的POST中的数据，如下图 HTTP配置填写的数据同GET类似，如下 填写效果如下 前面填写完成后，就需要填写POST的URL和Content，填写内容分别对应下图框一和框二 第一个框中的“AAA”为注册的“Event Name”，如果不清楚请参考IFTTT发送邮件，第二个框中的“12”“13”“16”为传输的数据，下图为填写好的效果图 按下A键后数据将发送到我的邮箱中去 效果展示：

接下来我们将介绍屏幕扩展板的一些相关应用，首先第一个是将获取的天气显示在屏幕上；第二个是在屏幕上显示光线变化的折线图； 第三个是吃面包游戏；最后一个是飞翔的小鸟游戏。

一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005） ×1 micro:bit 屏幕扩展板 ×1 OBLOQ物联网模块 ×1 CR123A锂电池（3.6V） ×1

二、然后，我们需要在makecode中导入物联网的库以及屏幕扩展板的库： 1、导入屏幕扩展板运行库（已导入的请忽略）：https://github.com/DFRobot/pxt-Micro-Diorama 2、导入makecode的物联网运行库：https://github.com/DFRobot/pxt-HTTP-MQTT 3、获取天气代码及天气图标库：https://github.com/DFRobot/LCD-picture

三、将模块、主板、扩展板正确的连接： OBLOQ的绿色线接到扩展板的P1口，蓝色线接到P2口，红色线接到VCC，黑色线接到GND； 当通电后，OBLOQ模块的指示灯显示蓝色，表示正在连接网络，显示绿色，表示网络连接成功。

四、makecode 完整代码： 显示获取天气信息例程运行结果：在micro:bit屏幕扩展板的LED屏幕上显示获取的天气情况， 显示位置（X:20,Y:0）显示天气情况； 显示位置（X:20,Y:20）显示获取温度; 显示位置（X:20,Y:40）显示获取的湿度； 显示位置（X:100,Y:60,分辨率为200X140）天气图片。 四、效果展示：

一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005） ×1 micro:bit 屏幕扩展板 ×1 Gravity:模拟环境光线传感器 ×1 CR123A锂电池（3.6V） ×1 二、然后，我们需要在makecode中导入屏幕扩展板的库： 1、导入屏幕扩展板运行库（已导入的请忽略）：https://github.com/DFRobot/pxt-Micro-Diorama 三、将模块、主板、扩展板正确的连接： 将光线传感器正确连接在IO扩展板P2引脚上，在将屏幕扩展板和micro:bit主板连接，插入到IO扩展板上，库和硬件都处理好后就可以开始编写程序。

四、makecode 完整代码： 下载代码到micro:bit上，代码下载后如果没有能正确显示，请按下复位键 晃动光线传感器LED屏幕上将会连续显示16秒光线强度变化的折线。 光线强度折线例程代码下载：https://makecode.microbit.org/_LvaWR0YbiRfx 五、效果展示：

一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005） ×1 micro:bit 屏幕扩展板 ×1 CR123A锂电池（3.6V） ×1 二、然后，我们需要在makecode中导入屏幕扩展板的库： 1、导入屏幕扩展板运行库（已导入的请忽略）：https://github.com/DFRobot/pxt-Micro-Diorama 三、主板、扩展板正确的连接： 将屏幕扩展板和micro:bit主板连接，插入到IO扩展板上，库和硬件都处理好后就可以开始编写程序。 四、makecode 完整代码： 将代码下载到micro:bit中，通过将micro:bit屏幕扩展板左右倾斜来控制人物左右移动，面包会从屏幕上方的不同位置出现，当人物与面包的像素点重合的时候 表示已经吃到面包，此时会振动一下，如果没有吃到则无任何反馈。 吃面包例程代码下载：https://makecode.microbit.org/_TxDiaMPDEhde

一、首先，我们需要准备以下硬件： micro:bit 主板 ×1 micro:bit IO扩展板（MBT0005） ×1 micro:bit 屏幕扩展板 ×1 CR123A锂电池（3.6V） ×1 二、然后，我们需要在makecode中导入屏幕扩展板的库： 1、导入屏幕扩展板运行库（已导入的请忽略）：https://github.com/DFRobot/pxt-Micro-Diorama 三、主板、扩展板正确的连接： 将屏幕扩展板和micro:bit主板连接，插入到IO扩展板上，库和硬件都处理好后就可以开始编写程序。 四、makecode 完整代码： 飞翔的小鸟在游戏开始前会出现倒计时，当倒计时完，小鸟和障碍物就会出现，当小鸟掉到最低和触碰到障碍物时游戏结束 小鸟需要从两个障碍物之间飞过来躲避障碍物，按下A键小鸟向上飞10个像素点，当没有任何操作时小鸟下降40个像素点，所以想要让小鸟在原地需要按4次按键， 当游戏结束后按下B键会出现计分板，在按下B键游戏从新开始游戏。 飞翔的小鸟例程下载：https://makecode.microbit.org/_X156z0DqTeTD

更多问题及有趣的应用，请访问论坛

Link DFRobot商城购买链接