8228浏览
查看: 8228|回复: 1

[ESP8266/ESP32] FireBeetle 2 ESP32 C6:微信小程序炫彩灯环

[复制链接]
本帖最后由 麦壳maikemaker 于 2024-4-10 19:00 编辑

个人玩家自制客户端的实现方式选择有很多,但是大多数都受终端设备的类型限制,所以基于跨终端的应用为底座做客户端是比较方便的选择。一般情况下web是不受平台限制的无论是手机还是电脑,iOS还是安卓或者Linux都可以使用,还有就是今天要做的小程序。它基于微信,而微信也是跨平台可用的。先看下演示视频


硬件端
硬件连接
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图1
程序
micropython语言
  1. #import mqtt
  2. import network
  3. import ssl
  4. import time
  5. import os
  6. from machine import Pin,Timer
  7. from umqtt.simple import MQTTClient
  8. import neopixel #导入ws2812彩灯库
  9. import urandom #导入随机数库
  10. CLIENT_ID = b'test_from_esp32c6'
  11. MQTT_SERVER = 'ea043a32.ala.cn-hangzhou.emqxsl.cn'
  12. PORT = 8883
  13. USERNAME = b'账号'
  14. PASSWORD = b'密码'
  15. TOPIC = b'esp32c6/test'
  16. xg=0
  17. RGBIO = Pin(5)  # 彩灯控制引脚
  18. LED_NUM = 12  # 彩灯的数量
  19. LED = neopixel.NeoPixel(pin=RGBIO, n=LED_NUM, timing=1)  # 创建控制对象
  20. LED.fill((0, 0, 0))  # GRB填充数据(RGB顺序, 0为不亮,255为全亮)
  21. LED.write()  # 写入数据(生效)
  22. RR = [255, 252, 233, 191, 128, 64, 0, 0, 46, 139, 205, 255]  
  23. GG = [0, 46, 139, 205, 255, 255, 205, 139, 46, 0, 0, 43]  
  24. BB = [0, 0, 0, 46, 139, 205, 255, 255, 205, 139, 46, 0]
  25. #正反刷新随机颜色1
  26. def xg1():
  27.     r = urandom.randint(0, 255)
  28.     g = urandom.randint(0, 255)
  29.     b = urandom.randint(0, 255)
  30.     for i in range(12):
  31.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  32.         LED.write()  # 写入数据
  33.         time.sleep_ms(50)
  34.     r = urandom.randint(0, 255)
  35.     g = urandom.randint(0, 255)
  36.     b = urandom.randint(0, 255)
  37.     for i in range(11, -1, -1):
  38.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  39.         LED.write()  # 写入数据
  40.         time.sleep_ms(50)
  41. #单灯亮跑一圈,suiji变色
  42. def xg2():
  43.     r = urandom.randint(0, 255)
  44.     g = urandom.randint(0, 255)
  45.     b = urandom.randint(0, 255)
  46.     for i in range(12):
  47.         LED.fill((0, 0, 0))
  48.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  49.         LED.write()  # 写入数据
  50.         time.sleep_ms(100)
  51. #单灯色不一致跑一圈变色
  52. def xg3():
  53.     r = urandom.randint(0, 255)
  54.     g = urandom.randint(0, 255)
  55.     b = urandom.randint(0, 255)
  56.     for i in range(12):
  57.         LED.fill((b, r, g))
  58.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  59.         LED.write()  # 写入数据
  60.         time.sleep_ms(100)
  61. #单灯转圈随机色一步一变色
  62. def xg4():
  63.     for i in range(12):
  64.         r = urandom.randint(0, 255)
  65.         g = urandom.randint(0, 255)
  66.         b = urandom.randint(0, 255)
  67.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  68.         LED.write()  # 写入数据
  69.         time.sleep_ms(50)
  70. #单灯随机色转圈2只有一个灯亮
  71. def xg5():
  72.     for i in range(12):
  73.         r = urandom.randint(0, 255)
  74.         g = urandom.randint(0, 255)
  75.         b = urandom.randint(0, 255)
  76.         LED.fill((0, 0, 0))
  77.         LED[i] = (r, g, b)  # 依次设置LED灯珠的颜色
  78.         LED.write()  # 写入数据
  79.         time.sleep_ms(50)
  80. #旋转彩虹      
  81. def xg6():
  82.     global RR
  83.     global GG
  84.     global BB
  85.     for i in range(12):
  86.         LED[i] = (RR[i], GG[i], BB[i])  # 依次设置LED灯珠的颜色
  87.     LED.write()  # 写入数据
  88.     time.sleep(0.3)  # 暂停一段时间,控制旋转速度
  89.     # 在这里添加代码来实现颜色的旋转效果,例如将RR、GG、BB列表中的元素向右移动一位
  90.     RR = [RR[-1]] + RR[:-1]
  91.     GG = [GG[-1]] + GG[:-1]
  92.     BB = [BB[-1]] + BB[:-1]
  93. #三原色呼吸灯
  94. def xg7():
  95.     for i in range(255):
  96.         LED.fill((i, 0, 0))
  97.         LED.write()  # 写入数据
  98.         time.sleep_ms(5)
  99.     for i in range(255,0,-1):
  100.         LED.fill((i, 0, 0))
  101.         LED.write()  # 写入数据
  102.         time.sleep_ms(5)
  103.     for i in range(255):
  104.         LED.fill((0, i, 0))
  105.         LED.write()  # 写入数据
  106.         time.sleep_ms(5)
  107.     for i in range(255,0,-1):
  108.         LED.fill((0, i, 0))
  109.         LED.write()  # 写入数据
  110.         time.sleep_ms(5)
  111.     for i in range(255):
  112.         LED.fill((0, 0, i))
  113.         LED.write()  # 写入数据
  114.         time.sleep_ms(5)
  115.     for i in range(255,0,-1):
  116.         LED.fill((0, 0, i))
  117.         LED.write()  # 写入数据
  118.         time.sleep_ms(5)
  119. #sanse警示
  120. def xg8():
  121.     LED.fill((255, 0, 0))
  122.     LED.write()  # 写入数据
  123.     time.sleep_ms(100)
  124.     LED.fill((0, 255, 0))
  125.     LED.write()  # 写入数据
  126.     time.sleep_ms(100)
  127.     LED.fill((0, 0, 255))
  128.     LED.write()  # 写入数据
  129.     time.sleep_ms(100)
  130. def WIFI_Connect():
  131.     WIFI_LED = Pin(15,Pin.OUT)
  132.     wlan = network.WLAN(network.STA_IF)
  133.     wlan.active(True)
  134.     start_time=time.time()              #记录时间做超时判断
  135.     if not wlan.isconnected():
  136.         print('connecting to network...')
  137.         wlan.connect('waoo2111280', 'waoo2111280')#输入WIFI账号密码
  138.         while not wlan.isconnected():
  139.             #LED闪烁提示
  140.             WIFI_LED.value(1)
  141.             time.sleep_ms(300)
  142.             WIFI_LED.value(0)
  143.             time.sleep_ms(300)
  144.             #超时判断,15秒没连接成功判定为超时
  145.             if time.time()-start_time > 15 :
  146.                 print('WIFI Connected Timeout!')
  147.                 break
  148.     if wlan.isconnected():
  149.         #LED点亮
  150.         WIFI_LED.value(1)
  151.         #串口打印信息
  152.         print('network information:', wlan.ifconfig())
  153.         LED.fill((0, 255, 0))
  154.         LED.write()
  155.         return True
  156.     else:
  157.         LED.fill((255, 0, 0))
  158.         LED.write()
  159.         return False
  160. #设置MQTT回调函数,有信息时候执行
  161. def MQTT_callback(topic, msg):
  162.     global xg
  163.     print('topic: {}'.format(topic))
  164.     print('msg:{}'.format(msg))
  165.     #xg = int('{}'.format(msg)[2])
  166.     if "b'1'"== '{}'.format(msg):
  167.         print("1")
  168.         xg=1
  169.     if "b'2'"== '{}'.format(msg):
  170.         print("2")
  171.         xg=2
  172.     if "b'3'"== '{}'.format(msg):
  173.         print("3")
  174.         xg=3
  175.     if "b'4'"== '{}'.format(msg):
  176.         print("4")
  177.         xg=4
  178.     if "b'5'"== '{}'.format(msg):
  179.         print("5")
  180.         xg=5
  181.     if "b'6'"== '{}'.format(msg):
  182.         print("6")
  183.         xg=6
  184.     if "b'7'"== '{}'.format(msg):
  185.         print("7")
  186.         xg=7
  187.     if "b'8'"== '{}'.format(msg):
  188.         print("8")
  189.         xg=8
  190.     if "b'9'"== '{}'.format(msg):
  191.         print("9")
  192.         xg=9
  193.     client.publish('fh', "shoudao")
  194. #接收数据任务
  195. def MQTT_Rev(tim):
  196.     try:
  197.         client.check_msg() # 非租塞
  198.     except Exception as e:
  199.         print(str(e))
  200.         time.sleep(2)
  201.         print('reconnect!')
  202.         client.connect()
  203.         # 断线之后要重新订阅
  204.         client.subscribe(TOPIC)
  205.         print('dl')
  206. #执行WIFI连接函数并判断是否已经连接成功
  207. if WIFI_Connect():
  208.     #SSL连接
  209.     context = ssl.SSLContext(ssl.PROTOCOL_TLS_CLIENT)
  210.     context.verify_mode = ssl.CERT_NONE
  211.     try:
  212.         client = MQTTClient(client_id=CLIENT_ID, # something unique to identify device, ie machine.unique_id()
  213.                             server= MQTT_SERVER,
  214.                             port=PORT, # if port ==0 AND ssl=True -> port=8883 the secure mqtt port
  215.                             user=USERNAME,
  216.                             password=PASSWORD,
  217.                             keepalive=7200,
  218.                             ssl=context
  219.                             )
  220.         client.connect()
  221.         print('Connected to %s MQTT Broker'%(MQTT_SERVER))
  222.         client.set_callback(MQTT_callback)
  223.         client.subscribe(TOPIC)
  224.         print('subscribe TOPIC!')
  225.     except OSError as e:
  226.         print('Failed to connect to the MQTT Broker.')
  227.         time.sleep(5)
  228.         machine.reset()
  229.     #开启RTOS定时器,编号为-1,周期300ms,执行socket通信接收任务
  230.     #C6定时器编号0
  231.     tim = Timer(0)
  232.     tim.init(period=300, mode=Timer.PERIODIC,callback=MQTT_Rev)
  233.     while True:
  234.         #client.publish(TOPIC, 'Hello')
  235.         if xg==1:
  236.             xg1()
  237.         elif xg==2:
  238.             xg2()
  239.         elif xg==3:
  240.             xg3()
  241.         elif xg==4:
  242.             xg4()
  243.         elif xg==5:
  244.             xg5()
  245.         elif xg==6:
  246.             xg6()
  247.         elif xg==7:
  248.             xg7()
  249.         elif xg>7:
  250.             xg8()
