论坛 › 树莓派 › 【嘉年华展示】M5Stack——班主任助手

云天 发表于 2019-9-26 10:19:09

【嘉年华展示】M5Stack——班主任助手

本帖最后由 云天 于 2019-10-1 09:43 编辑

    M5Stack拿到手，在外观上看着就感觉很不错。
    M5Stack是一种模块化、可堆叠扩展的开发板，每个模块均为5cmX5cm的尺寸，这也是M5Stack名字的由来。
与常规的开发板不同，M5Stack更注重产品形态的完整性，更注重用户的应用场景和研发的简易性，M5没有密密麻麻的飞线，没有错乱无章的接口插头，不需要繁琐的开发流程，简简单单、轻轻松松地完成高质量的电子原型创作。
   M5Stack主要采用ESP32芯片体系，CORE主机内已集成了240M双核主频CPU、 WiFi、蓝牙、2.0寸彩色屏幕、喇叭、按键、TF卡、陀螺仪以及内置电池。CORE基本满足一般的功能需求，功能模块FunctionModule则根据应用的情况选择，比如电机驱动、信号采集、通信等功能。另外，也会配备不同的应用底座及配件，方便用户做出高质量的研发。

    在使用手册上Quick Start中，提示安装Arduino IDE，加载ESP32 Board，连接失败，加载库 M5Stack 速度很慢。这应该和连接的网站有关系，相关网站也提供了镜像。
    暂时不使用Arduino IDE了，果断采用由M5官方自主研发的图形化网络化IDE平台--UIFlow，它支持Blockly以及MicroPython编程(可选择中文版)，也支持网络推送部署以及就地USB下载调试。
   


项目：班主任助手

设计背景：
   
    我所在的高中是县高中，班里所有学生都住校，个别学生的家在几百公里以外。学校对学生使用手机有着严格的规定，在学校内禁止私自使用手机。学生与家长的联系主要是通过校内固定电话、到班主任处拿个人手机。而家长联系学生只能通过班主任这一种方式。而班主任又不是每天都在学校，如早自习和晚辅导，尤其是周六日。这样家长通知孩子的一些事，如要来看孩子、给孩子拿了什么东西，比如衣服、药品等，又不能确定时间。家长和班主任联系，班主任不在学校，只能与学校的同办公室的值班老师联系，他可能在上课，也可能电话不在身边等等情况，很不方便。为此，我们将使用M5Stack解决这一问题。
    设计思路：
设计手机APP，通过LOT与M5Stack通信，传递班主任的信息。将M5Stack放置在班级里，安排专门学生负责在课间查看。


    实现条件：
    M5Stack有WiFi功能，可以连接学校校园网，利用“2.0寸彩色屏幕”，显示要通知的信息，喇叭可以用来提醒“有信息”，三个按键满足信息上下翻页浏览。内置电池，不用外接电源，班级放置位置可选择空间大。

   设计过程：

    1、M5Stack连接互联网
    使用校园网WIFI进行互联网连接，具体可能参考https://m5stack.oss-cn-shenzhen. ... Flow-Book-zh_cn.pdf，56页“配置WIFI”。

    2、配置Easy lot
    Easy IoT是一个国际化物联网服务平台 https://iot.dfrobot.com.cn/，可以对联网的传感器/执行器数据进行实时监控和反馈，统计和分析已经接收的数据，并向传感器/执行器发送数据，帮助实现控制效果。
    操作方法可参考https://iot.dfrobot.com.cn/docs/。




    3、M5Stack M5Flow连接Easy lot程序设计
        4、解决使用M5Flow显示汉字问题，16*16
   M5Flow不支持显示汉字，已和技术员沟通，“arduino”里有示例。因我暂时不想跑“arduino”。只能来到M5Flow中的Python试一试，经过不断摸索终于显示汉字。    附上代码
from m5stack import *
from m5ui import *
from uiflow import *
import binascii
setScreenColor(0x222222)
KEYS =
#初始化16*16的点阵位置，每个汉字需要16*16=256个点来表示
rect_list = [] * 16
for i in range(16):
      rect_list.append([] * 16)
