【樹莓派】帶你從0到1完成魔鏡製作

此文爲製作過程中雜記,等後續完成後再統一整理。

目錄

硬件部分搭建:

軟件部分搭建:

安裝MagicMirror2

天氣預報顯示

旋轉屏幕

允許HDMI支持熱插拔


硬件部分搭建:

原子鏡一塊:淘寶訂做,23*36,匹配顯示屏

筆記本拆機顯示屏+驅動板:鹹魚購買,買的觸摸屏36*23cm,實際使用中確認外面增加了一塊原子鏡後無法使用觸摸功能,需要另外再覆膜才能使用觸摸功能。

樹莓派一塊,我用的是樹莓派3B,使用其他型號的也可以,或者其他顯示主控器其實都可以。

鏡框製作,用木板製作一個木框,將上述這些東西放置到鏡框內

 

-----------------------------------------------------------------------------------------------------------------------------------------------------------

軟件部分搭建:

github上有現成的魔鏡開源代碼,可以基於這份開源代碼進行修改。

開源代碼:https://github.com/MichMich/MagicMirror

說明文檔:https://docs.magicmirror.builders/

但本質上,任何魔鏡只是一種顯示界面,我們只需要將自己想顯示的內容充滿整個顯示屏屏幕即可。

因爲鏡子是一個懸掛或可移動的東西,我不希望有網線出來,所以選擇樹莓派3B,現在可以用4B,自帶WIFI功能,實際使用會方便很多。

 

安裝MagicMirror2

在樹莓派終端中輸入:

git clone https://github.com/MichMich/MagicMirror.git

 

下載完畢後,進行自動安裝:

bash -c "$(curl -sL https://raw.githubusercontent.com/MichMich/MagicMirror/master/installers/raspberry.sh)"

注意:若輸入上述指令無反應,則先檢查是不是無法訪問https://raw.githubusercontent.com/MichMich/MagicMirror/master/installers/raspberry.sh 這個文件,若顯示“raw.githubusercontent.com 拒絕了我們的連接請求。”,則說明下不到這個文件,所以指令無反應無法執行。產生該問題的主要原因是我安裝的樹莓派系統是精簡版的,很多包沒有安裝。

有兩種方式解決:

(1)提前下好這個文件放到根目錄下,然後直接執行該腳本;

(2)解決連接問題,安裝ssl-cert包即可:

sudo apt-get install ssl-cert

解決後再用前面的指令,即可開始magicmirror2的自動化安裝。 

 

天氣預報顯示

自動完成安裝後,會發現右上角的天氣並沒有顯示出來,因爲天氣信息是從https://openweathermap.org/上獲取的,當前的配置中並未設置有效的appid,需要做一些修改。

打開config/config.js文件,原始內容如下:

......

{
			module: "currentweather",
			position: "top_right",
			config: {
				location: "New York",
				locationID: "",  //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				appid: "YOUR_OPENWEATHER_API_KEY"
			}
		},
		{
			module: "weatherforecast",
			position: "top_right",
			header: "Weather Forecast",
			config: {
				location: "New York",
				locationID: "5128581",  //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				appid: "YOUR_OPENWEATHER_API_KEY"
			}
		},
......

修改地區:

我這裏改成了 寧波 “Ningbo”,對應的id從city.list.json文件中查找(該文件從http://bulk.openweathermap.org/sample/city.list.json.gz下載) 

location: "Ningbo",
locationID: "1799397",  

修改appid,需要使用 OpenWeatherMap 的服務,首先我們要到它的官網上註冊一個帳號,地址:http://openweathermap.org 
然後再登錄帳號,註冊個 apikey(即appid)。這個在後面獲取氣候信息時參數中需要帶上。(註冊這些都是免費的。但是註冊時容易失敗,使用qq郵箱無法成功,可以使用gmail郵箱進行註冊,應該是被強了)
appid: "12b2817fbec86915a6e9b4dbbd3d9036" 

完整修改如下所示:

sudo nano config/config.js

......

{
			module: "currentweather",
			position: "top_right",
			config: {
				location: "Ningbo",
				locationID: "1799397",  //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				appid: "12b2817fbec86915a6e9b4dbbd3d9036"
			}
		},
		{
			module: "weatherforecast",
			position: "top_right",
			header: "Weather Forecast",
			config: {
				location: "Ningbo",
				locationID: "1799397",  //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find your city
				appid: "12b2817fbec86915a6e9b4dbbd3d9036"
			}
		},
......

ctrl+x保存退出

重新執行npm start即可看到天氣預報已顯示

 

旋轉屏幕

魔鏡在設計上是縱向肖像模式,所以我需要將屏幕順時針旋轉90度,最終顯示分辨率爲1080 x 1920

樹莓派的系統配置主要在boot/config.txt文件裏,相關的配置可以參考https://www.raspberrypi.org/documentation/configuration/config-txt/README.md

在配置中需要將屏幕旋轉270度,可以按如下說明進行操作。

sudo nano /boot/config.txt

在config.txt文件最後添加

display_hdmi_rotate=3

lcd_totate=3

說明: 

對於觸摸屏添加如下內容:
lcd_rotate = 0 //不旋轉
lcd_rotate = 1 //旋轉90度
lcd_rotate = 2 //旋轉180
lcd_rotate = 3 //旋轉270

對於HDMI顯示輸出,添加:
如果是隻是想旋轉HDMI輸出顯示的角度(不用觸摸屏)
則可以添加:
display_rotate = 0
display_rotate = 1
display_rotate = 2
display_rotate = 3

如果是觸摸屏,用display的話,只會旋轉顯示,不會改觸摸屏驅動,點擊屏幕就不對
應了。。

reboot重啓樹莓派即可

reboot

 重啓後,觸摸屏驅動和顯示都會旋轉。

 

display_hdmi_rotate result
0 no rotation
1 rotate 90 degrees clockwise
2 rotate 180 degrees clockwise
3 rotate 270 degrees clockwise
0x10000 horizontal flip
0x20000 vertical flip

 

允許HDMI支持熱插拔

在/boot/config.txt中添加

hdmi_force_hotplug=1

-----------------------------------------------------------------------------------------------------------------------------------------------------------

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章