ジョイスティックモジュール (KY-023)

（電子工作ステーション　¥185）

SWはボタンと同じなので、プルアップを使って読み取ります。

プルアップを使わない場合は、プルダウン抵抗が必要になります。

extern "C" {
  #include "oled_min.h" //Cのプログラム
}
#include "display.h"    //C++のプログラム

#define VRX A1
#define VRY A0
#define SW 2

void setup() {
  pinMode(SW, INPUT_PULLUP);  //スイッチをプルアップに
  OLED_init();
}

void loop() {
  int x = analogRead(VRX);    // よこの動きを取得（左が0 右が1023）
  int y = analogRead(VRY);    // たての動きを取得（上が0 下が1023）
  int sw = digitalRead(SW);   // スイッチを取得（OFFが0 ONが1）
  OLED_fill(0x00);            //全部まっくろにする
  drawNumber(x, 0, 0);        //xのかたむきを表示
  drawNumber(y, 0, 1);        //yのかたむきを表示
  drawNumber(sw, 0, 2);       //スイッチの状態を表示
  delay(200);
}

アナログスティックの値を使うと、画面上のキャラクターを自由に動かすことができます。

このあと、モグラたたきゲームで実際に使ってみましょう！

extern "C" {
  #include "oled_min.h" //Cのプログラム
}
#include "display.h"    //C++のプログラム

#define VRX A1
#define VRY A0
#define SW 2

const unsigned char cursor [] PROGMEM = {
   0x7e, 0xc3, 0xa5, 0x99, 0x99, 0xa5, 0xc3, 0x7e };

int cx = 50;  // カーソルのｘ
int cy = 4;   // カーソルのｙ

void drawCursor(int x, int y) {
  OLED_draw_bmp(x, y, x + 8, y + 1, cursor);  //カーソルを描画
}

void setup() {
  pinMode(SW, INPUT_PULLUP);  //スイッチをプルアップに
  OLED_init();
}

void loop() {
  int x = analogRead(VRX);
  int y = analogRead(VRY);
  int sw = digitalRead(SW);

  if (x < 300) cx -= 8; 	// yの移動量にあわせる
  if (x > 700) cx += 8;
  if (y < 300) cy--;  	// yは1段で8ピクセル動く
  if (y > 700) cy++;

  cx = constrain(cx, 0, 120); // ヨコはみだし防止
  cy = constrain(cy, 0, 7);   // タテはみだし防止

  OLED_fill(0x00);
  drawCursor(cx, cy);         // カーソル表示
  delay(50);
}

アナログスティックの値（0〜1023）をそのまま使うのではなく、
「300より小さい」「700より大きい」といった条件で動きを分けています。

これにより、スティックを倒したときだけカーソルが動くようになります。

cx と cy はカーソルの位置を表す変数です。

値を増減させることで、画面上の位置を動かしています。

constrain() を使うことで、カーソルが画面の外に出ないようにしています。

範囲を制限するときによく使う便利な関数です。

const unsigned char cursor[] PROGMEM = 
{ 0x7e, 0xc3, 0xa5, 0x99, 0x99, 0xa5, 0xc3, 0x7e };

OLEDは「縦8ピクセル単位」で描画されます。

そのため、8×8や16×16など、8の倍数サイズの画像が扱いやすいです。

好きなキャラクターやマークを表示すれば、オリジナルゲームにぐっと近づきます！

OLED_draw_bmp(開始x, 開始y, 終了x, 終了y, 画像データ);

OLED_draw_bmp(x, y, x + 8, y + 1, cursor);

横方向（x）はピクセル単位なので、8ピクセルなら「+8」になります。

縦方向（y）は「8ピクセルで1マス」として扱われるため、「+1」となります。

しくみ解説

コンピュータでは、「1バイト = 8個の0と1」でデータを表します。

OLEDでは、この1バイトが「縦8ピクセル分のデータ」として使われています。

• 1バイト → 縦8ピクセル
• それが横に並ぶ → 画像になる

そのため、画像の高さは「8の倍数」にすると扱いやすくなります。

const unsigned char mogura [] PROGMEM = {
  0x00, 0x00, 0xf0, 0xf8, 0x3c, 0x0c, 0xfc, 0xfc, 0xfc, 0x3c, 0x0c, 0xfc, 0xf8, 0xf0, 0x00, 0x00, 
  0x80, 0x40, 0xbf, 0xdf, 0x5f, 0x93, 0xd5, 0xd1, 0xd1, 0xd1, 0x93, 0x5f, 0xdf, 0xbf, 0x40, 0x80
};

int score = 0;
int mx = 40;
int my = 2;

// モグラ描画
void drawMogu(int x, int y) {
  OLED_draw_bmp(x, y, x + 16, y + 2, mogura);
}

// 当たり判定
bool isHit() {
  return (cx < mx + 16 &&
          cx + 8 > mx && 
          cy >= my &&
          cy < my + 2);
}

カーソルとモグラの位置が重なっているかをチェックしています。

このような処理を「当たり判定」といいます。

画像は左上が原点で、原点から+16の位置がモグラの右端になります。
同じように、ｙ座標は、+2マスの位置がモグラの下端になります。
このエリアにカーソルの座標があれば、カーソルが触れていると言えます。

void loop() {
  int x = analogRead(VRX);
  int y = analogRead(VRY);
  int sw = digitalRead(SW);

  if (x < 300) cx-=8; // yの移動量にあわせる
  if (x > 700) cx+=8; //

  if (y < 300) cy--;  // yは1段で8ピクセル動く
  if (y > 700) cy++;

  cx = constrain(cx, 0, 120); // ヨコはみだし防止
  cy = constrain(cy, 0, 7);   // タテはみだし防止

  OLED_fill(0x00);
  drawMogu(mx, my);
  drawCursor(cx, cy);         // カーソル表示

  uint8_t msg1[] = {K_SU, K_KO, K_A, K_SPACE}; // スコア
  printKanaList(msg1, 4, 0, 0);
  drawNumber(score, 32, 0);

  if (digitalRead(SW) == LOW) {  // 押された！
    if (isHit()) {
      score++;// ヒット！
      // モグラを別の場所へ
      mx = random(0, 112);   // 横は0〜112くらい
      my = random(1, 7);     // 縦は1〜7（ページ単位）
    }
    delay(200); // チャタリング防止
  }
  delay(50);
}

モグラの位置は random() を使ってランダムに決めています。

画面サイズ（128ピクセル）からモグラの大きさ（16ピクセル）を引いて、 はみ出さないようにしています。

アレンジしてみよう

• ブザーを追加して音を鳴らす
• 制限時間をつける
• スコア表示を工夫する

いろいろなアイデアで、自分だけのゲームにしてみましょう！

K_(ローマ字)

uint8_t msg[] = {K_SU, K_KO, K_A};
printKanaList(msg, 3, 0, 0);

カタカナは「配列」にまとめてから表示します。

配列の中に、表示したい文字を順番に並べていきます。

K_A や K_KA などは、それぞれのカタカナに対応した「番号（インデックス）」です。

printKanaList() は、その番号をもとに、対応する文字の画像を表示しています。

uint8_t msg[] = {K_SU, K_KO, K_A, K_SPACE, N_1};
printKanaList(msg, 5, 0, 0);

スコア表示や「スタート」「ゲームオーバー」など、 ゲームの文字表示にとても便利です