blog2

Processingでお手軽VR

kenichiro

ProcessingのAndroidモードにはVRやARといった機能がついています。遅ればせながら試してみました。驚くほど簡単にVRアプリが作れてしまったので、メモ代わりにアップしておきます。

  1. Androidモードにする
  2. AndroidメニューからVRを選択
  3. setupのfullScreenでSTEREOを指定

たったこれだけで、3DのコンテンツがVR対応になります。実際に実行するには、Gyroに対応したAndroidスマホが必要になります。詳しくは別の機会にご紹介しようと思います。

上の画面は、以前TinkerCADで作成した魚モデルをProcessingで泳がせましたが、それをVRに変更したものです。たった数行の変更でVR対応したのには驚きました。

import processing.vr.*;

PShape[] fishShape;
PShape riverBottom;

class Fish {
  PVector pos;
  PVector move;
  int index = (int)random(8);
  int tick = (int)random(10);
  
  Fish(float x, float y, float z, float dx, float dz){
    pos = new PVector(x, y, z);
    move = new PVector(dx, 0, dz);
  }
  
  void paint(){
    pushMatrix();
    scale(3);
    translate(pos.x, pos.y, pos.z);
    rotateY(atan2(move.x, move.z));
    shape(fishShape[index]);
    popMatrix();    
  }

  void move(){
    if (++tick % 5 == 0) {
      index = (index + 1) % 8;
    }
    pos.add(move);
    if(pos.x < -500 || pos.x > 500){
      move.x *= -1;
    }
    if(pos.z < -500 || pos.z > 500){
      move.z *= -1;
    }
  }
}

ArrayList<Fish> fish = new ArrayList<Fish>();

void setup(){
  fullScreen(STEREO);
  fill(#AD71B7);
  
  riverBottom = loadShape("riverbottom.obj");
  PShape N = loadShape("fish-N.obj");
  PShape L1 = loadShape("fish-L1.obj");
  PShape L2 = loadShape("fish-L2.obj");
  PShape R1 = loadShape("fish-R1.obj");
  PShape R2 = loadShape("fish-R2.obj");
  fishShape = new PShape[]{N, L1, L2, L1, N, R1, R2, R1};

  for(int j = 0 ; j < 5 ; j++){
    float x = random(-200, 200);
    float y = random(-200, -40);
    float z = random(-200, 200);
    float mx = random(-2, 2), mz = random(-2, 2);
    int num = (int)random(5, 10);
    for(int i = 0 ; i < num ; i++){
      float dx = random(-80, 80);
      float dy = random(-30, 30);
      float dz = random(-80, 80);
      fish.add(new Fish(x+dx, y+dy, z+dz, mx, mz));
    }  
  }  
}

void draw(){
  background(#81B771);
  translate(width/2, height/2);
  lights();
  pushMatrix();
  scale(10);
  translate(0, 100, 0);
  shape(riverBottom);
  popMatrix();
  for (Fish f : fish) {
    f.move();
    f.paint();
  }    
}
Categories: Programming