使用微信小程序来远程切换树莓派RGB七色光的文章

前言:因为上学期选修了一门嵌入式开发的课程,老师要求利用树莓派设计一个课题。由于我会微信小程序所以脑洞大开便有了下面的这一篇 使用微信小程序来远程切换树莓派RGB七色光的文章 ps: 通信狗表示很累

开始

硬件部分:介绍树莓派

使用微信小程序来远程切换树莓派RGB七色光的文章_第1张图片

  • 1.1 树莓派是什么:树莓派 Raspberry Pi 是由英国树莓派基金会开发,基于Linux的单片机电脑又称口袋电脑。所以电脑能干嘛树莓派基本也可以做得到,到现在树莓派已经发行了4代我使用的是3代的3B+,足够我使用了
  • 1.2 树莓派配件和系统烧入可以看看 阮老师: 树莓派新手入门教程
  • 1.3 电子元件:因为我需要实现七色光的切换,需要的 RGB 电子器件需要先集成好的,直接网购就行

发七色光原理

通过控制树莓派 GPIO 可以来控制 RGB 彩色LED灯。LED灯有3个灯分别是红灯、绿灯和蓝灯。控制这三个灯分别发出不同强度的光,混合起来就能发出各种颜色的光了。

LED 和 树莓派 GPIO 引脚接线

LED灯上的4根引脚分别是GND,R,G,B。 GND需要接地。 R,G,B分别是红绿蓝灯的正极接口。我们把它们连接到树莓派的GPIO口上。LED灯上 R接到树莓派GPIO18,G连接树莓派GPIO15,B连接树莓派GPIO14。

引脚图如下

使用微信小程序来远程切换树莓派RGB七色光的文章_第2张图片

连接后的实物图

使用微信小程序来远程切换树莓派RGB七色光的文章_第3张图片

项目流程架构图

先来了解我们项目架构的流程图

使用微信小程序来远程切换树莓派RGB七色光的文章_第4张图片

服务器

因为要实现远程连接和控制树莓派,我们需要一个服务器。我使用的是线上的物联网云平台服务器 oneNet
  • 注册账号后进入点击控制台 -> 全部产品服务中选择多协议接入->选择HTTP协议->选择添加产品

使用微信小程序来远程切换树莓派RGB七色光的文章_第5张图片

  • 产品信息可以随意填写,例如

使用微信小程序来远程切换树莓派RGB七色光的文章_第6张图片

  • 点击创建好的产品进入到详细页面获取 Master-APIkey 和 access-key。

使用微信小程序来远程切换树莓派RGB七色光的文章_第7张图片

  • 点击进入到设备列表->添加设备

使用微信小程序来远程切换树莓派RGB七色光的文章_第8张图片

  • 点击进入到数据流模板->添加数据流,数据流名称随意比如'led_pi'。完成这些步骤我们的云平台接口就已经创建后了

使用微信小程序来远程切换树莓派RGB七色光的文章_第9张图片

代码部分

微信小程序端

const app = getApp()
const API_URL = 'https://api.heclouds.com/devices/655618681/datapoints' // 655618681 是设备号,换成你自己添加的设备号
const API_KEY =  'wkXV2upi=614H4U=HpeRiQ=OLU=' // 这里换成你自己申请的api_key
Page({
  data: {
    rgb: 'rgb(0,154,97)',//初始值
    pick: false
  },

postData: function(value) {
    var that=this;
    wx.request({
      url: API_URL,
      header:{
        'api-key': API_KEY
      },
      method:"POST",
      data:{
      "datastreams": [{
        "id": "led_pi",
        "datapoints": [{
          "at": "2020-03-13T19:20:43",
          "value": value
        },
        ]
      }]
      },
      success: function (res) {
        console.log(res.statusCode)
        if(res.statusCode==200)
          that.setData({ motto: "led on" })
        else
          that.setData({ motto: "404 not found" })
      }
    })    
},

// 切换红灯
clickRed: function(){
  this.postData('red')
},
// 切换绿灯
clickGreen: function(){
  this.postData('green')
},
clickWhite: function(){
  this.postData('white')
},
clickBlue: function() {
  this.postData('blue')
},
ClickOn:function() {
  this.postData('1')
},

ClickOff: function () {
    var that=this;
    this.setData({ motto: "wait..." })
    wx.request({
        url: `${API_URL}?type=3'`,
        header: {
        'api-key': API_KEY
        },
        method: "POST",
        data: {
        'led_pi': '0'
        },
        success: function (res) {
        if (res.statusCode == 200)
            that.setData({ motto: "led off" })
        else
            that.setData({ motto: "404 not found" })
        }
    })
},

ClickGet: function () {
    this.setData({ motto: "wait" })
    wx.request({
        url: `${API_URL}?datastream_id=led_pi`,
        header: {
        'api-key': API_KEY
        },
        method: "GET",
        success(res) {
        console.log(res.data)
        }
    })
},

// 显示取色器
toPick: function () {
    this.setData({
        pick: true
    })
},
//取色结果回调
pickColor(e) {
    let rgb = e.detail.color
    console.log(rgb)
    var a = rgb.split('rgb')
    // var b = a[1].split(')')
    console.log(a[1])
    // console.log(b)
    this.postData(a[1])
    }
})

