今回はラズパイネタであります。
以前、デジサイっぽいのを作りましたが、その時の経験を生かして
今回はサラリーで内製化したタイムカードシステム用のKIOSKを作ってみようと思います。
ではstart。
目次
Raspberry Pi 4 B で KIOSKまで
ではまずはラズパイでキオスク化まで。
今回はカメラを使った打刻機にする為に、カメラモジュールと
キーボードじゃダサいので、タッチスクリーンを用意しました。
揃えたモノ
Raspberry Pi 4 B 8GB元々開発用で持っている Raspberry Pi 4 B 8GB
それにしても、凄く高くなってない??
もう少し安くならないかなー
ちなみに、今回の内容で8GBは必要ないです。
カメラモジュールカメラモジュール
安いので全然平気。
タッチスクリーンのディスプレイ。
プライムデーで安くなってたのが嬉しい。
他のヤツでもいけるはず。
セッティングからKIOSK化まで
いよいよ始めます。
まず今回使ったOSは Raspberry Pi OS Lite 64bit (Bullseye) です。
最初はレガシー版でやってたのですが、64bit版も作って見たくて結局Bullseyeにしました。
これが苦戦の始まりで、メモ代わりに本投稿を。
OSのSDカードへの書き込みは皆さんやるでしょうからスルー。
ではまずはアプデ・・・ と行きたいトコロですが、
WIMAXIT 7インチモニターを付けて、SSHすると妙に重い。
しかもモニターは直ぐに真っ暗になる・・・。
後ほど原因が分かるのですが、最初の作業はモニターはつけずPCからSSHするのがおススメ。
ではまず、アプデ。
アプデ
$ sudo apt-get update $ sudo apt-get upgrade $ sudo apt-get dist-upgrade $ sudo reboot
その後、ディスプレイを使えるようにするために、ドライバーを入れます。
真っ暗な原因はドライバーが入ってない事ッポイ??
ちなみにbusterでは普通に写っていたので、結構ハマったポイント。
Git と LCDドライバー
まずはGitをインストール。
ドライバーがGitにあるようなので。
$ sudo apt-get install -y git
gitが入ったら、ドライバー入れてきます。
$ sudo git clone https://github.com/kedei/LCD_driver $ sudo chmod -R 777 LCD_driver $ cd LCD_driver $ sudo ./LCD35_hdmi
これで再起動されて、画面が写り使えるようになります。
がしかし、解像度が設定が微妙なので、
$ sudo nano /boot/config.txt #下のほうにある部分を変更 hdmi_force_hotplug=1 config_hdmi_boost=7 hdmi_drive=2 hdmi_group=2 hdmi_mode=87 hdmi_cvt 1024 600 60 6 0 0 [pi4] # Enable DRM VC4 V3D driver on top of the dispmanx display stack dtoverlay=vc4-fkms-v3d #max_framebuffers=2 #hdmi_timings=600 0 20 28 48 400 0 13 3 32 0 0 0 30 0 25000000 5
config.txt の hdmi_cvt の内容を変更し、hdmi_timingsはコメントアウトしました。
これで reboot すれば 1024*600になります。
調べてたら似たようなドライバー見つけたので追記
ラズパイZEROにはこっちのドライバー入れた。
最後の sudo ./LCD7-1024×600-show はディスプレイによって変更。
$ sudo git clone https://github.com/waveshare/LCD-show $ sudo chmod -R 777 LCD-show $ cd LCD-show $ sudo ./LCD7-1024x600-show
こっちのがストレートに入るかも??
↑のドライバー使ってKIOSKしたさいに ”Failed to load module ‘fbturbo'” が出ちゃうようなら
sudo mv /usr/share/X11/xorg.conf.d/99-fbturbo.conf ~
で99-fbturbo.confをいなくすればKIOS出来ました。
Kioskまでの流れ
それではKIOSKまで。
オートログインの設定。
$ sudo raspi-config System Options -> Boot/AutoLogin -> Console Autologin
GUI系とChromiumのインスト
$ sudo apt-get install --no-install-recommends xserver-xorg x11-xserver-utils xinit openbox $ sudo apt-get install --no-install-recommends chromium-browser
autostartの設定
$ sudo nano /etc/xdg/openbox/autostart xset -dpms xset s noblank xset s off #デジサイじゃ無いんでscreensaverはどっちも良いかも。 sed -i 's/"exited_cleanly":false/"exited_cleanly":true/' ~/.config/chromium/'Local State' sed -i 's/"exited_cleanly":false/"exited_cleanly":true/; s/"exit_type":"[^"]\+"/"exit_type":"Normal"/' ~/.config/chromium/Default/Preferences chromium-browser --noerrdialogs --disable-infobars --kiosk $KIOSK_URL
ターミナルに戻る方法が分かったので追記。
CTR+ALT+F10 を押した後、ALT+F4 で戻れました。
$KIOSK_URLの設定
$ sudo nano /etc/xdg/openbox/environment #https://google.comを好きなアドレスに export KIOSK_URL=https://google.com
追記。
今では他の人もURLをセット出来るようにbootディレクトリからURLを読みとるようにした。
/boot/stampurl.txt を作ってURLを記載すれば読み取ります。
$ sudo nano /etc/xdg/openbox/environment export KIOSK_URL=$(cat /boot/stampurl.txt)
bash_profileの設定
$ sudo nano .bash_profile [[ -z $DISPLAY && $XDG_VTNR -eq 1 ]] && startx -- -nocursor
これでrebootすればKIOSKの完成。
スリープしないように
$ iwconfig wlan0 Power Management:on
Power Management:on なので
$ sudo nano /etc/rc.local # exit 0 の上に追加↓↓ /sbin/iw wlan0 set power_save off
/sbin/iw wlan0 set power_save off を追加して
$ iwconfig wlan0 Power Management:off
になる。
カメラモジュールを使えるようにする
$ sudo raspi-config Interface Options -> legacy camera -> Enable
一応 config.txt にstart_x=1を
$ sudo nano /boot/config.txt gpu_mem=128 start_x=1
これでrebootしたら、Bullseyeのchromiumでもカメラを認識しました。
モニターを縦置きに
自前で作ったシステムがスマホ向けなので、縦のほうが収まりが良く、その設定。
ここもドハマりしてた。
config.txtで触っても出来るんだけど、autostart を使います。
$ sudo nano /etc/xdg/openbox/autostart xrandr --output HDMI-1 --rotate right
上のほうに追加。
これでディスプレイ例を90度傾けます。
そしてタッチスクリーンも傾ける。
$ sudo nano /usr/share/X11/xorg.conf.d/45-evdev.conf # Option "TransformationMatrix" "0 1 0 -1 0 1 0 0 1" を追加してる Section "InputClass" Identifier "evdev touchscreen catchall" MatchIsTouchscreen "on" Option "TransformationMatrix" "0 1 0 -1 0 1 0 0 1" MatchDevicePath "/dev/input/event*" Driver "evdev" EndSection
Touchscreenがどうたらって書いてある部分に
Option “TransformationMatrix” “0 1 0 -1 0 1 0 0 1”
を追加。
これでrebootで完成。
完成
このよう、QRコードを読み取り打刻するタイムカードシステムの専用端末になりました。
ちなみにシステムはWordpress上にプラグインとして構築しています。
PWAなのでスマホにも簡単にインスト可能です。
ご依頼があれば設置&オリジナル作ります。
ではでは。