スキップしてメイン コンテンツに移動

M5StickC Plus 応用編1 <フルカラーLED>

 前回の記事ではM5StickC Plusの特徴であるLCDとスピーカー、GPIO特性などを試してみました。

今回は前回の終盤で使えるGPIOの調査をしたので、それらを使ってフルカラーLEDを光らせてみたいと思います。

次回の記事でフルカラーLEDを使った応用をしたいので内容自体は少ないですが、使い方について説明していきます。

部品

今回使った部品を載せておきます。

  1. M5StickC Plus
  2. フルカラーLED(アノードコモン)×1
  3. 抵抗(330Ω)×3
  4. ブレッドボード×1
  5. ジャンパワイヤ×3
  6. PCとM5StickC Plusをつなぐケーブル×1

今回記事に載せるフルカラーLEDは手元にあった型番のわからないものを使用しているため、データシートなど特性を確認できないのでふさわしくない値の抵抗を使用しています。

本来フルカラーLEDは各色(おおよそ赤、緑と青の2種)で適した抵抗値が違ったりします。これは各色の発光時の順方向電圧や電流量が違うため光量の違いが出てしまうためです。

今回のようにある程度全色が光って見えれば良いと言う方は特に深く考える必要はありません。

その場合の注意点は、抵抗値を低くしすぎてLEDを壊してしまうことです。保証はできませんが経験則的に最低100Ωで330Ω以上を使っておけば何とかなったりします。

回路

フルカラーLEDから出る端子の役割の順番は大体同じです。

今回はアノードコモンを使用しているので右から2番目の足が一番長い端子が電源の+側なので3.3Vピンにつなぎます。

カソードコモンの場合はGNDにつなぎますが今回は関係ないので説明は省きます。

写真のように端子をつなげていきます。

回路図

このようにつなげれば大丈夫です。

実践

#include <M5StickCPlus.h>
#include <M5StickCPlus.h>

int r_pin = 0;
int g_pin = 25;
int b_pin = 26;
double hz = 12000.0; //周波数
uint8_t bit = 8;     //分解能


void setup() {
  pinMode(r_pin, OUTPUT);
  pinMode(g_pin, OUTPUT);
  pinMode(b_pin, OUTPUT);

  ledcSetup(0, hz, bit);
  ledcSetup(1, hz, bit);
  ledcSetup(2, hz, bit);
  
  ledcAttachPin(r_pin, 0);
  ledcAttachPin(g_pin, 1);
  ledcAttachPin(b_pin, 2);

  ledcWrite(0, 256);//HIGHにしてLEDに電流が流れないようにする
  ledcWrite(1, 256);//HIGHにしてLEDに電流が流れないようにする
  ledcWrite(2, 256);//HIGHにしてLEDに電流が流れないようにする

}

void loop() {
    ledcWrite(0, (uint32_t)random(256));
    ledcWrite(1, (uint32_t)random(256));
    ledcWrite(2, (uint32_t)random(256));
    delay(500);
}

0.5秒おきにランダムな色に変化するようになっています。

今回注意すべき点はアノードコモンのフルカラーLEDを使用しているためM5StickC PlusのGPIOから出る電流で直接制御しているのではなく、3.3Vピンからくる電流を各色のGPIOがLOWの状態になったときに吸い込むことによってLEDに電流が流れて光る仕組みになっています。

つまりledcWriteの第二引数が

  • 0 = 光る
  • 256 = 光らない

このようにGPIOから出る電流で直接制御する場合と逆になります。

この点に注意してプログラムを書いてください。

これについて参考になるサイトのURLを以下に載せておきます。

thunderblog.org

ledcSetupで使用している周波数と分解能は公式のサンプルプログラムを参考に設定したため特に意図はありません。

特に詳しいわけではないので説明は省きますが、参考にしたページのURLを以下に載せておきます。

公式examplegithub.com

lang-ship.com

qiita.com

まとめ

内容は薄いですが、M5StickC PlusでアノードコモンのフルカラーLEDを使う方法を簡単に説明しました。

次回はWiFiなどと連携して光らせてみたいと思います。

次回の記事も読んで頂けると嬉しいです。

コメント

このブログの人気の投稿

Phaser3 + Typescriptを使ってRPGゲームの基礎を作ろう!その2

