在Processing中创建单个草图的多个窗口

时间:2013-12-22 15:24:15

标签: image image-processing processing

如何在Processing中创建单个草图的多个窗口?

实际上我想在一个窗口中检测并跟踪特定颜色(通过网络摄像头)并将检测到的坐标显示为另一个窗口中的一个点。现在我可以在同一窗口中显示检测到的点它。但我想把它分成两个不同的窗口。

3 个答案:

答案 0 :(得分:9)

您需要创建一个新框架和一个新的PApplet ......这是一个示例草图:

import javax.swing.*; 
SecondApplet s;
void setup() {
  size(640, 480);
  PFrame f = new PFrame(width, height);
  frame.setTitle("first window");
  f.setTitle("second window");
  fill(0);
}
void draw() {
  background(255);
  ellipse(mouseX, mouseY, 10, 10);
  s.setGhostCursor(mouseX, mouseY);
}
public class PFrame extends JFrame {
  public PFrame(int width, int height) {
    setBounds(100, 100, width, height);
    s = new SecondApplet();
    add(s);
    s.init();
    show();
  }
}
public class SecondApplet extends PApplet {
  int ghostX, ghostY;
  public void setup() {
    background(0);
    noStroke();
  }

  public void draw() {
    background(50);
    fill(255);
    ellipse(mouseX, mouseY, 10, 10);
    fill(0);
    ellipse(ghostX, ghostY, 10, 10);
  }
  public void setGhostCursor(int ghostX, int ghostY) {
    this.ghostX = ghostX;
    this.ghostY = ghostY;
  }
}

答案 1 :(得分:3)

一个选项可能是创建两倍于原始窗口大小的草图,并将检测到的坐标偏移一半草图的大小。

这是一个非常粗略的代码片段(假设blob将是一个检测到的颜色blob):

int camWidth = 320;
int camHeight = 240;
Capture cam;

void setup(){
  size(camWidth * 2,camHeight);
  //init cam/opencv/etc.
}
void draw(){
  //update cam and get data
  image(cam,0,0);
  //draw 
  rect(camWidth+blob.x,blob.y,blob.width,blob.height);
}

说实话,覆盖跟踪信息可能更容易。例如,如果您正在进行颜色跟踪,只需显示跟踪区域的边界框的轮廓。

如果您真的想要显示另一个窗口,可以使用JPanel。 有关正在运行的代码示例,请查看this answer

答案 2 :(得分:1)

我建议使用G4P,这是一个用于处理的GUI库,它具有内置的一些功能来处理多个窗口。我之前使用过网络摄像头,但效果很好。它附带一个GWindow对象,可以轻松地生成一个窗口。网站上有一个short tutorial来解释基础知识。

我已经包含了一些旧代码,它将向您展示基本概念。代码中发生的事情是我制作两个GWindows并向它们发送每个PImage以显示:一个获取网络摄像头图像而另一个获得受影响的图像。这样做的方法是扩充GWinData对象以包含您想要传递给窗口的数据。我没有为每个窗口制作一个特定的对象,而是在其中创建了一个包含两个PImage的对象。每个GWindow都有自己的绘制循环(在示例的底部),它从重写的GWinData对象加载PImage并显示它。在主绘制循环中,我读取网络摄像头,然后处理它以创建两个图像,然后将它们存储到GWinData对象中。

希望这足以让你开始。

import guicomponents.*;
import processing.video.*;

private GWindow window;
private GWindow window2;

Capture video;

PImage sorted;
PImage imgdif; // image with pixel thresholding

MyWinData data;

void setup(){

  size(640, 480,P2D); // Change size to 320 x 240 if too slow at 640 x 480

  // Uses the default video input, see the reference if this causes an error
  video = new Capture(this, 640, 480, 24);
  numPixels = video.width * video.height;

  data = new MyWinData();

  window = new GWindow(this, "TEST", 0,0, 640,480, true, P2D);
  window.isAlwaysOnTop();
  window.addData(data);
  window.addDrawHandler(this, "Window1draw");

  window2 = new GWindow(this, "TEST", 640,0 , 640,480, true, P2D);
  window2.isAlwaysOnTop();
  window2.addData(data);
  window2.addDrawHandler(this, "Window2draw");

  loadColors("64rev.csv");
  colorlength = mycolors.length;
  distances = new float[colorlength];

  noCursor(); 
}

void draw()
{
    if (video.available()) 
    {
      background(0);
      video.read();

      image(video,0,0);
      loadPixels();

      imgdif = get(); // clones the last image drawn to the screen v1.1     
      sorted = get();
      /// Removed a lot of code here that did the processing

      // hand data to our data class to pass to other windows
      data.sortedimage = sorted;
      data.difimage = imgdif;

    }
}

class MyWinData extends GWinData {
   public PImage sortedimage; 
   public PImage difimage;

   MyWinData(){
      sortedimage = createImage(640,480,RGB); 
      difimage = createImage(640,480,RGB);
    }
}


public void Window1draw(GWinApplet a, GWinData d){
  MyWinData data = (MyWinData) d;
  a.image(data.sortedimage, 0,0);
}


public void Window2draw(GWinApplet a, GWinData d){
  MyWinData data = (MyWinData) d;
  a.image(data.difimage,0,0);
}