clock
2018.8.24更新
電子ペーパーで時計を作ってみました。高解像度な電子ペーパーを利用することで、きれいな文字フォントで時刻を表示することができます。文字のデータは、SDカードからBMP(ビットマップ)ファイルを読み込んでいます。このBMPファイルを書き換えることで、お好みの文字に変更することができます。また、WiFiマイコン(ESP-WROOM-02)を利用して、インターネットのNTPサーバー(現在時刻を教えてくれるインターネットのサービス)から時刻を取得するので、常に正確な時刻を表示してくれます。

  ●必要なもの  

このプログラムは「電子ペーパーとWiFiマイコンで天気予報実験セット」で動作します。キットは↓↓よりご購入いただけます。
epdexpset04
上記のキットは天気予報を表示するものですが、このハードウェをそのまま使い、ソフトウェアだけ時計のプログラムに書き換えて動作させます。
時刻はインターネットから取得するため、ご自宅に無線LANのアクセスポイント(無線LAN親機)が必要です。

  作り方 
1.電子ペーパーとボードの接続

上記のキットをご購入時は、電子ペーパーと基板が別々になっているので、基板に電子ペーパーを接続します。↓↓こちら↓↓を参考につないでください。
接続するとコネクタのフィルムケーブルがとても弱く切れやすいので、ねじれたり、引っ張ったりという強い力が加わらないように気を付けてください

2.開発環境の用意
プログラムはArduinoで作られています。↓↓こちら↓↓を参考に、マイコンの開発環境を用意してください。

3.プログラムのダウンロードとセットアップ
こちらよりプログラムをダウンロード(2018.8.24アップデート)してください。ダウンロードしたzipファイルを展開すると、「kc_epdclock」フォルダができるので、そのフォルダごとArduinoフォルダに入れてください。Aruduinoフォルダの場所はwindowsの方は[ライブラリ]→[ドキュメント]→[Arduino]です。macの場合は[書類]→[Arduino]の中です。
先ほどの「kc_epdclock」の中に「sd」というフォルダがあるので、この中のファイルをSDカードにコピーしてください。SDカードの中に「font」というフォルダができればokです。

.フォント(文字)の用意
SDカードの中の「font」フォルダの中に、文字盤の数字の画像が入っています。0.bmp~9.bmpが数字、colon.bmpがコロン(:)の画像データになっています。お好きな文字に変更するには、このファイルを書き換えてもいいですし、最初から作ってもいいです。
フォントの仕様は、以下の通りです。
  • サイズ 数字は横150ピクセル縦300ピクセル。コロン「:」は横75ピクセル縦300ピクセル
  • 色数 モノクロ(白と黒)を推奨。フルカラーのBMPでも白と黒で描けば大丈夫です。
  • ファイル形式 BMP(ビットマップ)
  • ファイル名 数字0~9は0.bmp~9.bmpのように数字に「.bmp」をつけます。コロン「:」は「colon.bmp」とします。
5.アクセスポイントの設定
kc_epdclockフォルダの中の「kc_epdclock.ino」をクリックしてarduinoを起動します。
epdclock01
11行目と12行目の”~”の中を、ご自宅の無線LANのアクセスポイントのSSIDとパスワードに変更してください。プログラムの変更は以上です。

6.コンパイルと書き込み
電子ペーパーのボードとパソコンをUSBで接続します。初めての場合は、新しいCOMポートが追加されます。Arduinoの「ツール」→「シリアルポート」で追加されたCOMポートを設定します。
espsetup17
マイコンのポートがCOM21だった場合は、上の図のようにCOM21にチェックを入れます。

epdclock02
左上のコンパイルと書き込みボタンをクリックします。.........が伸びて100%になったら書き込み完了です。マイコンのリセットがかかって、自動で時計のプログラムが実行されます。

clock

書き込みが終わったあと、30秒くらい待つと時計が表示されます。

書き込みに失敗する場合には、再度ボタンをクリックしてみてください。


シリアルモニターを起動すると、マイコンが今何をしているのか確認することができます。[ツール]→[シリアルモニタ]で表示できます。右下にある通信速度は115200bpsに変更してください。

epdclock03
時計が表示されない場合や、数字が正しく表示されない場合には、このログを確認すると、どこでおかしなことが起きているかわかります。アクセスポイントに接続できていなかったり、文字のBMPが読み込めないなど、原因を調べるのに役に立ちます。


7.仕上げ

L版のフォトフレームに電子ペーパーを入れると、きれいに納まります。100円ショップやホームセンターで売っています。写真のフォトフレームはホームセンターで100円くらいで売っていた物です。作り方はこちらになります。

clock

  プログラムの流れ 

プログラムは以下のことを実行しています。

  • アクセスポイントに接続
  • NTPサーバーに接続
  • 現在時刻を取得
  • 現在時刻をメモリに描画して電子ペーパーに表示
  • 1分先の時刻をメモリに描画(電子ペーパーには表示はしない)
  • メモリに描画した時刻になったらメモリの内容を電子ペーパーに表示
  • 「1分先の時刻をメモリに描画」にループ

無線LANに接続して、インターネットのNTPサーバと時刻同期をします。一旦同期するとTime()関数で現在時刻を取得できるようになります。NTPサーバとの時刻同期は1時間ごとに自動的に行われ、常に正しい時間が取得できるようになっています。

SDカードから画像を読み込むのに時間がかかるため、1分先の時刻の画像をメモリに描画しておき、その時刻になったらメモリの画像を電子ペーパーに表示するようになっています。


数字の描画位置は128、129行目のxpos,yposの配列で指定してあります。「時間の2桁目、1桁目、コロン、分の2桁目、1桁目」の順番です。もし、文字のサイズを変更したい場合や、表示する位置をずらしたい場合には、この中の数字を変更して描画する位置を変えてください。また、時間が1桁のときに、時刻の表示がセンターになるように、左に少しずらすようにしています。この量は143行目のxposOffsetで、指定しています。数字の横幅が150ピクセルなので、その半分の75ピクセルずらすようになっています。


 まとめ 
いかがでしたか。インターネットにはいろいろなフリーフォントがあるので、気に入ったフォントを使って、自分だけの時計を作ってみてください。
電子ペーパーのプログラムを自由に作りたい方は↓↓こちらのリファレンスをご覧ください。

この時計は、↓↓のキットで作ることができます。
epdexpset04

関連リンク