前回の記事 に引き続きPhaser3+Typescriptを使って RPG の基礎を作っていきます。 この記事は前回の記事を呼んだ前提で説明していきますので、ぜひそちらを先に読むことをお勧めします。 また、今回の記事は前回よりも難易度と内容量が上がっていますが、記事の最後に作業後の リポジトリ のリンクがありますので、そちらを先にダウンロードしてそちらと比較しながら学習することができます。 前回まで作成した状態のプログラムが以下の リポジトリ からダウンロードできますので前回まででうまくいっていない方は参考にしてみてください。 github.com 最終目標(再掲) ・Phaser3とTypescriptで RPG ゲームの基礎を作る。 ・Phaser3をTypescriptで使う方法を学ぶ ・Phaser3の使い方を学ぶ 今回の目標 ・ゲームの作り方の断片を知る ・キャラの表示できるようにする ・キャラを移動できるようにする ・当たり判定をつける ・ NPC の追加してみる ・話しかけられるようにする 開発前提(再掲) ・Nodejsの環境・知識がある ・ Javascript ・Typescriptがある程度かける ・当ページ紹介の環境を試す場合はgit・ github の知識がある 使用した主要Nodeモジュール(再掲) ・typescript(Typescriptの コンパイル 用) ・phaser(フロントの Javascript 用ゲームライブラリ) ・live-server(ソースを監視してブラウザのページをリロード) ・ts-loader(webpackがTypescriptをバンドルする用)webpack(言わずと知れたモジュール依存をいい感じに解決しバンドルする) ・webpack- cli (webpackを コマンドライン で使用するのに必要) 注:各Nodeモジュールバージョンは後述 当ブログ仕様の画像素材の注意点 当ブログで使用する画像素材は『 ピポヤ倉庫 』より許可なしで無償再配布・改変が認められたものを改変して作成されたものです。 中には許可なく再配布・改変してはいけない素材もインターネット上には多く存在するのでそれらを使用するときは十分に規約を呼んでから使用しましょう。 1. キャラの表示 想定画面 今回は、はじめにキャラつまり操作

M5Stackで、においセンサー(TGS2450)を使ってみる。(LCDに表示編)

今回は、においセンサー(TGS2450)から取得したデータをM5Stackの LCD にグラフ表示をしていきます。 今回主に使用したもの M5Stack 10Ω抵抗 5本 Pch  MOSFET  2SJ334(スイッチとして利用) M5StackSideBB(ブレッドボード) M5Stackのピンはそのままだと配線するとき手間がかかるかと思いますので、今回はM5StackSideBBを利用しました。 ブレッドボードも付いているので、手軽に電子工作できるので個人的にオススメです。 SideBB for M5Stack www.switch-science.com 諸注意 本ブログのプログラムはArduinoIDEまたはPlatformIOでM5Stackの開発ができる状態であること前提のものですので、各自導入をお願いします。 過去に Windows のArduinoIDEで M5Stackの開発環境を構築する記事 があるので、参考にしてください。 においセンサー(TGS2450)について 今回使用したセンサーは 秋月電子通商 で購入できます。 http://akizukidenshi.com/catalog/g/gP-00989/ akizukidenshi.com TGS2450には4つのピンがあり、使用するのはそのうちの3本でヒーターを温めるピン、センサー情報を得るピン、GNDがあります。 ここで注意したいのは、ヒーター電圧は1.6Vと記述されているのでM5Stackで利用するときは分圧して3.3Vを1.6V近くまでに降圧することをお勧めします。 TGS2450のセンサーは可変抵抗になっており、データシートには5.62kΩ〜56.2kΩの間を抵抗が変化し、においが強いとより低くなると記述されていました。 よって、センサーの値をM5Stackで取得するにはセンサー抵抗と外部に接続する任意の値の抵抗による分圧回路によって求めることができます。 TGS2450の動作方法は、250ms周期でセンサーに電圧を5ミリ秒on、245ミリ秒offの状態にしてヒーターは8ミリ秒on、242ミリ秒offにすることで値を取得します。 配線 においセンサーとM5Stackの配線 上の図が配線図です。 30Ωの抵抗は10Ωの抵抗を三つ直列に接続して作成しました。 また、上部の抵抗10Ω二

Phaser3 + Typescriptを使ってRPGゲームの基礎を作ろう!その1

今回はPhaser3とTypescriptを使って簡単な RPG ゲームを作る方法を紹介していきます。 内容はPhaser3およびゲーム作りについての記事なので、Nodejsの周辺モジュールなどの説明は一部省いての説明になりますのでご了承ください。 またこの記事では Phaser2 ではなく Phaser3 を使用するので注意してください。 この記事は二部構成になりますので、この記事を読んだ際はぜひ次の記事も読むことをお勧めします。 最終目標 ・Phaser3とTypescriptで RPG ゲームの基礎を作る。 ・Phaser3をTypescriptで使う方法を学ぶ ・Phaser3の使い方を学ぶ 今回の目標 ・開発環境を整える ・Phaser3の開発構成を知る ・スタート画面を作る ・マップ表示をさせる 開発前提 ・Nodejsの環境・知識がある ・ Javascript ・Typescriptがある程度かける ・当ページ紹介の環境を試す場合はgit・ github の知識がある 使用した主要Nodeモジュール ・typescript(Typescriptの コンパイル 用) ・phaser(フロントの Javascript 用ゲームライブラリ) ・live-server(ソースを監視してブラウザのページをリロード) ・ts-loader(webpackがTypescriptをバンドルする用)webpack(言わずと知れたモジュール依存をいい感じに解決しバンドルする) ・webpack- cli (webpackを コマンドライン で使用するのに必要) 注:各Nodeモジュールバージョンは後述 1. 最低限の開発環境の準備 今回最低限の環境を整えるために、『Typescript + Phaser3』の開発テンプレートを github リポジトリ で公開しました。 以下からZIPをダウンロードするか、 git clone コマンドで各自環境に展開してみてください。 ここから先は リポジトリ のプログラムを元に説明していきます。 github.com 展開するとファイル構造は以下のようになっているかと思われます。 注: 他にもファイルやフォルダがあるかと思われますが、表記されているのは今回使うものになっています。 - src/ (これから書くプログラムの保存領域)