font_rect=
#先拿“宋”字进行演示
#根据读取到HZK中数据给我们的16*16点阵赋值
for k in range(len(font_rect) // 2):
   row_list = rect_list
   for j in range(2):
         for i in range(8):
            asc = font_rect
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的16*16点阵信息，打印到控制台
for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel(k, j, 0xffffff)
         k=k+1   
   j=j+1      
   
5、汉字显示 24*24
from m5stack import *
from m5ui import *
from uiflow import *
import binascii
setScreenColor(0x222222)
KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示
rect_list = [] * 24
for i in range(24):
      rect_list.append([] * 24)
font_rect=
#先拿“宋”字进行演示
#根据读取到HZK中数据给我们的24*24点阵赋值
for k in range(len(font_rect) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font_rect
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel(k, j, 0xffffff)
         k=k+1   
   j=j+1      
   
    6、汉字取模程序软件下载地址：http://www.downxia.com/downinfo/251178.html    7、显示多字from m5stack import *
from m5ui import *
from uiflow import *
import binascii

def first_index(my_list, elem):
try: index = my_list.index(elem) + 1
except: index = 0
return index

setScreenColor(0x222222)
KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示


font_rect1={'班':,'主': ,'任':,'助': ,'手': }
def font_show(font_con):
for m in range(len(font_con)):
   font=font_rect1.get(font_con)

#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel(m*24+k, j, 0xffffff)
         k=k+1   
   j=j+1      
font="班主任助手"

font_show(font)
    8、多行显示from m5stack import *
from m5ui import *
from uiflow import *
import binascii

def first_index(my_list, elem):
try: index = my_list.index(elem) + 1
except: index = 0
return index

setScreenColor(0x222222)
KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示


font_rect1={'班':,'主': ,'任':,'助': ,'手': ,"张":,"磊":,"到":,"门":,"卫":,"处":,"取":,"东":,"西":}
def font_show(font_con):
for m in range(len(font_con)):
   font=font_rect1.get(font_con)

#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel((m%13)*24+k, (m//13)*24+j, 0xffffff)
         k=k+1   
   j=j+1      
font="张磊到门卫处取东西取东西取张磊到门卫"

font_show(font)    9、多屏显示    因每行显示13个汉字，满屏能显示10行，共130个汉字。所以以130个汉字为一屏，按A按钮显示下一屏，当无内容时，再按将显示“无信息”from m5stack import *
from m5ui import *
from uiflow import *
import binascii

def first_index(my_list, elem):
try: index = my_list.index(elem) + 1
except: index = 0
return index

setScreenColor(0x222222)
KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示


font_rect1={'班':,'主': ,'任':,'助': ,'手': ,"张":,"磊":,"到":,"门":,"卫":,"处":,"取":,"东":,"西":,"无":,"信":,"息":
}
def font_show(font_con):
for m in range(len(font_con)):
   font=font_rect1.get(font_con)

#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel((m%13)*24+k, (m//13)*24+j, 0xffffff)
         k=k+1   
   j=j+1      
font_first="张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西取张磊到门卫张张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西取张磊到门卫张磊到门卫处取东西取东西取张磊到门卫取张磊到门卫"
def buttonA_wasPressed():
# global params
global font_first
lcd.fill(0x000000)
if len(font_first)>130:
   font_first=font_first
   font_show(font_first)
else:
    font_show("无信息")
pass

btnA.wasPressed(buttonA_wasPressed)
font_show(font_first)    10、物联+信息显示    将学生姓名利用数字进行编码，如“01”为“张磊”同学，利用物联发送数字代码，M5Stack接收后对应解析并显示。from m5stack import *
from m5ui import *
from uiflow import *
import binascii
import wifiCfg
from m5mqtt import M5mqtt



setScreenColor(0x222222)

m5mqtt = M5mqtt('j88LywSZR', 'iot.dfrobot.com.cn', 1883, 'RNZYsQIWg', 'gHWLswIWgz', 300)
wifiCfg.screenShow()
wifiCfg.autoConnect(lcdShow=True)


KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示


font_rect1={'班':,'主': ,'任':,'助': ,'手': ,"张":,"磊":,"到":,"门":,"卫":,"处":,"取":,"东":,"西":,"无":,"信":,"息":
}
def font_show(font_con):
for m in range(len(font_con)):
   font=font_rect1.get(font_con)

#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel((m%13)*24+k, (m//13)*24+j, 0xffffff)
         k=k+1   
   j=j+1      
font_first=""
def buttonA_wasPressed():
# global params
global font_first
lcd.fill(0x000000)
if len(font_first)>130:
   font_first=font_first
   font_show(font_first)
else:
    font_show("无信息")
pass

btnA.wasPressed(buttonA_wasPressed)


def fun_j88LywSZR_(topic_data):
# global params
global font_first
font_first=str(topic_data)
if font_first=="01":
   font_show("张磊")



pass
m5mqtt.subscribe(str('12IZ3JpWR'), fun_j88LywSZR_)

def buttonB_wasPressed():
# global params
if not (wifiCfg.wlan_sta.isconnected()):
    pass
else:
    lcd.fill(0x000000)
    m5mqtt.publish(str('E1RcL1tZg'),str('已阅'))
pass
btnB.wasPressed(buttonB_wasPressed)

setScreenColor(0xffff66)
wifiCfg.doConnect('mxy', 'smj080823')
while not (wifiCfg.wlan_sta.isconnected()):
pass
setScreenColor(0x663300)
m5mqtt.start()
lcd.fill(0x000000)

    11、定义学生姓名字典、常用通知信息字典    常用通知信息字典：action={'01':'到门卫处取东西','02':'到门卫处取药品','03':'到门卫处取衣服','04':'到门卫处取水果','05':'到门卫处取课本','06':'到门卫处取牛奶','07':'到门卫处取身份证','08':'给家长回电话'}    对于提取的字模数据，可以使用Word中的替换功能，进行格式转换。from m5stack import *
from m5ui import *
from uiflow import *
import binascii
import wifiCfg
from m5mqtt import M5mqtt



setScreenColor(0x222222)

m5mqtt = M5mqtt('j88LywSZR', 'iot.dfrobot.com.cn', 1883, 'RNZYsQIWg', 'gHWLswIWgz', 300)
wifiCfg.screenShow()
wifiCfg.autoConnect(lcdShow=True)


font_rect1={"张":,"磊":,"到":,"门":,"卫":,"处":,"取":,"东":,"西":,"无":,"信":,"息":,"牛":,"中":,"旭":,"郭":,"佳":,"美":,"赛":,"楠":,"志":,"强":,"李":,"文":,"轩":,"涛":,"鑫":,"凡":,"侯":,"心":,"爽":,"寒":,"笑":,"刘":,"衣":,"服":,"药":,"品":,"课":,"本":,"奶":,"水":,"给":,"家":,"长":,"回":,"电":,"话":
}
name={'01':'张磊','02':'郭涛','03':'张赛楠','04':'任志强','05':'刘旭强','06':'牛中旭','07':'郭佳美','08':'郭鑫凡','09':'李文轩','10':'侯心爽'}
action={'01':'到门卫处取东西','02':'到门卫处取药品','03':'到门卫处取衣服','04':'到门卫处取水果','05':'到门卫处取课本','06':'到门卫处取牛奶','07':'给家长回电话'}

KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示


def font_show(font_con):
for m in range(len(font_con)):
   font=font_rect1.get(font_con)

#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel((m%13)*24+k, (m//13)*24+j, 0xffffff)
         k=k+1   
   j=j+1      
font_first=""
font_list=[]
def buttonA_wasPressed():
# global params
global font_first
lcd.fill(0x000000)
if len(font_first)>130:
   font_first=font_first
   font_show(font_first)
else:
    font_show("无信息")
pass

btnA.wasPressed(buttonA_wasPressed)


def fun_j88LywSZR_(topic_data):
# global params
global font_first,name,action
list.append(str(topic_data))
font_first=str(topic_data)

font_show(name.get(font_first)+action.get(font_first))



pass
m5mqtt.subscribe(str('12IZ3JpWR'), fun_j88LywSZR_)

def buttonB_wasPressed():
# global params
if not (wifiCfg.wlan_sta.isconnected()):
    pass
else:
    lcd.fill(0x000000)
    m5mqtt.publish(str('E1RcL1tZg'),str('已阅'))
pass
btnB.wasPressed(buttonB_wasPressed)

setScreenColor(0xffff66)
wifiCfg.doConnect('mxy', 'smj080823')
while not (wifiCfg.wlan_sta.isconnected()):
pass
setScreenColor(0x663300)
m5mqtt.start()
lcd.fill(0x000000)12、实现多条信息，分行显示    利用“C”按钮，当按下按钮时，将之前接收的多条消息，一次性展示。并在每条信息后补“空”，以实现每条信息分行显示。def buttonC_wasPressed():
# global params
global font_first,list
j=1
for i in list:
    font_first=font_first+str(j)+"条"+name.get(i)+action.get(i)
    for k in range(13-len(font_first)%13):
      font_first=font_first+"空"
    j=j+1
font_show(font_first)
pass

btnC.wasPressed(buttonC_wasPressed)
13、最终M5Stack上完整代码    因时间有限，学生姓名编码只取了几个示例。from m5stack import *
from m5ui import *
from uiflow import *
import binascii
import wifiCfg
from m5mqtt import M5mqtt



setScreenColor(0x222222)

m5mqtt = M5mqtt('j88LywSZR', 'iot.dfrobot.com.cn', 1883, 'RNZYsQIWg', 'gHWLswIWgz', 300)
wifiCfg.screenShow()
wifiCfg.autoConnect(lcdShow=True)

font_rect1={"到":,"门":,"卫":,"处":,"取":,"东":,"西":,"无":,"信":,"息":,"衣":,"服":,"药":,"品":,"课":,"本":,"给":,"家":,"长":,"回":,"电":,"话":}
name={'01':'张磊','02':'郭鑫凡','03':'李文轩','04':'侯心爽','05':'李寒笑'}
action={'01':'到门卫处取东西','02':'到门卫处取药品','03':'到门卫处取衣服','04':'到门卫处取课本','05':'给家长回电话'}
font_rect2={"1":,"2":,"3":,"条":}
font_rect3={"张":,"磊":,"鑫":,"凡":,"侯":,"心":,"爽":,"寒":,"笑":,"李":,"文":,"轩":,"空":,"郭":}
KEYS =
#初始化24*24的点阵位置，每个汉字需要24*24=256个点来表示

def font_show(font_con):
for m in range(len(font_con)):
   if font_rect1.get(font_con,"Never")!="Never":
      font=font_rect1.get(font_con)
   else:
      if font_rect2.get(font_con,"Never")!="Never":
         font=font_rect2.get(font_con)
      else:
         font=font_rect3.get(font_con,"无")
#根据读取到数据给我们的24*24点阵赋值
   rect_list = [] * 24
   for i in range(24):
      rect_list.append([] * 24)
   for k in range(len(font) // 3):
   row_list = rect_list
   for j in range(3):
         for i in range(8):
            asc = font
            flag = asc & KEYS
            row_list.append(flag)
#根据获取到的24*24点阵信息，打印到控制台
   j=0
   for row in rect_list:
   k=0
   for i in row:
         if i:
             #前景字符（即用来表示汉字笔画的输出字符）
             lcd.pixel((m%13)*24+k, (m//13)*24+j, 0xffffff)
         k=k+1   
   j=j+1      
font_first=""
list=[]
def buttonA_wasPressed():
# global params
global font_first
lcd.fill(0x000000)
if len(font_first)>130:
   font_first=font_first
   font_show(font_first)
else:
    font_show("无信息")
pass

btnA.wasPressed(buttonA_wasPressed)


def fun_j88LywSZR_(topic_data):
# global params
global list
list.append(str(topic_data))
pass
m5mqtt.subscribe(str('12IZ3JpWR'), fun_j88LywSZR_)

def buttonB_wasPressed():
# global params
global list,font_first
if not (wifiCfg.wlan_sta.isconnected()):
    pass
else:
    lcd.fill(0x000000)
    m5mqtt.publish(str('E1RcL1tZg'),str('已阅'))
    list=[]
    font_first=""
pass
btnB.wasPressed(buttonB_wasPressed)

def buttonC_wasPressed():
# global params
global font_first,list
j=1
for i in list:
    font_first=font_first+str(j)+"条"+name.get(i)+action.get(i)
    for k in range(13-len(font_first)%13):
      font_first=font_first+"空"
    j=j+1
font_show(font_first)
pass

btnC.wasPressed(buttonC_wasPressed)




setScreenColor(0xffff66)
wifiCfg.doConnect('mxy', 'smj080823')
while not (wifiCfg.wlan_sta.isconnected()):
pass
setScreenColor(0x663300)
m5mqtt.start()
lcd.fill(0x000000)
14、M5Stack端演示视频    先使用Easy lot网页版进行信息操作，M5Stack端进行显示。https://v.youku.com/v_show/id_XNDM3NDE0NDM1Mg==.html?x&sharefrom=android&sharekey=b43d76cee1719221a3d364d47b4deaef3


手机端APP设计    手机端APP设计，使用平台：App Inventor 2WxBit 汉化增强版，登陆网址：https://app.wxbit.com/login/。
1、界面设计     其中mqtt客户端服务器URI为tcp://iot.dfrobot.com.cn:1883    其它设计如下图    2、逻辑设计 （1）初始化设置
    对姓名、事件建立列表。姓名只取部分演示。并进行MQTT连接。（2）当MQTT连接成功时，进行订阅。    (3)当提交按钮被点击时，发送信息    (4)当收到反馈信息时，显示“时间”加“信息已阅”成品视频演示https://v.youku.com/v_show/id_XNDM3NTg4ODExMg==.html?x&sharefrom=android&sharekey=be71ce55d5c3f956b21694734327e7ae6增加对班级手机存放箱的管理“手机进校园”成为炙手可热的话题，并不是空穴来风的。手机给学生带来的变化太大了。一方面，中小学生使用手机会妨碍学校的教学秩序，上课时突如其来的电话铃声，会打断老师上课的思路，影响教学质量。另一方，手机有辐射，不利于学生健康成长，中小学生正处在生长发育的黄金阶段，手机本身的辐射，不利于学生的健康成长以下内容是无忧考网为大家准备的相关内容。    我们采取的方式是，学生开学时将手机交班主任管理，用时再从班主任这里拿。这样就能防止学生在上课时间和休息时间玩手机。但有时班主任不在学校，尤其是放假时，学生要拿手机，如果班主任不在，就会出问题。    本手机存放箱，采用物联网+电磁锁，班主任可远程操控锁的开与关，方便了管理。    电磁锁使用方法    可借鉴本人另一个帖子“12V斜口电磁锁测试”https://mc.dfrobot.com.cn/thread-297962-1-1.html    演示视频https://v.youku.com/v_show/id_XNDM4MjE4MTU2MA==.html?x&sharefrom=android&sharekey=ba88bfc0b32d677263ff6cf8c3e6618c0    源代码

pATAq 发表于 2019-9-27 14:52:18

不错，很好很强大

RRoy 发表于 2019-10-8 15:24:42

这个好厉害

我型我塑 发表于 2020-9-9 10:57:39

非常实用的一个发明，以后班级学生的手机就好管理了，现在只要外观设计了。

查看完整版本: 【嘉年华展示】M5Stack——班主任助手