TOPPERS 活用アイデア・アプリケーション開発
コンテスト

部門

：

アプリケーション開発部門

作品のタイトル：

デジタルお絵かきボード

作成者：

石岡之也（個人）

共同作業者

：なし

対象者

：

子供から大人まで使用する開発成果物：

TOPPERS/ASP 1.9.3
ARM Cortex-M7 アーキテクチャ・GCC 依存部

目的・狙い
いままでマイコンと LED マトリクスパネルを用いて電光掲示板の製作してきたが、業務利用、とくに展示会などのプレゼン用途のみと、利用範囲が限られていた。また、データも事前にＰＣで作成したテキストファイルを表示する方式でインタラクティブに表示を変えることができなかった。
このため、電光掲示板の利用範囲を広げるアイデアとして子供が遊びで使うお絵かきボードをマイコンと LED マトリクスパネルを用いて開発しようと考えた。

アイデア/アプリケーションの概要
STM32F746G-DISCO ボードと LED マトリクスパネルを用いて、STM32F746G-DISCO ボードのタッチパネルと LCD から手入力した画像を LED マトリクスパネル上に表示するアプリケーション。 LED マトリクスパネルで大きな表示装置を作るのは高価になることと消費電力が大きくなり扱いが難しくなるため、小さな LED マトリクスパネル上に大きな画像を表示させるよう、画像を左右方向にスライドさせることで大きな画像の表示を実現した。

１．開発の背景
いままでマイコンと LED マトリクスパネルを用いて電光掲示板の製作してきましたが、業務利用、とくに展示会などのプレゼン用途のみと、利用範囲が限られていました。
また、データも事前にＰＣで作成したテキストファイルを選択して表示する方式で、その場の状況に応じてインタラクティブに表示を変えるようにできていませんでした。
今回使用したSTM32F746G-DISCO ボードのように評価ボードとしてLCD やタッチパネルをセットにしたボードが容易に入手できることと、同ボード用に TOPPERS/ASP が提供され、容易にタスクまで起動できる環境が提供されていることからタッチパネルを使った入力結果を LED マトリクスパネルへ出力するアプリの調査、検討を行いました。
調査する中で子供向けのお絵かきボードが LED マトリクスパネルとサイズ的に似ていることと、指でなぞった部分の色が変わるのはタッチパネルの操作に似ていることからお絵かきボードをマイコンと LED マトリクスパネルを用いて開発しようと考えました。
また、お絵かきボードを応用したメモツールが市販され子供以外にも使われていることから、メモツールや離席案内のような使い方で大人も利用できると考えました。

お絵かきボードの例

メモツールの例

２．デジタルお絵かきボードの仕様
選択中の描画色

描画色の選択ボタン
赤色、緑色、青色、黄色、紫色、水色、白色、黒色から選択可能

機能ボタン
clear：描画領域のクリア
描画領域Ａ

slide：表示フレームのスライドの開始／停止

描画領域（タッチすると描画される領域）

copy ：描画領域を表示フレームへコピー

描画領域Ｂ

top ：表示フレームの表示位置を先頭へ戻す
erase：消しゴム

LED マトリクス表示フレーム「 LED マトリクス表示フレーム 」の内容がLED マトリクスに右から左へスライドしながら出力される