复制代码
注意事项:微信要求MQTT服务器必须备案,所以我们使用的服务器的选择就不多,本来是使用巴法云但是micropython下收不到消息不知如何解决遂放弃,有考虑DF的easyiot但是easyiot提供了一个官方的小程序不开放小程序可用的端口,其他公共服务器要么没备案要么不支持微信的协议。最后选择了emqx家的托管自建模式的服务器。申请参考:https://mc.dfrobot.com.cn/thread-318431-1-1.html。本文所使用的连接SSL安全连接的代码也是来自这个帖子,网上搜索GPT等折腾了十几个版本最后还是qiao大佬给了一个示例完成了需求。致谢!
小程序端
下载安装微信开发者工具:https://developers.weixin.qq.com ... tools/download.html
注册小程序测试号:https://mp.weixin.qq.com/wxamp/sandbox?doc=1 打开页面扫码即可登录后台添加服务器地址:https://mp.weixin.qq.com/cgi-bin ... 2338%26lang%3Dzh_CN
打开链接扫码登录
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图7
选择小程序测试号
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图8
点击修改
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图9
复制服务器地址和端口
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图10
填写
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图11

打开微信开发者工具,扫码登录,导入项目,修改,真机调试
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图2
导入
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图3
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图4
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图5
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图6
修改

FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图12
界面设计
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图13FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图14
修改连接信息
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图23
修改显示名称
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图15
删减按钮
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图16
修改按钮样式
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图17FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图18
修改按钮功能
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图19FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图20
真机调试
FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图21FireBeetle 2 ESP32 C6:微信小程序炫彩灯环图22
上架这里就不演示了,小程序官方文档有详细步骤,网上也有视频教程。
有问题欢迎留言交流。



mqtt-WeChat-xcdh.zip

497.32 KB, 下载次数: 5

xiaohe9527  高级技师

发表于 3 天前

这个真的得好好学习一下
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4

© 2013-2024 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail