Display a component on CanvasFrame in JavaCV

Question

This is my program, I need to add a button on the canvas. How can this be achieved?

import java.awt.image.BufferedImage;
import java.io.ByteArrayInputStream;
import java.io.InputStream;
import javax.imageio.ImageIO;
import org.opencv.core.Core;
import org.opencv.core.Mat;
import org.opencv.core.MatOfByte;
import org.opencv.core.MatOfRect;
import org.opencv.core.Point;
import org.opencv.core.Rect;
import org.opencv.core.Scalar;
import org.opencv.highgui.Highgui;
import org.opencv.highgui.VideoCapture;
import org.opencv.objdetect.CascadeClassifier;

import com.googlecode.javacv.CanvasFrame;
import com.googlecode.javacv.cpp.opencv_core.IplImage;

public class CarDetect implements Runnable {
    IplImage image;
    static int count=0,imagecount=0;
    static int label=0;
    CanvasFrame canvas = new CanvasFrame("Detect");

    public CarDetect() {

        canvas.setDefaultCloseOperation(javax.swing.JFrame.EXIT_ON_CLOSE);
        canvas.setBounds(200,0, 640,500);
            **//canvas.add(any component such as panel,button etc)**
    }

    @Override
    public void run() {

        System.loadLibrary(Core.NATIVE_LIBRARY_NAME);
        VideoCapture camera = new VideoCapture(0);
        // 1 for next camera

        try {
            Mat frame = new Mat();
            while (true) {
                camera.read(frame);

                Mat image_tmp = frame;
                MatOfByte matOfByte = new MatOfByte();
                BufferedImage bufImage = null;
                if(image_tmp!=null)
                    Highgui.imencode(".jpg", image_tmp, matOfByte); 

                    byte[] byteArray = matOfByte.toArray();
                    try {
                        InputStream in = new ByteArrayInputStream(byteArray);
                        bufImage = ImageIO.read(in);
                    } 
                    catch (Exception e) {
                        e.printStackTrace();
                    }
                    canvas.showImage(bufImage);
                } 
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
   }


    public static void main(String[] args) {
        CarDetect gs = new CarDetect();
        Thread th = new Thread(gs);
        th.start();
    }
}

Answer 1

import com.googlecode.javacv.CanvasFrame;
import java.awt.image.BufferedImage;
import java.io.IOException;
import javax.imageio.ImageIO;
import javax.swing.JButton;
import net.miginfocom.swing.MigLayout;

public class Test {
    BufferedImage bi;
    CanvasFrame cf;
    public Test() throws IOException{
        bi = ImageIO.read(getClass().getResource("/resources/colorspec_.jpg"));
        cf = new CanvasFrame("Canvas With Button");
        cf.setLayout(new MigLayout("insets 0, gap 10", "grow", "grow"));
        cf.add(new JButton("My Button"), "w 100:100:100, h 40:40:40");
    }

    public void showWindow(){
        cf.showImage(bi);
        cf.pack();
    }

    public static void main(String[] args) throws IOException {
        Test t = new Test();
        t.showWindow();
    }
}

Here you go, a little tips: you can play much more using this MigLayout documentation to suit your requirements.. But most of the time I found its advanced usage through stackoverflow, though.. Hope this helps.. =)

screenshot when I run it:

Answer 2

Isn't the best practice to use JPanels (where you can add buttons easily) and put a computer vision canvas on one of the frames?

Here is an example from the javacv folk (jump directly to code)

Tutorial for creating a GUI application (parent of link above).