スライドする・LED マトリクス表示フレームに表示されている画像が LED マトリクスパネルに表示されます。
・LED マトリクスパネルへの表示は右から左へスライドしながら LED マトリクス表示フレームが繰り返し表示されます。
・LED マトリクスパネルへの表示のスライドは可変抵抗の抵抗値を変えることでスピードを変更可能です。
・描画領域（描画領域Ａ＋描画領域Ｂ）にタッチすることでそのときの選択色「use」の色で描画をすることができます。
描画領域内では１ピクセルが２×２ドットに拡大された表示になります。
・選択色「use」はその右に配置されている描画色の選択ボタンにタッチすることで変更することができます。
・選択色は 赤色、緑色、青色、黄色、紫色、水色、白色、黒色を用いることができます。
・「clear」にタッチすると描画領域がクリアされます。
・「slide」にタッチすると表示のスライドの開始／停止を切り替えることができます。
「slide」内の四角が緑色の時にスライド開始、赤色の時にスライド停止となります。
・「copy」にタッチするとそのときの描画領域の内容が LED マトリクス表示フレームに転送され、LED マトリクスパネルの内容が更新されます。
・「top」にタッチすると LED マトリクスパネルへの表示が LED マトリクス表示フレームの先頭に戻ります。
・「erase」にタッチすると消しゴムモードになり描画領域内の少し大きめポイントを消去することができます。
「erase 内の四角が緑色の時が消しゴムモード、赤色の時が通常の描画モードになります。

３．動作環境●マイコンボード
ＳＴマイクロエレクトロニクス社 STM32F746G-DISCO ボード●LED マトリクスパネル
3mm 64x32 ドット RGB マトリクスパネル<https://www.akiba-led.jp/product/1160>●拡張ボードSTM32F746G-DISCO と LED マトリクスパネルとの間に入れるバッファとスピード調整用の可変抵抗を搭載した新規作成ボード●接続ケーブル
拡張ボード経由で STM32F746G-DISCO と LED マトリクスパネルを接続する１６芯フラットケーブル

LED マトリクスパネル

接続ケーブル

STM32F746G-DISCO ボード

拡張ボード（新規作成）

４．開発環境
開発環境や使用した TOPPERS 成果物を以下に記します。
PC Linux 上に ARM クロスコンパイラのインストールと TOPPERS 成果物を展開し、コンフィグレーション
後にデジタルお絵かきボードのプログラムの作成とビルドを行いました。
●TOPPERS/ASP カーネル ターゲット非依存部< https://www.toppers.jp/download.cgi/asp-1.9.3.tar.gz >●TOPPERS/ASP カーネル ターゲット依存部
ARM Cortex-M7 アーキテクチャ・GCC 依存部パッケージ< https://www.toppers.jp/download.cgi/asp_arch_arm_m7_gcc-1.9.3.tar.gz>●コンフィギュレータ Release 1.9.6（32bit Linux 用バイナリ）< https://www.toppers.jp/download.cgi/cfg-linux-static-1_9_6.gz>●ビルド用プラットフォーム
PC Linux / Fedora 14●クロスコンパイラ
GNU ARM Embedded Toolchain
5-2016-q3-update / Linux 32-bit<https://developer.arm.com/-/media/Files/downloads/gnu-rm/5_4-2016q3/gcc-arm-none-eabi-5_4-2016q3-201
60926-linux.tar.bz2>

５．ハードウェア構成と回路図
デジタルお絵かきボードで使用するハードウェア構成と回路図を以下に記します。
●ハードウェア部品の構成

●STM32F746G-DISCO 内の使用ハードウェア

STM32F746G-DISCO
可変抵抗

STM32F746NGH6 マイコン

ST-Link

デバッグ用
コンソール
syslog 出力

ADC
USART1
SDRAM
コントロー

GPIO
LCD
コントロー

●回路図

パネル

I2C3

タッチパネルコントローラ

SDRAM
フレームバッファLED マトリクス

4.3Inch LCD

タッチパネルAC アダプタ
５Ｖ３Ａ

６．ソフトウェアの構成●ソースツリーの構成
デジタルお絵かきボードのディレクトリ構成、ファイルの構成を以下に記します。

├─asp│ ├─arch│ │ ├─arm_m_gcc│ │ │ ├─common│ │ │ └─stm32f7xx│ ├─cfg│ │ └─cfg│ ├─include│ ├─kernel│ ├─library│ ├─syssvc│ ├─target│ │ └─stm32f7discovery_gcc│ ├─tools│ │ └─rommon└─sample├─CMSIS│ └─Include├─matled│ │ busyloop_msec.S│ │ busyloop_msec.S│ │ fx_8x16rk_fnt.c│ │ jiskan16_fnt.c│ │ matled_dev.c│ │ matled_main.c│ │ matled_main.h│ │ matled_param.h│ │ sample1.c│ │ sample1.cfg│ ＋ sample1.h├─STM32F7xx│ └─Include└─STM32F7xx_HAL_Driver├─Inc└─Src

