カワリモノ息子の技術メモ的な~

カワリモノ息子とその母の技術メモ的な〜

学校が苦手な息子くんの作品とその母の作品、はたまた日常などいろいろを在宅エンジニア母が綴る

中1息子くんと小4理科の学校教材をラジコンに改造して遊んだ

小4理科の学校教材「電気と光」

家の片づけをしていたら小学校4年の理科教材が出てきました。
「ダイワ 電気と光 F型」って書いてます。

おお!楽しそう!
ってかこれM5StickCでラジコンにできるんじゃー!?

しかし私はプログラムは書きますが電気とか配線とか本当にトンチンカンなのです。
お勉強しようとしているのですが全然頭に入ってこない・・・歳のせい?歳のせいにするなって?

息子くんに、「これラジコンにできるとおもう?」って聞いてみたら、

  • M5StickC
  • リレーモジュール

があれば大丈夫とのこと。お母さん、やってみる!

くみたて

上のTwitterの画像の右上の黄色いスイッチはキット付属のもので、今回使いません。
これをM5StickCとリレーモジュールを接続したものに置き換えます。

f:id:toriko0413:20200422092824j:plain
上:リレーモジュール
下:M5StickC

息子くんご指導で、こういうつなぎかたをすればいいと教えてもらいました ↓

f:id:toriko0413:20200422093305j:plain

「なるほどいけそう!」と思って格闘すること数分、あまりの理解力の悪さにしびれをきらした息子くんが結局接続しました・・・orz

f:id:toriko0413:20200422100054j:plain

接続する端子がちょうど同じ並びに並んでたので(たぶんそういう想定で作られてあるんでしょうね)、そのままぶっ刺すことができました。
↑ 上の画像のなかの緑色で囲った部分に刺しています。

表から見た感じ
f:id:toriko0413:20200422100517j:plain

ここでは画像を撮るために甘く刺してますが、これをぎゅーっと奥まできれいに差し込みます。
また、上の表向き画像の緑色の部分が車両に接続されます(もともとキットではスイッチだった部分につながる)

f:id:toriko0413:20200422101054j:plain

ボタン操作で走らせてみる

ここまでくれば私のもの!
まずはリモコンではなく、M5StickCのボタンを押して走るように作ってみます。

G26からの信号をON/OFFするプログラムを作ったらいいです。
あれっ、なんか作ったことある気がしてきました。

このとき↓の、ブレッドボードで圧電ブザーを鳴らしたときのUIFlowでつくったブロックプログラミング!
siroitori.hatenablog.com

これを流用して作ったのがこちら。
Aボタン(M5StickCの表面のボタン)を押すと、3回進んでは止まりを繰り返すようにしました。

f:id:toriko0413:20200422110106p:plain

あとは、M5StickCとリレーモジュールを車体のどこにのせるか。

車体にのせたかったのですが、配線むき出しの部分が多いのでショートの可能性あり。
ひきずって動かそうとしましたが、リレーモジュールの裏面が床に接しているだけでショートの可能性あるそうです。

結局・・・息子くん発案、ティッシュにのせていざ出発!

でもちゃんと動きました♪

あ、お掃除ロボになりそう!?
Twitterでも同じコメントをいただきました^^
お掃除ロボをきわめるのもいいかも~!!

ともかくそのネタは置いとくことにして。

今回はラジコンにする目的だったので、次はリモートで動かすプログラミングです!
腕が鳴るぜ~
とおもってたら、息子くんが「続きはぼくにやらせて!」って言って横取りされてしまいました・・・

車体を工夫してみる

というわけで、私はプログラミングではなく車体を考える係になりました。

家にあるレゴで、M5StickCとリレーモジュールをのせられる後続の連結車両作ってみました!

f:id:toriko0413:20200422113214j:plain
f:id:toriko0413:20200422113440j:plain

左側にひっかける部分をつくっていて、ここを車体のおしりの部分にひっかけます。ちょうどいいひっかけサイズ!

連結車両で車になったのでティッシュのときのようにOFF時に止まらず惰性で動いてしまいますがそれも良し。

リモート操作プログラミング

息子くん担当のリモート操作プログラミングです。

やりかたをどうしようかな~とつぶやいていましたが、
M5StickCをWEBサーバにして、外部からはそこから発行されるWEBサイトにアクセスして操作する仕組みにしたそうです。

そんなことできるんや!たまげた!

UIFlowのプログラミングはやめて、Arduinoで書いてました。

#include <M5StickC.h>
#include <WiFi.h>
#include <WiFiClient.h>
#include <WiFiAP.h>
#include "time.h"
 
const char *ssid = "M5StickCtrl";
const char *password = "";

bool CurrentValue = false;
 
WiFiServer server(80);
 
RTC_TimeTypeDef RTC_TimeStruct;
RTC_DateTypeDef RTC_DateStruct;
 
int lastDrawTime = 0;
 
void setup() {
  M5.begin();
  M5.Lcd.setRotation(3);
  M5.Lcd.fillScreen(BLACK);
 
  M5.Lcd.setTextSize(1);
  M5.Lcd.setCursor(0, 10);

  pinMode(26,OUTPUT);
 
  Serial.println("Configuring access point...");
 
  WiFi.softAP(ssid, password);
  IPAddress myIP = WiFi.softAPIP();
  Serial.print("AP IP address: ");
  Serial.println(myIP);
  server.begin();
 
  M5.Lcd.println("Connect:");
  M5.Lcd.println(ssid);
  M5.Lcd.println("Enter:");
  M5.Lcd.println(myIP);
  delay(1000);
  M5.Lcd.qrcode(myIP.toString(),
    80, 0, 80, 15);
}
 
void loop() {
  WiFiClient client = server.available();
 
  if (client) {
    Serial.println("Client Connected.");
    String currentLine = "";
    
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        if (c == '\n') {
          if (currentLine.length() == 0) {
            client.println("HTTP/1.1 200 OK");
            client.println("Content-type:text/html; charset=utf-8;");
            client.println();
  
            client.println("<!DOCTYPE HTML>");
            client.println("<html>");
            client.println("<head>");
            client.println("<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" />");
            client.println("</head>");
  
            client.println("<body>");
            client.println("<form method=\"get\">");
  
            client.println(String("<input name=\"control\" type=\"text\" value=\"") + (String(!CurrentValue ? "On" : "Off")) + (String("\" style=\"display:none;\" \\>")));
  
            client.println(String("<button type=\"submit\">Turn ") + String(!CurrentValue ? "On" : "Off") + String("</button>"));
  
            client.println("</form>");
            client.println("</body>");
            client.println("</html>");
  
            Serial.println("html Rendering");
  
            break;
          } else if (currentLine.indexOf("GET /?") == 0) {
            int pos1 = 0;
            int pos2 = 0;
            String val = "";

            pos1 = currentLine.indexOf('control=', pos2);
            pos2 = currentLine.indexOf(' ', pos1);
            val = currentLine.substring(pos1 + 1, pos2);
            if (val == "On") {
              CurrentValue = true;
            } else {
              CurrentValue = false;
            }

            if (CurrentValue) {
              digitalWrite(26,HIGH);
            } else {
              digitalWrite(26,LOW);
            }

            client.println("HTTP/1.1 302 Request Succsessful");
            client.println("Location: /");
            client.println();
            client.println("Request was succsessful. redirect to <a href=\"/\"> here. </a>");
          } else {
            currentLine = "";
          }
        } else if (c != '\r') {
          currentLine += c;
        }
      }
    }
 
    client.stop();
    Serial.println("Client Disconnected.");
  }
}

Twitterでもお世話になっている、@tnkmasayuki さんのサイト(https://lang-ship.com/blog/)がいつも検索でヒットしてお世話になっています。
今回の息子くんのコーディングも上記サイトを参考にさせてもらったと言っていました。ありがとうございました。

リモコンで動かす

上のプログラムをM5StickCに書き込んで起動すると、QRコードが表示されます。
そこから読み取れるサイトがM5StickC自身のURLになります。

おっとその前に。
リモコン操作したい端末(スマホ/PC)から、WiFiの設定で「M5StickCtrl」というSSIDが登場しているはずなのでここにつなぎます。そのとき、4G回線とかに接続しているスマホとかならそれもいったんオフにしておいた方が良いみたいです。

f:id:toriko0413:20200422124650p:plain

そしてさきほどのQRコードを読みこみます。
がしかーし、私のスマホではQRコードが小さすぎて読み取れなかった・・。
↓ 読み取ろうとしたときこうなった。私のスマホ私と同じくらい老眼です^^;;;

f:id:toriko0413:20200422123757p:plain

どこぞのサイトの情報によると、M5StickCのディスプレイサイズ小さいので、性能的にiPhoneのカメラじゃないと読み取れないと書かれてあったそうです。

なので、仕方なく手でブラウザにIPアドレスをURLとして入力します。
IPアドレスQRコードの隣にものすごく小さい字で表示されています。
「192.168.4.1」とかです。

f:id:toriko0413:20200422125538p:plain

すると、「Turn On」ボタンが表示されるので、これをポチると発車!!
そのあと「Turn Off」ボタンに表示が切り替わり、これをポチると停車!!
となります。

↓ PCからボタン操作して走らせました


さいごに

ラジコン化成功です!!

この車は「進む」と「止まる」しかできないからラジコンとしてはいまいちですけどね。
でもここまでできて大満足です。

次は小5理科教材のこれ ↓ が出てきたので息子くんが今遊んでいます。何かおもしろいことできるかな!?

f:id:toriko0413:20200422131259j:plain