這篇文章主要為大家展示了“怎么通過WEB控制樹莓派RGB燈光”,內(nèi)容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“怎么通過WEB控制樹莓派RGB燈光”這篇文章吧。
成都創(chuàng)新互聯(lián)公司專注于余江企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè)公司,購物商城網(wǎng)站建設(shè)。余江網(wǎng)站建設(shè)公司,為余江等地區(qū)提供建站服務(wù)。全流程按需定制制作,專業(yè)設(shè)計,全程項(xiàng)目跟蹤,成都創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)
main.py:
01 #!/usr/bin/env python3 02 03 import RPi.GPIO as GPIO 04 from RGB_light import RGB_light 05 from bottle import request, route, run, static_file #bottle使用介紹:https://git.oschina.net/ginnywzj/web_rgb/attach_files 06 import time, threading 07 08 rgb = 0 09 RGBLight = RGB_light(GPIO.BOARD, 1, 33, 35, 37) #初始化rgb燈GPIO引腳,引腳編號系統(tǒng)為GPIO.BOARD、共陽、red通道為33引腳,green通道為35引腳,blue通道為37引腳s 10 light_type = 'static' #'static':靜態(tài) 'breath':呼吸 'flash':閃爍 11 12 #訪問文件根目錄 13 @route('/') 14 def index(): 15 global rgb, light_type 16 rgb = 0xffffff 17 light_type = 'static' 18 return static_file('index.html', './page') 19 20 #網(wǎng)頁上的靜態(tài)文件需要做傳輸處理 21 @route('/') 22 def server_static(filename): 23 return static_file(filename, root='./page') 24 25 #POST方式獲取Ajax傳輸過來的rgb值 26 @route('/rgb', method='POST') 27 def rgbLight(): 28 red = request.POST.get('red') 29 green = request.POST.get('green') 30 blue = request.POST.get('blue') 31 print('red='+ red +', green='+ green +', blue='+ blue) 32 red = int(red) 33 green = int(green) 34 blue = int(blue) 35 if 0 <= red <= 255 and 0 <= green <= 255 and 0 <= blue <= 255: 36 global rgb 37 rgb = (red<<16) | (green<<8) | blue 38 39 #POST方式獲取Ajax傳輸過來的type值 40 @route('/lightType', method='POST') 41 def lightType(): 42 global light_type 43 light_type = request.POST.get('type') 44 print("lightType="+light_type) 45 46 #燈光循環(huán)檢測控制 47 def lightLoop(): 48 global rgb, light_type 49 flashTime = [0.3, 0.2, 0.1, 0.05, 0.05, 0.1, 0.2, 0.5, 0.2] #閃爍時間間隔 50 flashTimeIndex = 0 #閃爍時間間隔索引 51 f = lambda x: (-1/10000.0)*x*x + (1/50.0)*x #用拋物線模擬呼吸燈 52 x = 0 53 while True: 54 if light_type == 'static': #靜態(tài)顯示 55 RGBLight.set_rgb(rgb) 56 time.sleep(0.05) 57 elif light_type == 'breath': #閃爍顯示 58 red = int(((rgb & 0xff0000)>>16) * f(x)) 59 green = int(((rgb & 0x00ff00) >> 8) * f(x)) 60 blue = int((rgb & 0x0000ff) * f(x)) 61 _rgb = int((red << 16) | (green << 8) | blue) 62 RGBLight.set_rgb(_rgb) 63 time.sleep(0.02) 64 x += 1 65 if x >= 200: 66 x = 0 67 elif light_type == 'flash': #呼吸燈顯示 68 RGBLight.set_rgb(rgb) 69 time.sleep(flashTime[flashTimeIndex]) 70 RGBLight.set_rgb(0) 71 time.sleep(flashTime[flashTimeIndex]) 72 flashTimeIndex += 1 73 if flashTimeIndex >= len(flashTime): 74 flashTimeIndex = 0 75 76 #開辟新線程負(fù)責(zé)rgb燈光顯示 77 t = threading.Thread(target = lightLoop) 78 t.start() 79 80 #設(shè)置服務(wù)器ip地址和端口(提示:使用前請設(shè)置成你的樹莓派ip地址) 81 run(host='192.168.21.104', port=8080)
(這里要吐槽下,添加代碼為什么沒有行號(難道是我沒發(fā)現(xiàn)),還得自己用UltraEdit添加,添加了行號別人復(fù)制了又不能直接用,希望開源中國能更新下)
主要看第21行、26行、40行、77行和81行。
1、第21行是創(chuàng)建一個網(wǎng)頁靜態(tài)文件傳輸通道。index.html文件中引用了jquery-3.1.1.min.js和兩張圖片,如果不添加它們的傳輸通道,這些文件將不能傳輸?shù)绞謾C(jī),在bottle說明手冊中也明確說明了。
2、第26行、40行是接收index.html網(wǎng)頁回傳數(shù)據(jù)的方式,可以為GET或者POST,但要保持index.html和main.py一致。
3、第77行是開辟一個python線程。為什么要另外開辟線程呢?main.py有兩個任務(wù):1、監(jiān)聽手機(jī)傳回的數(shù)據(jù);2、控制樹莓派引腳pwm輸出。main.py啟動后會產(chǎn)生一個線程,當(dāng)執(zhí)行到81行(run(host='192.168.21.104', port=8080))這個線程就給了bottle。bottle會一直監(jiān)聽手機(jī),如果有數(shù)據(jù)傳回它就會執(zhí)行被它裝飾了的函數(shù)(例如27行的rgbLight)。如果燈光只是靜態(tài)的顯示顏色,那么只要監(jiān)聽到一個數(shù)據(jù)就在裝飾函數(shù)中修改一次pwm輸出就可以,這樣單個線程也沒問題。但本文的燈光還有閃爍和呼吸效果,這樣就需要main.py一直控制pwm輸出,單線程的main.py是一直在監(jiān)聽手機(jī)的沒辦法一直控制pwm,所以必須創(chuàng)建新線程來單獨(dú)控制pwm。
4、第81行是設(shè)置服務(wù)器的ip地址和端口號,這里必須修改成你自己樹莓派的ip地址,否則不能運(yùn)行會報錯。查看ip地址指令:ifconfig。
index.html:
01 02 03 04 05 06 07 08 09web rgb 10 12 15 16 17 1819 通過WEB控制樹莓派RGB燈光 2021 22 2324 25 28 29 303132 靜態(tài) 33 呼吸 34 閃爍 3536 37 82
index.html需要手機(jī)瀏覽器支持html5的canvas元素,現(xiàn)在絕大部分都支持。 jquery的使用可以參考jquery主頁API文檔:http://api.jquery.com/
看看index.html在手機(jī)上顯示效果:
1、第52行和53行建立對touchstart事件和touchmove事件監(jiān)聽。這兩個事件只在手機(jī)端起作用,所以在pc端訪問時拖動鼠標(biāo),是不能選中顏色的。pc端相對應(yīng)的事件為:onmousedown、onmousemove。如果想在pc端使用可以修改為相應(yīng)事件(類似:drawCanvas.onmousedown=function(){})。
2、第54行的touch函數(shù)功能是判斷觸摸點(diǎn)是否在顏色選擇框內(nèi),在的話就移動picker和上傳被選中點(diǎn)的rgb值給樹莓派。
3、第73行是阻止事件上拋,沒有它你選擇顏色時手機(jī)瀏覽器就會認(rèn)為是在切換頁面。
4、第77行,選擇燈光效果,在pc端也能操作。
如果想查看所有代碼可到我的碼云上看哦:https://git.oschina.net/ginnywzj/web_rgb
你也可以直接用樹莓派下載然后運(yùn)行試玩,方法如下:
git clone https://git.oschina.net/ginnywzj/web_rgb.git
cd web_rgb
//修改main.py中的ip地址
python3 main.py
在這之前我玩過BLE藍(lán)牙控制燈光,藍(lán)牙雖然省電但連接真心慢,每次都要開啟手機(jī)藍(lán)牙然后等待連接,基本上要消耗10秒?,F(xiàn)在樹莓派3B有了wifi,讓它連上家里的路由器,手機(jī)一般都連著,通過wifi來控制燈光速度很快,而且不需要安裝APP,只要打開操控網(wǎng)頁就行,使用很方便。
以上是“怎么通過WEB控制樹莓派RGB燈光”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!