TOPPERS/ASP ソースasp_arch_arm_m7_gcc-1.9.3.tar.gz 提供ファイル
asp_arch_arm_m7_gcc-1.9.3.tar.gz 提供ファイル

asp_arch_arm_m7_gcc-1.9.3.tar.gz 提供ファイル

ＳＴＭ社提供サンプルを流用
新規
新規
新規
新規
新規
新規
新規
新規
TOPPERS/ASP 改造
TOPPERS/ASP 改造
TOPPERS/ASP 改造
ＳＴＭ社提供サンプルを流用
ＳＴＭ社提供サンプルを流用
ＳＴＭ社提供サンプルを流用
ＳＴＭ社提供サンプルを流用

●タスク構成
デジタルお絵かきボードのタスク構成と主要関数は以下の通りです。
５つのタスクとデフォルトで生成されるサイクルハンドラ、アラームハンドラで構成されています。
なお、サイクルハンドラ、アラームハンドラは現時点では未使用ですが、将来の機能拡張を考慮し、削除せずに残してあります。

メインタスクパネル制御タスク

スライドタスク

キー処理タスク

フレーム描画タスク

main_task()

subtask1()

subtask2()

subtask3()

subtask4()

matled_main()matled_dev_out()

matled_vol_read()keytask()

lcd_draw_framearea()

HAL_ADC_GetValue()

lcd_init_framearea()

BSP_TS_GetState()
lcd_draw()

機能拡張用（未使用）

lcd_check_key()

ＴＯＰＰＥＲＳ／ＡＳＰ

サイクルハンドラ

アラームハンドラ

cyclic_handler()

alarm_handler()

ＳＴＭ提供 ＢＳＰ／ＨＡＬ

●タスク概要
デジタルお絵かきボードの各タスクの概要を以下に記します。
（１）メインタスク／入り口関数：main_task()
プライオリティ「５」で動作します。
デバイスの初期化と他タスクの起動後、matled_main()を呼び出しお絵かきボードの主処理を開始します。
matled_main()では、タッチパネルの押下チェックを行い、Ｙ座標（短辺方向）の座標からドットの描画かＬＣＤ内ボタンの押下かの判定、および連続描画チェックを行います。
tslp_tsk()で５ミリ秒の待ちを入れてタッチパネルの押下チェックを繰り返します。
主要な関数の処理概要を以下に記します。
関数名

概要
ＬＣＤの表示の初期化とタッチパネル操作時の処理を行う。

matled_main()

タッチパネルが操作されたらＹ座標に応じてボタン処理、描画処理を振り分け処理する。
また描画処理の場合には連続されたタッチかの確認とそれぞれの処理を行う。

BSP_TS_GetState()

ＳＴＭ提供のタッチパネルの状態読み出し関数。
タッチの有無とタッチ時のＸＹ座標を取得し、引数の構造体へのポインタを通して結果を返す。
引数のＸＹ座標と指定色をもとに描画領域への描画、消去を行う。
イレースモードであれば指定座標の ６×６ドット（表示フレーム、および、LED マトリクス上の３×３ドット相当）の消去を行う。

lcd_draw()

描画が始点であれば指定色で指定座標の ２×２ドット（表示フレーム表示フレーム、および、LED マトリクス上の １×１ドット相当）の描画を行う。
描画が継続であれば、指定色で１つ前のＸＹ座標から指定座標まで２×２ドット（表示フレーム
表示フレーム、および、LED マトリクス上の １×１ドット相当）単位でライン描画を行う。
引数のＸＹ座標からＬＣＤ上のボタンの範囲がタッチされたか確認し、タッチされた場合にはそれぞれのボタンの処理を行う。
描画色選択ボタンであれば、描画色の設定と use 領域への描画色での更新、イレースモードを終了する。

