I'm trying to do some image analysis in Processing on an IP camera source. I can deal with images from my webcam using loadPixels(), but the IPCamera library balks (even though it extends PImage which supports loadPixels()).
Here are two versions (one is commented). The second works; the first doesn't. (Note the difference between Available and isAvailable.)
Is there something I am overlooking?
Thx.
//import ipcapture.*;
//IPCapture cam;
//void setup() {
//size(640, 480);
//cam = new IPCapture(this, "http://24.231.77.130:88/videostream.cgi?user=admin&pwd=", "", "");
//cam.start();
//}
//void draw() {
//if (cam.isAvailable()) {
// cam.read();
//}
//cam.loadPixels();
//image(cam, 0, 0);
//}
//-----------------
import processing.video.*;
Capture cam;
void setup() {
size(640, 480);
cam = new Capture(this, width, height, 30);
cam.start();
}
void draw() {
if (cam.available()) {
cam.read();
}
cam.loadPixels();
image(cam, 0, 0);
}
Related
I was remaking a platformer after I closed it without saving my code and came across the error. I don't know how the error occurred and am completely lost.
Here's the code below(sorry for any incomplete code):
PImage saw = loadImage("saw.png");
game run = new game();
void setup(){
size(1000, 1000);
}
void draw(){
run.saw(100, 100);
}
class game{
boolean dead;
int ballX;
int ballY;
int sawRotate;
game(){
dead = false;
ballX = 100;
ballY = 50;
sawRotate = 1;
}
void ball(){
}
void saw(int x, int y){
pushMatrix();
rotate(sawRotate);
translate(x, y);
image(saw, 100, -100, 500, 500);
popMatrix();
}
void platform(){
}
}
You can't use Processing functions until after the setup() function has been called. This line happens before that:
PImage saw = loadImage("saw.png");
You need to move the call to loadImage() to be inside the setup() function:
PImage saw;
void setup(){
size(1000, 1000);
saw = loadImage("saw.png");
}
Context: Processing v3; Windows 10
I have an 853x2048 pixel image that I want to display fullsize on the screen. A large part of it will disappear off the bottom. I want to use Processing to navigate around inside the image, motion-path like, pause at certain points and also zoom in and out.
The code below is adapted from a demo of the Robot class as I thought that would be the go for moving around inside the image.
This code works but I can't as yet figure out how to move the viewport. And then there's the issue of zooming (which I am yet to address.)
How does one move the mouse so that the image moves or how does one move the image with respect to the viewport?
//
// how to use java.awt.Robot class in processing ...
//
import java.awt.*;
import java.awt.event.*;
Robot robot;
PFont pfont;
Point save_p;
PImage img;
void setup() {
try {
robot = new Robot();
robot.setAutoDelay(0);
}
catch (Exception e) {
e.printStackTrace();
}
surface.setResizable(true);
fullScreen();
img = loadImage("bigpic.jpg");
pfont = createFont("Impact", 32);
}
void draw() {
background(#ffffff);
fill(#000000);
imageMode(CORNERS);
image(img, 0, 0, 640*3, 480*8);
Point p = getGlobalMouseLocation();
textFont(pfont);
text("now x=" + (int)p.getX() + ", y=" + (int)p.getY(), 10, 32);
if (save_p != null) {
text("save x=" + (int)save_p.getX() + ", y=" + (int)save_p.getY(), 10, 64);
}
}
void keyPressed() {
switch(key) {
case 's':
save_p = getGlobalMouseLocation();
break;
case 'm':
if (save_p != null) {
mouseMove((int)save_p.getX(), (int)save_p.getY());
}
break;
case 'c':
break;
case 't':
translate(2000, 0);
break;
case ' ':
if (save_p != null) {
mouseMoveAndClick((int)save_p.getX(), (int)save_p.getY());
}
break;
}
}
Point getGlobalMouseLocation() {
// java.awt.MouseInfo
PointerInfo pointerInfo = MouseInfo.getPointerInfo();
Point p = pointerInfo.getLocation();
return p;
}
void mouseMove(int x, int y) {
robot.mouseMove(x, y);
}
void mouseMoveAndClick(int x, int y) {
robot.mouseMove(x, y);
robot.mousePress(InputEvent.BUTTON1_DOWN_MASK);
robot.mouseRelease(InputEvent.BUTTON1_DOWN_MASK);
robot.waitForIdle();
}
I'm a little confused by what you're doing with the Robot class.
But in any case, basically what you want to do is draw the image so its Y value is lower, which will cause the image to rise so you can see more of it. Here's a small example:
PImage img;
float imageY = 0;
void setup() {
img = loadImage("bigpic.jpg");
}
void draw() {
image(img, 0, imageY);
imageY--;
}
You can do something similar with resizing, just by passing in more parameters to the image() function.
But it sounds like what you're really looking for are the transformation functions. See the transform section of the Processing reference for more info, but basically you would call the translate() function to move the origin. You could also call the scale() function to "zoom" in and out.
Here's a little example that moves around a rectangle instead of an image:
void setup(){
size(500, 500);
}
void draw(){
background(64);
translate(-mouseX, -mouseY);
rect(0, 0, width, height);
}
Don't forget that Processing comes with a ton of examples. In the Processing editor, go to File > Examples.
Can you name a primitive shape such as rect() in some way, so you can then later change its properties ?
Or some other way to achieve my goal?
http://processing.org/reference/rect_.html
You can use PShape, and there is pretty good tutorial here. I created some simple demonstration how to use it:
PShape rectangle;
void setup() {
size(640, 360, P2D);
rectangle = createShape(RECT, 0, 0, 100, 50);
rectangle.setStroke(color(255));
rectangle.setStrokeWeight(4);
rectangle.setFill(color(127));
}
void draw() {
background(51);
translate(mouseX, mouseY);
shape(rectangle);
}
void keyPressed() {
if (key == CODED) {
if (keyCode == UP) {
rectangle.scale(1.1);
}
else if (keyCode == DOWN) {
rectangle.scale(0.9);
}
}
}
I'm looking to make an external image cursor to track the fiducial codes in tuio for my graffiti wall. Since I need background to not be run constantly in void draw(), the image cursor leaves a trail of the image around the stage. Anyone know how I can stop it from doing this without placing background in void draw()?
This is my code;
// background(255);
textFont(font, 18*scale_factor);
float obj_size = object_size*scale_factor;
float cur_size = cursor_size*scale_factor;
Vector tuioObjectList = tuioClient.getTuioObjects();
for (int i=0;i<tuioObjectList.size();i++) {
TuioObject tobj = (TuioObject)tuioObjectList.elementAt(i);
stroke(0);
fill(0);
//pushMatrix();
//translate(tobj.getScreenX(width),tobj.getScreenY(height));
//rotate(tobj.getAngle());
image(spray,10,10);
//rect(-obj_size/2,-obj_size/2,obj_size,obj_size);
// popMatrix();
if (mp == true)
{
if (tobj.getSymbolID()==66) {
fill(#FF00FF);
noStroke();
tint(255,127);
ellipse(tobj.getScreenX(width), tobj.getScreenY(height), 50, 50);
fill(#FF00FF);
text(""+tobj.getSymbolID(), tobj.getScreenX(width), tobj.getScreenY(height));
}
if (tobj.getSymbolID()==23) {
fill(#0000FF);
noStroke();
tint(255,127);
ellipse(tobj.getScreenX(width), tobj.getScreenY(height), 50, 50);
fill(#0000FF);
text(""+tobj.getSymbolID(), tobj.getScreenX(width), tobj.getScreenY(height));
}
if (tobj.getSymbolID()==22) {
fill(#00FF00);
noStroke();
tint(255,127);
ellipse(tobj.getScreenX(width), tobj.getScreenY(height), 50, 50);
fill(#00FF00);
text(""+tobj.getSymbolID(), tobj.getScreenX(width), tobj.getScreenY(height));
}
}
}
Vector tuioCursorList = tuioClient.getTuioCursors();
for (int i=0;i<tuioCursorList.size();i++) {
TuioCursor tcur = (TuioCursor)tuioCursorList.elementAt(i);
Vector pointList = tcur.getPath();
if (pointList.size()>0) {
stroke(0, 0, 255);
TuioPoint start_point = (TuioPoint)pointList.firstElement();
;
for (int j=0;j<pointList.size();j++) {
TuioPoint end_point = (TuioPoint)pointList.elementAt(j);
line(start_point.getScreenX(width), start_point.getScreenY(height), end_point.getScreenX(width), end_point.getScreenY(height));
start_point = end_point;
}
stroke(192, 192, 192);
fill(192, 192, 192);
ellipse( tcur.getScreenX(width), tcur.getScreenY(height), cur_size, cur_size);
fill(0);
text(""+ tcur.getCursorID(), tcur.getScreenX(width)-5, tcur.getScreenY(height)+5);
}
}
}
void mousePressed () {
bDrawFullSize = true;
mp = true;
player.play();
if (mouseX > x && mouseX < x+w && mouseY > y && mouseY < y+h) {
button = !button;
}
}
/*if(mousePressed) {
if(mouseX>x && mouseX <x+w && mouseY>y && mouseY <y+h){
image(stencil1,200,100,FULL_SIZE, FULL_SIZE);
}
else
{
if(mouseX>x && mouseX <x+w && mouseY>y && mouseY <y+h){
image(stencil2,200,100,FULL_SIZE, FULL_SIZE);
}
}
}
}*/
void mouseReleased() {
mp = false;
player.close();
//since close closes the file, we need to load the sound effect again.
player = minim.loadFile("spray_close.wav");
}
void mouseDragged() {
drag = true;
}
// these callback methods are called whenever a TUIO event occurs
// called when an object is added to the scene
void addTuioObject(TuioObject tobj) {
println("add object "+tobj.getSymbolID()+" ("+tobj.getSessionID()+") "+tobj.getX()+" "+tobj.getY()+" "+tobj.getAngle());
}
// called when an object is removed from the scene
void removeTuioObject(TuioObject tobj) {
println("remove object "+tobj.getSymbolID()+" ("+tobj.getSessionID()+")");
}
// called when an object is moved
void updateTuioObject (TuioObject tobj) {
println("update object "+tobj.getSymbolID()+" ("+tobj.getSessionID()+") "+tobj.getX()+" "+tobj.getY()+" "+tobj.getAngle()
+" "+tobj.getMotionSpeed()+" "+tobj.getRotationSpeed()+" "+tobj.getMotionAccel()+" "+tobj.getRotationAccel());
}
// called when a cursor is added to the scene
void addTuioCursor(TuioCursor tcur) {
println("add cursor "+tcur.getCursorID()+" ("+tcur.getSessionID()+ ") " +tcur.getX()+" "+tcur.getY());
}
// called when a cursor is moved
void updateTuioCursor (TuioCursor tcur) {
println("update cursor "+tcur.getCursorID()+" ("+tcur.getSessionID()+ ") " +tcur.getX()+" "+tcur.getY()
+" "+tcur.getMotionSpeed()+" "+tcur.getMotionAccel());
}
// called when a cursor is removed from the scene
void removeTuioCursor(TuioCursor tcur) {
println("remove cursor "+tcur.getCursorID()+" ("+tcur.getSessionID()+")");
}
// called after each message bundle
// representing the end of an image frame
void refresh(TuioTime bundleTime) {
redraw();
}
void keyPressed() {
endRecord();
background(bg1);
bDrawFullSize = false;
button = false;
}
Maybe using layers, draw your cursor and/or the other stuff in different layers. Erase one layer and not other as you need, display all them in draw. This is usually done with PGraphics objects. Search processing + layers to see samples. Here and/or in processing forum
something like this:
EDIT: Actually I think that the way to do it is to move all non refreshing draw to a PGraphics and do refresh draw with background(), where you can draw refreshing stuff without a trail. I changed the code to reflect that.
PGraphics l1;
void setup() {
size(200, 200);
l1 = createGraphics(200, 200, JAVA2D);
background(255);
noStroke();
}
void draw() {
background(255);
l1.beginDraw();
l1.fill(255, 0, 255);
l1.noStroke();
if (frameCount%100 == 0) {
l1.rect(random(width), random(height), 20, 20);
}
l1.endDraw();
image(l1, 0, 0);
fill(230);
ellipse(mouseX, mouseY, 30, 30);
}
Hi all thanks to read my answer hope you can help me
I am working on Image cropping in blackberry. In my application contain 3 main things.
1)Load the image on the screen
2)select the shape of the cropping area
3)display that cropping image on next screen with out losing its shape
Step1: i can done the image loading part
step2: using Menu i just add the 4 types of shapes
1)Circle
2)Rectangle with rounded shape
3)Star
4)Cloud
using menu when he click on any menu item ,then that particular shape image will display on the screen.
we can give the movement to that image because we have to provide him to select any portion of the image.
step3: After fix the position then we will allow the user to crop using menu.
when he click on menu item " CROP". then we have to crop the image according the shape and that image should display on the next screen
Note: Following code working only for Rectangular shape but i want to
use all shapes
This is my sample code ::
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.Manager;
import net.rim.device.api.ui.MenuItem;
import net.rim.device.api.ui.Screen;
import net.rim.device.api.ui.UiApplication;
import net.rim.device.api.ui.XYEdges;
import net.rim.device.api.ui.XYRect;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.component.Dialog;
import net.rim.device.api.ui.component.Menu;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;
import net.rim.device.api.ui.decor.BackgroundFactory;
public class ClipMove extends MainScreen{
Bitmap circle_frame,rectangle_frame,star_frame,cloud_frame,image,selected_frame;
BitmapField frmae_field;
private int padding_x=0,padding_y=0;
private VerticalFieldManager vrt_mgr;
public ClipMove() {
//Here my shape images are transparent
circle_frame=Bitmap.getBitmapResource("circle.gif");
rectangle_frame=Bitmap.getBitmapResource("rect1.png");
star_frame=Bitmap.getBitmapResource("star.gif");
cloud_frame=Bitmap.getBitmapResource("cloud.gif");
//this is my actual image to crop
image=Bitmap.getBitmapResource("sample.jpg");
vrt_mgr=new VerticalFieldManager(){
protected void sublayout(int maxWidth, int maxHeight) {
super.sublayout(Display.getWidth(),Display.getHeight());
setExtent(Display.getWidth(),Display.getHeight());
}
};
vrt_mgr.setBackground(BackgroundFactory.createBitmapBackground(image));
add(vrt_mgr);
}
protected void makeMenu(Menu menu, int instance) {
super.makeMenu(menu, instance);
menu.add(new MenuItem("Rect",0,0) {
public void run() {
// TODO Auto-generated method stub
vrt_mgr.deleteAll();
selected_frame=rectangle_frame;
frmae_field=new BitmapField(rectangle_frame);
vrt_mgr.add(frmae_field);
vrt_mgr.invalidate();
}
});
menu.add(new MenuItem("Circle",0,0) {
public void run() {
// TODO Auto-generated method stub
vrt_mgr.deleteAll();
selected_frame=circle_frame;
frmae_field=new BitmapField(circle_frame);
vrt_mgr.add(frmae_field);
vrt_mgr.invalidate();
}
});
menu.add(new MenuItem("Star",0,0) {
public void run() {
// TODO Auto-generated method stub
vrt_mgr.deleteAll();
selected_frame=star_frame;
frmae_field=new BitmapField(star_frame);
vrt_mgr.add(frmae_field);
vrt_mgr.invalidate();
}
});
menu.add(new MenuItem("Cloud",0,0) {
public void run() {
// TODO Auto-generated method stub
vrt_mgr.deleteAll();
selected_frame=cloud_frame;
frmae_field=new BitmapField(cloud_frame);
vrt_mgr.add(frmae_field);
vrt_mgr.invalidate();
}
});
menu.add(new MenuItem("Crop",0,0) {
public void run() {
// TODO Auto-generated method stub
Field f=vrt_mgr.getField(0);
// XYRect rect=getFieldExtent(f);
XYRect rect=new XYRect(padding_x, padding_y,frmae_field.getBitmapWidth(),frmae_field.getBitmapHeight());
Bitmap crop = cropImage(image, rect.x, rect.y,
rect.width, rect.height);
synchronized (UiApplication.getEventLock()) {
UiApplication.getUiApplication().pushScreen(new sampleScreen(crop,selected_frame));
}
}
});
}
protected boolean navigationMovement(int dx, int dy, int status, int time) {
if(frmae_field!=null){
padding_x=padding_x+dx;
padding_y=padding_y+dy;
XYEdges edge=new XYEdges(padding_y, 0, 0, padding_x);
frmae_field.setPadding(edge);
vrt_mgr.invalidate();
return true;
}else {
return false;
}
}
public void DisplayMessage(final String str)
{
UiApplication.getUiApplication().invokeLater(new Runnable() {
public void run() {
Dialog.inform(str);
}
});
}
public XYRect getFieldExtent(Field fld) {
int cy = fld.getContentTop();
int cx = fld.getContentLeft();
Manager m = fld.getManager();
while (m != null) {
cy += m.getContentTop() - m.getVerticalScroll();
cx += m.getContentLeft() - m.getHorizontalScroll();
if (m instanceof Screen)
break;
m = m.getManager();
}
return new XYRect(cx, cy, fld.getContentWidth(), fld.getContentHeight());
}
// this logic only useful for rectangler shape
public Bitmap cropImage(Bitmap image, int x, int y, int width,int height) {
Bitmap result = new Bitmap(width, height);
Graphics g = Graphics.create(result);
g.drawBitmap(0, 0, width, height, image, x, y);
return result;
}
}
//this is my next screen to show the croped image
class sampleScreen extends MainScreen
{
VerticalFieldManager manager;
public sampleScreen(final Bitmap img,final Bitmap back) {
manager=new VerticalFieldManager(){
protected void paint(Graphics graphics) {
graphics.drawBitmap(0, 0, img.getWidth(), img.getHeight(), img, 0, 0);
super.paint(graphics);
}
protected void sublayout(int maxWidth, int maxHeight) {
super.sublayout( img.getWidth(), img.getHeight());
setExtent( img.getWidth(), img.getHeight());
}
};
BitmapField field=new BitmapField(back);
field.setPadding(0, 0, 0, 0);
manager.add(field);
add(manager);
}
}
My screen shots:
By using another dummy image, it is possible to determine which pixels of the original image needs to be deleted (we can make them transparent). Though It may not be the optimal solution, but it can be applied for any geometric figure we can draw on BlackBerry.
Check following steps:
Create a new Bitmap image (dummyImage) of same dimension as the
source image (myImage).
Draw (fill) the target geometric shape on it using a defined color
(fillColor).
Now for each pixel of myImage, if the same pixel of dummyImage
contains fillColor then keep it unchanged, else make this pixel
fully transparent by assigning zero (0) to it.
Now myImage is almost ready, need to trim this image for
transparent pixel removal.
Following code will apply a circular crop on a image. (but won't trim the transparent pixels).
package mypackage;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.MenuItem;
import net.rim.device.api.ui.component.BitmapField;
import net.rim.device.api.ui.component.Menu;
import net.rim.device.api.ui.container.MainScreen;
class MyScreen extends MainScreen {
private Bitmap myImage = Bitmap.getBitmapResource("img/myImage.jpeg");
private BitmapField _bf;
public MyScreen() {
_bf = new BitmapField(myImage);
adjustBitmapMargin();
add(_bf);
}
private void adjustBitmapMargin() {
int x = (Display.getWidth() - myImage.getWidth()) / 2;
int y = (Display.getHeight() - myImage.getHeight()) / 2;
_bf.setMargin(y, 0, 0, x);
}
protected void makeMenu(Menu menu, int instance) {
menu.add(miCropCircle);
super.makeMenu(menu, instance);
}
private MenuItem miCropCircle = new MenuItem("Crop - Circle", 0, 0) {
public void run() {
cropImage();
}
};
private void cropImage() {
int width = myImage.getWidth();
int height = myImage.getHeight();
// get original data from the image
int myImageData[] = new int[width * height];
myImage.getARGB(myImageData, 0, width, 0, 0, width, height);
// get default color of a newly created bitmap
int defaultColors[] = new int[1 * 1];
(new Bitmap(1, 1)).getARGB(defaultColors, 0, 1, 0, 0, 1, 1);
int defaultColor = defaultColors[0];
int fillColor = Color.RED;
int diameter = 200;
// dummy data preparation
Bitmap dummyImage = new Bitmap(width, height);
Graphics dummyImageGraphics = Graphics.create(dummyImage);
dummyImageGraphics.setColor(fillColor);
int startX = width / 2 - diameter / 2;
int startY = height / 2 - diameter / 2;
dummyImageGraphics.fillArc(startX, startY, diameter, diameter, 0, 360);
int dummyData[] = new int[width * height];
dummyImage.getARGB(dummyData, 0, width, 0, 0, width, height);
// filling original data with transparent value.
int totalPixels = width * height;
for (int i = 0; i < totalPixels; i++) {
if (dummyData[i] == defaultColor) {
myImageData[i] = 0;
}
}
// set new data
myImage.setARGB(myImageData, 0, width, 0, 0, width, height);
// redraw screen
_bf.setBitmap(myImage);
adjustBitmapMargin();
invalidate();
// free up some memory here
defaultColors = null;
dummyImage = null;
dummyData = null;
dummyImageGraphics = null;
}
}
Output of the above code: