Processing QRコード／2次元コード

Processingのライブラリには、「QRCode」というものがあります。QRコードとは、以下のような２次元的なマトリクスを利用したコードです。バーコードよりは情報量が多く、様々な場面に用いられています。


このブログのURL情報が含まれたQRコード（上画像:qrcode.png）

Processingの「QRCode」ライブラリを用いることで、QRコードに含まれた情報を解読することができます。逆に、任意の情報のQRコードを生成するには以下のようなサイトで行うことができます。

http://qrcode.kaywa.com
http://qr.quel.jp

「QRCode」ライブラリでは、上記サイトなどで直接生成したQRコード以外にも、Webカメラやデジタルカメラで撮影したQRコード（紙上に印刷したQRコード）を認識／解読することができます。尚、このライブラリを使うには「QRCode」ライブラリサイトからライブラリをダウンロード＋インストールする必要があります。サイトの説明によれば、以下のようなコードでQRコードを解読することができます。予めQRコードの画像を用意して、スケッチフォルダ内dataフォルダに入れておいて下さい。
以下のサンプルは、上にあるQRコード（qrcode.png）を使って解読するコードです。無事QRコードが解読されれば、link()によって、自動的にこのブログのURLへジャンプするようになっています。

//ライブラリを取り入れる
import pqrcode.*;

//インスタンス名
Decoder decoder;

void setup() {
  //オブジェクトの生成
  decoder = new Decoder(this);
  //イメージのロード
  PImage img = loadImage("qrcode.png");
  //イメージの解読
  decoder.decodeImage(img);
}

void decoderEvent(Decoder decoder) {
  //解読結果をテキストとして取り出す
  String statusMsg = decoder.getDecodedString();
  //テキストを画面に出力
  println(statusMsg);
  //テキストに書かれているURLへ移動
  link(statusMsg, "_new"); 
}

「QRCode」ライブラリのサイトには、Webカメラから撮影したQRコードを読み込んで解読するサンプルがあります。

http://www.shiffman.net/p5/pqrcode_files/Pqrcode_example.zip

このサンプルでは、「スペース」キーでカメラからのQRコードを画像として読み込み解読します。解読されたテキストは画面に文字として表示されます。「f」キーで、既に用意されているテスト用の画像を読み込んで解読します（「http://www.shiffman.net」と表示されるはずです）。「s」キーで、カメラセッティングの画面に切り替わります。
カメラでQRコードを撮影するときに、ピントがずれていると認識できないこともあるので、カメラを調整する必要があるかもしれません。

以下では、デスクトップ上あるいはその他の場所に保存してあるQRコードをファイルチューザーで選び、解読する実験をしてみます。ファイルチューザーについては、前回のブログ「Processing　FileChooser/ファイル選択画面の表示」を参照して下さい。
マウスを押したら、ファイルチューザーのダイアログ画面が現れ、任意のQRコードを選択し、解読結果をProcessingのコンソールに表示します。

//JavaのSwingを取り込む
import javax.swing.*;

import pqrcode.*;

//解読用インスタンスを用意
Decoder decoder;

//画像インスタンスを用意 
PImage pimage;

//選択ファイル名を用意し
//ファイル名を空にしておく
String getFile = null;

void setup(){
  //とりあえず表示画面を400角に設定 
  size(400,400);
  //解読用オブジェクトの生成
  decoder = new Decoder(this);
  //背景（黒）
  background(0);
}

void draw(){
  //選択ファイル名が空でないとき
  if(getFile != null){
    //ファイルを取り込む
    fileLoader(); 
  } 
}

//マウスを押したら
void mousePressed(){
  //選択ファイル取得処理 
  getFile = getFileName(); 
}

//ファイルを取り込むファンクション 
void fileLoader(){
  //選択ファイル名のドット以降の文字列を取得
  String ext = getFile.substring(getFile.lastIndexOf('.') + 1);
  //その文字列を小文字にする
  ext.toLowerCase();
  //文字列末尾がjpg,png,gif,tgaのいずれかであれば 
  if(ext.equals("jpg") || ext.equals("png") ||  ext.equals("gif") || ext.equals("tga")){
    //選択ファイル名のイメージを取り込む
    pimage = loadImage(getFile);
    //背景（黒）
    background(0);
    //イメージ表示 
    image(pimage, 0, 0, pimage.width, pimage.height);
    //イメージの解読
    decoder.decodeImage(pimage);
  }
  //選択ファイルパスを空に戻す
  getFile = null; 
}

//ファイル選択画面、選択ファイル名取得の処理 
String getFileName(){
  //処理タイミングの設定 
  SwingUtilities.invokeLater(new Runnable() { 
    public void run() {
 try {
   //ファイル選択画面表示 
   JFileChooser fc = new JFileChooser(); 
   int returnVal = fc.showOpenDialog(null);
   //「開く」ボタンが押された場合
   if (returnVal == JFileChooser.APPROVE_OPTION) {
     //選択ファイル取得 
     File file = fc.getSelectedFile();
     //選択ファイルのパス取得 
     getFile = file.getPath(); 
   } 
 }
 //上記以外の場合 
 catch (Exception e) {
   //エラー出力 
   e.printStackTrace(); 
 } 
    } 
  } 
  );
  //選択ファイルパス取得
  return getFile; 
}

void decoderEvent(Decoder decoder) {
  //解読結果をテキストとして取り出す
  String statusMsg = decoder.getDecodedString();
  //テキストを画面に出力
  println(statusMsg);
}

以下は、授業内で実験した内容です。
数値の情報（100など）を含んだQRコードを生成し、プログラムによって解読された文字列としての数値を整数型の数値に変換します。その数値をArduinoへシリアル通信で送信し、analogWrite()でLEDの輝度やモータの速度あるいはサーボの回転角度などに反映させる内容です。いくつかのQRコードを作成し、ファイルチューザーで選択したQRコードを入れ替わりで送ります。

//シリアル通信ライブラリを取り込む
import processing.serial.*;
//シリアル通信インスタンス
Serial port;

//JavaのSwingを取り込む
import javax.swing.*;
import pqrcode.*;
//解読用インスタンスを用意
Decoder decoder;
//画像インスタンスを用意 
PImage pimage;
String getFile = null;

void setup(){
  //とりあえず表示画面を400角に設定 
  size(400,400);
  //解読用オブジェクトの生成
  decoder = new Decoder(this);
  background(0);
  
  //シリアルポートの設定  
  port = new Serial(this, "/dev/tty.usbserial-A4001Kjl", 9600);
}

void draw(){
  //選択ファイル名が空でないとき
  if(getFile != null){
    //ファイルを取り込む
    fileLoader(); 
  } 
}

void mousePressed(){
  getFile = getFileName(); 
}

void fileLoader(){
  //選択ファイル名のドット以降の文字列を取得
  String ext = getFile.substring(getFile.lastIndexOf('.') + 1);
  //その文字列を小文字にする
  ext.toLowerCase();
  //文字列末尾がjpg,png,gif,tgaのいずれかであれば 
  if(ext.equals("jpg") || ext.equals("png") ||  ext.equals("gif") || ext.equals("tga")){
    //選択ファイル名のイメージを取り込む
    pimage = loadImage(getFile);
    //背景（黒）
    background(0);
    //イメージ表示 
    image(pimage, 0, 0, pimage.width, pimage.height);
    //イメージの解読
    decoder.decodeImage(pimage);
  }
  //選択ファイルパスを空に戻す
  getFile = null; 
}

//ファイル選択画面、選択ファイル名取得の処理 
String getFileName(){
  //処理タイミングの設定 
  SwingUtilities.invokeLater(new Runnable() { 
    public void run() {
 try {
   //ファイル選択画面表示 
   JFileChooser fc = new JFileChooser(); 
   int returnVal = fc.showOpenDialog(null);
   //「開く」ボタンが押された場合
   if (returnVal == JFileChooser.APPROVE_OPTION) {
     //選択ファイル取得 
     File file = fc.getSelectedFile();
     //選択ファイルのパス取得 
     getFile = file.getPath(); 
   } 
 }
 //上記以外の場合 
 catch (Exception e) {
   //エラー出力 
   e.printStackTrace(); 
 } 
    } 
  } 
  );
  //選択ファイルパス取得
  return getFile; 
}

void decoderEvent(Decoder decoder) {
  //解読結果をテキストとして取り出す
  String statusMsg = decoder.getDecodedString();
  //テキストを画面に出力
  println(statusMsg);
  
  //解読した文字列を整数値に変換
  int val=int(statusMsg);
  //シリアル通信で送信
  port.write(val);
}

Arduino側は、11番ピン（PWMピン）にLEDを接続し、輝度が変化する内容であれば以下のようになります。

int val;

void setup(){
  //シリアル通信開始
  Serial.begin(9600);
}

void loop(){
  //受信データがひとつ届いたら
  if(Serial.available()>0){
    //受信データ読み込み
    val=Serial.read();
  }
  //11番ピンをアナログ出力する
  analogWrite(11,val);
}

QRコードで、「100,20,35,180」のように、幾つかの数値をコンマ（デリミタ）で区切り連続した数値の文字列を作成し、解読した結果として送信すれば、複数の数値データをArduinoへ送信することもできます。
この場合、Processingのプログラムの最後の部分にあるvoid decoderEvent(){...}の部分を以下のようにします。

void decoderEvent(Decoder decoder) {
  String statusMsg = decoder.getDecodedString();
  int[] data=int(split(statusMsg,',');
  for(int i=0;i<data.length;i++){
    port.write(val);
  }
}

解読される文字列は

statusMsg = "100,20,35,180"

なので、
この文字列statusMsgをsplit()に代入し「,」コンマを区切り記号として複数の文字列を含んだ配列に変換します。同時にその文字列群をint()で括ることで、文字列データを整数値データに変換し、

data = {100,20,35,180}

という整数値の配列になります。data.lengthによって配列dataに何個のデータが含まれているか確認し（この場合４個、data[0]からdata[3]まで）、for()文でデータ数の分だけport.write()で繰り返しシリアル通信で送信します（４回分送信）。Arduino側で、順番にこれらの数値を受け取ることで、LEDの輝度調整のプログラムであれば、連続した値をもとに変化する輝度調整が可能になります。

応用的な使い方として、LEDの点灯やサーボの回転角度などの連続する動きのデータをQRコードで幾つか作成しておき、Webカメラを通して解読させる度に異なる動作をさせたり、マトリクスLEDなどに文字や模様として表示させたりできます。