小程序界面

使用微信小程序来远程切换树莓派RGB七色光的文章_第10张图片

小程序取色版组件从npm中下载

树莓派端脚本

树莓派的脚本文件使用的是python。我分成了两个 py 文件。一个切换七色的,一个切换五颜六色。PS 因为python是为了解决这个课题临时学的,代码写的烂各位大佬们轻喷 云平台的接口使用请查看文档。 在树莓派终端运行下面的 wxMain.py 文件 ./wxMain.py
# -*- coding: utf-8 -*-
from iot10086 import Iot10086
import time
import RPi.GPIO as GPIO

def sleep(mytime):
    time.sleep(mytime)
rpin = 18
gpin = 15
bpin = 14

GPIO.setmode(GPIO.BCM)
GPIO.setwarnings(False)
GPIO.setup(rpin, GPIO.OUT)
GPIO.setup(gpin, GPIO.OUT)
GPIO.setup(bpin, GPIO.OUT)
pwmR = GPIO.PWM(rpin, 70)
pwmG = GPIO.PWM(gpin, 70)
pwmB = GPIO.PWM(bpin, 70)
pwmR.start(1)
pwmG.start(1)
pwmB.start(1)

apikey=''
apiurl=''

iot = Iot10086(apikey, apiurl)

# 定时刷新界面接收小程序端发送的数据
for x in range(10000):
    iot_post_status = iot.get_data('led_pi')
    colors = iot_post_status['data']
    print('colors',colors)
    value = iot_post_status['data']['current_value']
    boolen = (len(value) >= 7)
    if(value == '1' or value == 'white'):
       GPIO.output(rpin, GPIO.HIGH)
       GPIO.output(gpin, GPIO.HIGH)
       GPIO.output(bpin, GPIO.HIGH)
    elif value == '0':
        GPIO.output(rpin, GPIO.LOW)
        GPIO.output(gpin, GPIO.LOW)
        GPIO.output(bpin, GPIO.LOW)
    elif value == 'red':
        GPIO.output(rpin, GPIO.HIGH)
        GPIO.output(gpin, GPIO.LOW)
        GPIO.output(bpin, GPIO.LOW)
    elif value == 'green':
        GPIO.output(gpin, GPIO.HIGH)
        GPIO.output(rpin, GPIO.LOW)
        GPIO.output(bpin, GPIO.LOW)
    elif value == 'blue':
        GPIO.output(bpin, GPIO.HIGH)
        GPIO.output(rpin, GPIO.LOW)
        GPIO.output(gpin, GPIO.LOW)
    elif boolen:
        RGB = value.split('(')[1].split(')')[0].split(',')
        r = int(RGB[0])/2.55001
        g = int(RGB[1])/2.55001
        b = int(RGB[2])/2.55001
        print('RGB', RGB)
        pwmR.ChangeDutyCycle(r)
        pwmG.ChangeDutyCycle(g)
        pwmB.ChangeDutyCycle(b)
        # 调整红绿蓝LED的各个颜色的亮度组合出各种颜色
pwmR.stop()
pwmG.stop()
pwmB.stop()
GPIO.cleanup()
  • 导入云平台提供的接入类 iot10086.py。
import requests
import json
class Iot10086(object):
    apikey='wkXV2upi=614H4U=HpeRiQ=OLeU='
    apiurl='http://api.heclouds.com/devices/65561868/datastreams/'

    def __init__(self, apikey, apiurl):
        self.apikey = apikey
        self.apiurl = apiurl
        self.apiheaders={'api-key':apikey}

    def set_data(self,datastream,value):
        apiurl_set = self.apiurl + '?type=3'
        payload={datastream:str(value)}
        r=requests.post(apiurl_set, headers=self.apiheaders, data=json.dumps(payload), timeout=30)
        return r.status_code

    def get_data(self,datastream):
        apiurl_get = self.apiurl + datastream
        r=requests.get(apiurl_get, headers=self.apiheaders, timeout=20)
        if r.status_code == 200:
            return json.loads(r.text)
        else:
            return r.status_code

实现效果

PS:由于当时在学校没有录制到按钮的操作视频,这里就不展示了

参考文献

微信小程序通过wifi和蓝牙控制树莓派

推荐掘金阅读体验更加好

掘金地址

结束

感谢遇见,我是林一一,下次见。

你可能感兴趣的