lcd_check_key()

clear ボタンであれば、描画領域全体を消去する。
slide ボタンであれば、スライドモードのトグル状態を更新する。
copy ボタンであれば、描画領域の内容を読み出し、LED マトリクス表示フレームへ反映する。反
映は描画領域Ａの内容を表示フレーム左側、描画領域Ｂの内容を表示フレーム右側に描画する。
top ボタンであれば、表示位置を先頭へ変更する。
erase ボタンであれば、イレースモードのトグル状態の更新と use 領域を黒色で更新する。

（２）パネル制御タスク／入り口関数：subtask1()
プライオリティ「３」で動作します。
表示位置、LED マトリクス表示フレームの内容から１面３２ライン分を一気に LED パネルへの出力後、１ミリ秒の dly_tsk()で待ちを入れて描画を繰り返します。
３２ラインの表示中に処理が切り替わるとラインの輝度が変動するため、タスク内で最高プライオリティで動作させています。
主要な関数の処理概要を以下に記します。
関数名
matled_dev_out()

概要
表示位置と表示フレームの内容で LED マトリクス３２ライン分の更新を一気に行う。
１面表示後、１ミリ秒の dly_tsk()で待ちを入れて処理を繰り返す。

（３）スライドタスク／入り口関数：subtask2()
プライオリティ「１０」で動作します。
可変抵抗の値を読み出し、得られた値から tslp_tsk()で待ちを繰り返しながら横方向のスライドを行うための表示位置の更新を行います。
表示位置が終端に達したら先頭に戻しループして表示を繰り返します。
主要な関数の処理概要を以下に記します。
関数名
matled_vol_read()
HAL_ADC_GetValue()

概要
ＳＴＭ提供 HAL_ADC_GetValue()を呼び出し、可変抵抗の値を読み出して呼び出し元へ返す。
ＳＴＭ提供のＡＤ変換値の読み出し関数。
可変抵抗のＡＤ変換で得られた値を返す。

（４）キー処理タスク／入り口関数：subtask3()
プライオリティ「１１」で動作します。
STM32F746G-DISCO オンボードのユーザスイッチを監視し、押下されたら可変抵抗の読み出して syslog()への出力、および、LED マトリクス表示フレームを初期表示へ戻す動作確認のタスクです。
全タスクで最低プライオリティに設定してアイドルタスクとして動作させています。
主要な関数の処理概要を以下に記します。
関数名
keytask()概要
オンボードのユーザスイッチを監視し、押下されたら可変抵抗の読み出して syslog()への出力、および、lcd_init_framearea()を呼び出し LED マトリクス表示フレームを初期表示へ戻す。
LED マトリクス表示フレームを初期表示へ戻す。

lcd_init_framearea()

表示フレームの内容を定数で持っている描画データで描画後、表示位置を先頭、スライドモードをスライド状態へ変更する。

（５）フレーム描画タスク／入り口関数：subtask4()
プライオリティ「１０」で動作します。
tslp_tsk()で５秒ごとに描画領域の枠線の表示を更新するＬＣＤ表示の補助を行うタスクです。
主要な関数の処理概要を以下に記します。
関数名
lcd_draw_framearea()

概要
描画領域の枠線を再描画する。

７．デジタルお絵かきボードの動作状況

起動初期画面

描画領域Ａへ描画

描画領域Ｂへ描画

起動初期の LED マトリクスの表示

copy ボタンで表示フレームへの反映と LED マトリクスへ出力

copy ボタンで表示フレームへの反映と LED マトリクスへ出力

メモツール、離席案内としての利用例●動作動画
デジタルお絵かきボードを動作させた動画の URL を以下に記します。
<https://youtu.be/MhkI7HKpbLM>－ 以上 －