Arduinoでメンブレンスイッチ(キーパッド)を使って文字入力！ビジュアルプログラミングLESSON26
こんにちは、せでぃあ(@cediablog)です。
今回のArduinoプログラミングLESSON26では、｢メンブレンスイッチ(キーパッド)を使った文字入力プログラム｣を紹介します。
メンブレンスイッチはクリック感のない柔らかい押しボタンスイッチで、スマホなどの「タッチパネル入力」が主流になる前はキーボード式と並んで主力の文字入力方法でした。
でもこのメンブレンスイッチですが、いったいどうやって押された文字を認識しているのか？気になりますよね。
今回はメンブレンスイッチの仕組みの解説に加えて、液晶ディスプレイLCD1602にメンブレンスイッチ(キーパッド)で押された文字を表示させるプログラムの作り方を紹介します。
本テーマでは、ELEGOO最終版スターターキットに含まれるメンブレンスイッチを使っています。
また、今回液晶ディスプレイLCD1602を省配線で制御可能なI2Cを使ったシリアル通信を使います。
I2C通信を使ったLECディスプレイ表示方法については、こちらの記事にて詳しく解説しています。
本記事は、プログラミングと電子パーツの知識が習得できるプログラミング初心者も安心して取り組めるテーマとなっています。
小学生、中学生も安心してプログラミングができるように、文字列を使わなビジュアルプログラミング方法を動画付きで紹介しています。
せでぃあビジュアルプログラミングを使えば、小学生低学年からでも抵抗なくプログラミングができますよ！
本記事では、スクラッチベースのビジュアルプログラミングツールmBlockとArduinoIDEプログラムどちらのプログラミング方法も紹介しています。
無料のブロックプログラミングツールmBlockのインストール方法については、こちらの記事を参照してください。
- メンブレンスイッチ(キーパッド)の仕組みと配線方法
- Arduino IDEでのプログラミング方法
- ｍBlockを使ったビジュアルプログラミング方法
せでぃあ
せでぃあはこんな人物です
✅プライム企業に勤める電気・機械設計エンジニア
✅親子の絆を深めるため、夏休みに子供と一緒に電子工作を製作
✅Arduinoプログラミングを用いて作ったプログラミング電子工作｢信GO機｣が市の発明くふう展で｢優秀賞｣を受賞
✅本ブログにてArduinoスクラッチプログラミングLESSON記事投稿中
✅YouTubeチャンネル｢せでぃあブログちゃんねる｣運営中
温度を測定する方法として、温度と湿度の両方を測定できるセンサ「DHT11」という機器もあります。
メンブレンスイッチの仕組み
まずはじめに、メンブレンスイッチ(キーパッド)の仕組みについて解説します。
メンブレンスイッチの内部は上図のような行と列の配線構造になっており、4行＋4列＝8本の配線で構成されています。
上図の配線番号は、今回Arduinoに接続するピン番号(2～9)にあわせて振っています。
スイッチが押されると、押されたキーに配線されている2本の線がつながります。
押されたキーとつながる線の例
- 「1」：5番線と9番線が導通します。
- 「5」：4番線と8番線が導通します。
- 「D」：2番線と6番線が導通します。
Arduinoの入出力ピンにメンブレンスイッチの行列につながる8本の線を接続して、導通する2本の線の組み合わせから「どのキーが押されたのか」認識させる仕組みです。
せでぃあメンブレンスイッチは単純な仕組みであると感じていただけけると思います。
押されたキーをLCDディスプレイに表示させる動作の解説
今回紹介する｢メンブレンスイッチの押されたキーをLCDディスプレイに表示させる動作｣について説明します。
動作の説明
- メンブレンスイッチのキーを1つずつ押す。
- 押されたキーの文字がLCDディスプレイに表示される。
- LCDディスプレイに表示される文字が押された文字に書き換わる。
- メンブレンスイッチ(キーパッド)の仕組みについて
- LCDディスプレイへの押されたキーの表示動作
- mBlockを使ったプログラミング方法
まずは動画を見て、今回のLESSONで実行させたい動作内容を確認してください。
また、mBlockを使ったブロックプログラミングや動作確認方法についても解説しています。
せでぃあ動画内にて、mBlockを使ったビジュアルプログラミングの作り方も解説しています。
押されたキーをLCDに表示させるまでの流れ
メンブレンスイッチの押されたキーをLCDディスプレイに表示させるために必要な作業を解説します。
今回は文字列を使ったプログラム形式と、文字列を使わないブロックプログラミング形式の両方について説明します。
あなたの作りたいプロブラム形式に対応した手順に応じて、対応してください。
プログラム形式に応じた開発環境
- 文字列による命令語形式 ⇒ ArduinoIDE
- スクラッチベースのビジュアル形式 ⇒ mBlock
せでぃあコードプログラミングに不慣れの方は、ビジュアルプログラミングがおすすめです！
プログラミングするために、パソコンが必要です。
電子部品等の必要な機器については、このあと説明します。
パソコンに統合開発ソフトウェア｢ArduinoIDE｣のインストールを行います。
Arduinoのセットアップ方法については、以下の記事にて詳しく説明しています。
Arduino IDEでの言語プログラミングも勉強したい方は、プログラミングの流れを理解しておいてください。
以下の記事にて、プログラミングから動作確認までの流れを詳しく説明しています。
mBlockでプログラミングする場合は、ArduinoIDEのインストールは不要です。
パソコンにスクラッチベースのビジュアルプログラミングツール｢mBlock｣のインストールを行います。
以下の記事にて詳しく説明しています。
ArduinoIDEでプログラミングする場合は、mBlockのインストールは不要です。
電子部品とジャンパーワイヤの差し込みだけで配線が可能です。
専用開発ソフトウェア｢Arduino IDE｣を使います。
私が作成したプログラムをコピペして使ってください。
Arduino IDEプログラミングの基本操作については、こちらの記事にて詳しく説明しています。
mBlockでプログラミングする場合は、ArduinoIDEプログラミングは不要です。
スクラッチベースのビジュアルプログラミングツールmBlockを使ってプログラムを作成します
プログラム内容については、後述するプログラミング例を参考にしてください。
ArduinoIDEでプログラミングする場合は、mBlockプログラミングは不要です。
プログラムが完成したら動作確認を行います。
- LCDディスプレイのバックライトが点灯しているか？
- 押されたキーがLCDディスプレイ上段左側に表示されるか？
- 別のキーを押すとディスプレイに表示される文字が切り替わるか？
メンブレンスイッチの押されたキーを表示させる回路で使うもの
今回は、LCDディスプレイをI2C通信で制御する方法を紹介した記事の一部配線変更にて対応可能な内容です。
I2C通信を使ったLCDディスプレイ表示が初めての方は、こちらの記事から読んでいただくことをおすすめします。
- パソコン
- Arduino本体
- USBケーブル
- ブレッドボード
- メンブレンスイッチ
- LCD1602モジュール
- I2Cモジュール
- ジャンパー線(オスーメス)×4本
- ジャンパー線(オスーオス)×8本
今回はELEGOO社のスーパースターターキットに含まれる部品で作ることができますが、Arduino裏面のショート対策としてクリアケースも併せて準備することをおすすめします。
【おすすめ】遊べるパーツがぎっしり詰まった最強のArduinoキットです！
ポチップ
ポチップ
パソコン
プログラムを作成するために必要です。
プログラム制御の演算はArduino側で行うため、パソコンのSPECは一般的なモデルで十分対応可能です。
パソコンのOSはWindows、Macどちらでも対応可能です。
Arduino本体【キット】
基本的なエディション｢Arduino Uno｣の互換機である、ELEGOO社のUNO R3を使用しています。
Arduino本体裏面のショート対策に、別売りのクリアケースの購入をおすすめしています。
各ソケットの役割など、Arduino本体の機能について以下の記事にて詳しく説明しています。
USBケーブル【キット】
パソコンとArduinoを接続してプログラムデータのやり取りをするために必要です。
ブレッドボード【キット】
たくさんの穴が開いていて、部品の端子を穴に差し込むだけで電気的に接続が可能な板です。
説明図は30列のショート版ですが、最終版スターターキットに含まれる63列タイプでも機能は同じです。
ブレッドボードだけの購入も可能です。
ポチップ
メンブレンスイッチ(キーパッド)【キット】
キーパッドは、8本の電線が行と列ごとに配線されている電子機器です。
Arduinoの入出力ソケットに接続することで、押されたキーを認識することができます。
LCD1602モジュール【キット】
液晶ディスプレイ「LCD(Liquid Crystal Display)」モジュールになります。
数字や文字などを表示させることが可能です。
I2Cモジュール
I2Cを使ってLCDを制御するために必要なモジュールです。
電源線2本と通信線2本の合計4本の配線だけで、LCDを制御することが可能になります。
ポチップ
せでぃあI2Cモジュールはキットに含まれないため、別途購入が必要です。
ジャンパー線(オスーメス)【キット】
オス－メスジャンパー線を4本使用します。
I2CシリアルインターフェースボードとArduino本体を接続させるために使用します。
ジャンパー線(オスーオス)【キット】
ジャンパー線を8本使用します。
Arduino本体とメンブレンスイッチを接続するために使用します。
ポチップ
ポチップ
メンブレンスイッチの押されたキーを表示させる回路の配線方法
ここからは、各機器間の配線方法について解説します。
上図が配線説明図となりますので、これと同じ配線をすれば完成します。
I2CモジュールはLCDディスプレイと接続するため、同じ列に接続します。
機器が故障するおそれがあるので、LCDに接続する極性(5VとGND)には十分注意して配線してください。
機器故障させないためにも、USBケーブルを抜いた｢通電OFF｣状態にて配線を行ってください。
プログラミングのやり方
本記事では、以下に示す｢Arduino IDEプログラミング｣と｢mBlockプログラミング｣の２通りのプログラミング方法について解説しています。
いずれか１つのプログラミング方法を用いることで、本LESSONの動作を行うことが可能です。
ArduinoIDE：文字列による命令語形式
mBlock：スクラッチベースのビジュアル形式
文字列を使わないmBlockの方が、直感的で分かりやすく小学生におすすめのプログラミング方法になります。
mBlockを使ってプログラミングをする方は、mBlockの説明まで読み飛ばしてください。
せでぃあプログラミング初心者の方は、ビジュアルプログラミングがおすすめです！
LiquidCrystal_I2Cライブラリのインストール
ArduinoIDEを使用した文字列プログラミングを行うためには、LiquidCrystal_I2Cライブラリのダウンロードとインストール作業が必要となります。
LiquidCrystal_I2Cライブラリのダウンロードとインストール方法を解説します。
mBlockでプログラミングをする場合は、本ライブラリインストール作業は不要です。
｢Download ZIP｣をクリックして、ZIPファイルをダウンロードします。
ArduinoIDEを開き、｢スケッチ｣⇒｢ライブラリをインクルード｣⇒｢.ZIP形式のライブラリをインストール…｣の順に選択して、STEP3でダウンロードしたZIPファイルを選択。
インストールが行われ、ライブラリインストール作業が完了となります。
Keypadライブラリのインストール
ArduinoIDEを使用した文字コードプログラミングでメンブレンスイッチの行列信号入力を、プログラム内にて特定の文字に変換するために必要なKeypadライブラリを使います。
Keypadライブラリのダウンロードとインストール方法を解説します。
mBlockでプログラミングをする場合は、本ライブラリインストール作業は不要です。
Arduino IDEを開き、左側のライブラリアイコンをクリックします。
スケッチ⇒ライブラリをインクルード⇒ライブラリを管理をクリックしても同じ操作になります。
検索窓に｢keypad｣と入力して、Keypadライブラリを検索します。
ライブラリが検索できたら、インストールボタンをクリックしてライブラリをインストールします。
ライブラリのインストールが完了した旨の表示がされたら、Keypadライブラリのインストールは完了です。
Arduino IDEプログラミング
Arduino IDEとは統合開発ソフトウェアで、C言語のような文字列を用いたプログラミング方法です。
プログラミングするにあたり、ある程度の命令語を知っておく必要があります。
Arduino IDEのインストール方法については、以下の記事で詳しく説明しています。
日本語版のArduino公式リファレンスが記載されているので、関数を調べるときに重宝します！(私も所有しています)
ポチップ
プログラミング方法
Arduino IDEを使って、文字列プログラミングを行います。
Arduino IDEを使ったプログラミング～動作確認方法については、以下の記事で詳細説明しています。
Arduino IDEプログラム
/* 作品名：LESSON26 */
/* 作成者：せでぃあ https://cediablog.com */
/* キーパッド(メンブレンスイッチ)による入力確認 */
// ライブラリのインクルード
#include <LiquidCrystal_I2C.h>
#include <Keypad.h>
// LiquidCrystal_I2Cクラスのインスタンスを作成
LiquidCrystal_I2C lcd(0x27, 16, 2); // 0x27のアドレス,16列2行のLCDを使用
// キーパッドの行列数指定
const byte ROWS = 4; //行数の指定
const byte COLS = 4; //列数の指定
//キーパッドボタンへの文字・記号割り当て
char hexaKeys[ROWS][COLS] = {
{ '1', '2', '3', 'A' },
{ '4', '5', '6', 'B' },
{ '7', '8', '9', 'C' },
{ '*', '0', '#', 'D' }
};
byte rowPins[ROWS] = { 9, 8, 7, 6 }; //キーパッドの行に接続した入力ピン割り当て
byte colPins[COLS] = { 5, 4, 3, 2 }; //キーパッドの列に接続した入力ピン割り当て
//Keypadクラスのインスタンスを作成
Keypad new_keypad = Keypad(makeKeymap(hexaKeys), rowPins, colPins, ROWS, COLS);
void setup() {
//プログラム起動時1回だけ処理される回路
lcd.init(); // LCDの初期化
lcd.backlight(); // LCDバックライトの点灯
}
void loop() {
//プログラム起動後ﾙｰﾌﾟ処理される回路
char key = new_keypad.getKey(); //文字列変数｢key｣にキーパッド入力文字を代入する
if (key) {
lcd.setCursor(0, 0); //上段1列目にカーソルを移動
lcd.print(key); //LCDディスプレイにキーパッド入力文字を表示させる
}
delay(100); //0.1秒ウェイト
}
上記がLCDディスプレイにメンブレンスイッチの押されたキーを表示させるプログラムになります。
Arduino IDEのプログラム画面にコピーアンドペーストすることで、動作確認まで進めることができます。
各プログラム列の右側にプログラム内容をコメント記入してありますので参考にしてください。
せでぃあLiquidCristal_I2Cライブラリのインストールを忘れずに行ってください。
命令語の解説
今回のプログラムで使用した命令文について、解説します。
変数のデータ型指定
変数のデータ型を指定するものです。
| データ型 | 説明 | 扱える範囲 |
|---|---|---|
| int | 2バイトの整数を代入可能。 | -32768～32767 |
| long | 4バイトの整数を代入可能 | -2,147,483,648～2,147,483,647 |
| float | 4バイトの小数を代入可能。 | 3.4028235×1038～-3.4028235×1038 |
| char | 1バイトの値を代入可能。文字列の代入に利用されます。 | -128～127 |
| boolean | 0または1のみ代入可能。フラグのON-OFFなどに利用されます。 | 0,1 |
delay(時間)
()内で指定した時間(単位はmsec)だけ、プログラム実行を待たせます。
if 文
条件が成立しているときのみ、{ }内の文が実行されます。
条件が成立しなければ、{ }内の文は処理されず、次の処理に移ります。
if( 条件 ){
条件成立時に実行する文 ;
}
LiquidCrystal_I2Cライブラリの説明
今回はLCD1602の制御をするために、｢LiquidCrystal_I2Cライブラリ｣を使用します。
このライブラリを使うだけで、簡単にLCD表示を制御できます。
LiquidCrystal_I2Cライブラリの読み出し
プログラム冒頭の宣言部にてLiquidCrystalライブラリを読み出します。
#include <LiquidCrystal_I2C.h>
LiquidCrystal型変数の指定
プログラム冒頭の宣言部にてLiquidCrystal_I2C型の変数を定義します。
LiquidCrystal_I2C lcd(I2Cアドレス, 桁数, 行数)
変数「lcd」は例であり、任意の変数文字列を指定してください。
init()
LCDの表示内容をクリアし、カーソルを左上に移動させます。
lcd型変数.init
clear()
LCDの表示内容をクリアします。
lcd型変数.clear()
setCursor(桁 , 行)
カーソル位置を指定します。テキスト表示開始位置を指定することができます。
lcd型変数.setCursor(桁、行)
桁は左端が｢0｣、行は上段が｢0＝1行目｣になります。
print(“表示させたい文字列”)
LCDに文字列を表示させます。
lcd型変数.print(“表示させたい文字列”)
backlight()
LCDバックライトを点灯させます。
lcd型変数.backlignt()
Keypadライブラリの説明
今回はメンブレンスイッチの入力キーを文字変換するために、｢Keypadライブラリ｣を使用します。
このライブラリを使うだけで、簡単にプログラム内で押されたキーを任意の文字に変換できます。
Keypadライブラリの読み出し
プログラム冒頭の宣言部にてKeypadライブラリを読み出します。
#include <Keypad.h>
メンブレンスイッチの行列数を指定
メンブレンスイッチのキー配置行列数を変数として定義します。
const byte ROWS = 4; //行数の指定
const byte COLS = 4; //列数の指定
キーパッドボタンへの文字・記号割り当て
行と列の組み合わせに対する文字・記号への割り当てを指示します。
char hexaKeys[ROWS][COLS] = {
{ ‘1’, ‘2’, ‘3’, ‘A’ },
{ ‘4’, ‘5’, ‘6’, ‘B’ },
{ ‘7’, ‘8’, ‘9’, ‘C’ },
{ ‘*’, ‘0’, ‘#’, ‘D’ }
};
キーパッド(行×列)と文字の紐づけはこの指定で決まります。
キーパッドの行・列に接続したArduino入力ピンを指定
Arduinoの入出力ピンとキーパッドの行列の割り当てを指示します。
byte rowPins[ROWS] = { 9, 8, 7, 6 }; //キーパッドの行に接続した入力ピン割り当て
byte colPins[COLS] = { 5, 4, 3, 2 }; //キーパッドの列に接続した入力ピン割り当て
Keypadクラスのインスタンスを作成
keypadの初期設定を行います。
Keypad new_keypad = Keypad(makeKeymap(hexaKeys), rowPins, colPins, ROWS, COLS)
変数「new_keypad」は例であり、任意の変数文字列を指定することが可能です。
getKey()
入力されたキーが文字や記号に変換されたものを取り出します。
Keypadインスタンス名.getKey()
プログラミング初心者の方に、おすすめなArduinoの参考書を紹介しています！
ｍBlockプログラミング
ここからは、mBlockを使ったプログラムの作り方を解説します。
- デバイスにArduino Uno R3を追加する。
- 接続モードを｢アップロードモードON｣にする。
- mBlockプログラムを作成する。
- プログラムをArduino本体に転送する。
これらの基本操作方法については、こちらの記事を参照してください。
せでぃあ動画を参考にプログラミングしてみてください。
I2Cを使ったLCD制御ブロックの追加方法
LCDを制御(LCD画面クリア、カーソル位置を指定、LCDへの文字列表示など)するために必要な、専用ブロックを追加する必要があります。
mBlockを開いて、拡張ボタンをクリックします。
検索窓に｢i2c｣と入力します。
I2Cを使ったLCD制御用の拡張ブロックを追加します。
I2Cを使ったLCD制御ブロックが追加されます。
keypadブロックの追加方法
メンブレンスイッチの押されたキーを文字・記号としてプログラム内で変換するために、専用ブロックを追加します。
mBlockを開いて、拡張ボタンをクリックします。
検索窓に｢keypad｣と入力します。
表示された追加ブロックリストの中から｢Keypad Eklentisi｣という専用ブロックを追加します。
メンブレンスイッチのキーを文字・記号に変換できる専用keypadブロックが追加されます。
mBlockを使ったプログラム内容
今回は｢アップロードモード オン｣でのプログラム作成例を紹介しています。
プログラム開始条件が｢Arduino Unoが起動したとき｣になっている点に注意してください。
以下のプログラムが動作プログラムになります。
keypadブロックが英語表示でもないので分かりにくいところはありますが、本ブログ記事でのブロック機能解説を見て使用していただけば理解しやすくなると思います。
せでぃあブロックの機能さえわかれば難しくないので、落ち着いてプログラムを作ってください。
mBlockのArduino専用ブロックについては、こちらの記事にて詳しく説明しています。
動作確認方法
- LCDディスプレイのバックライトが点灯しているか？
- 押されたキーがLCDディスプレイ上段左側に表示されるか？
- 別のキーを押すとディスプレイに表示される文字が切り替わるか？
上記項目について確認していきましょう。
LCDディスプレイのバックライトが点灯しているか？
プログラムの演算が開始されたら、LCDディスプレイのバックライトが点灯していることを確認してください。
点灯しない場合はプログラム内で正しく点灯指示が出来ているか、確認してください。
LCDディスプレイの表示が無表示(画面クリア状態)であることも併せて確認してください。
押されたキーがLCDディスプレイ上段左側に表示されるか？
押されたキーはLCDディスプレイの上段かつ一番左側に表示されるか確認してください。
表示させる場所はプログラム内で指定しています。
別のキーを押すとディスプレイに表示される文字が切り替わるか？
いろいろなキーを押してみて、LCDディスプレイに表示される文字が押されたキーに切り替わるか確認してください。
メンブレンスイッチ上での特定行や列で表示が切り替わらないキーがある場合は、メンブレンスイッチとArduinoを接続する配線に問題がないか確認してみてください。
せでぃあLCDディスプレイに表示される文字は「最後に押したキーのみ」です。
メンブレンスイッチ(キーパッド)は単純で使いやすい(まとめ)
- メンブレンスイッチは行と列につながった配線で押されたキーを認識できる。
- 認識したキーはプログラム内で文字に変換して扱う。
- 変換後の文字はLCDディスプレイに表示させて使うと便利。
メンブレンスイッチは4行4列の配列として扱うことが可能な分かりやすい機器であることが理解できたと思います。
専用ライブラリや専用ブロックを使うことで、文字への変換もとっても簡単にできるのが嬉しいですね！
慣れてきたら、オリジナル表示プログラミングにもチャレンジしてみていただけたら幸いです。
応援ありがとうございます(^^)/
この記事が気に入ったら
フォローしてね！
コメント