Is there a way to crop a camera image? Specifying width and height seem to resize it. I’d like to crop to a square. It would be nice if the cameraSource could also show as a square. Thanks.
Not really any simple way to crop an image in code. Try creating an image() of your crop’s dimensions, calling setContext() with it, spriting the camera into its middle, and restoring drawing to the screen by calling setContext() with no parameters.
@DaveW Maybe this will give you an idea.
EDIT: Made changes to allow the crop area to be resized by moving your finger. Double to to switch between resizing the crop area and moving the crop area. Tap “Save image” to capture the image.
displayMode(FULLSCREEN) function setup() img=nil rectMode(CENTER) spriteMode(CENTER) cameraSource(CAMERA_BACK) mov=false x1=300 y1=300 dx=100 dy=100 end function draw() background(40, 40, 50) if img==nil then img=image(CAMERA) else iw=img.width ih=img.height sprite(img,iw/2,ih/2) end if mov then stroke(255,0,0) str="Double tap to resize crop area" else stroke(255) str="Double tap to move crop area" end noFill() strokeWidth(2) rect(x1,y1,dx,dy) stroke(255) rect(WIDTH/2,HEIGHT-100,100,50) fill(255) text("Save image",WIDTH/2,HEIGHT-100) text(str,WIDTH/2,HEIGHT-50) if img2~=nil then sprite(img2,sx,sy) end end function touched(t) if t.state==BEGAN then if t.x>WIDTH/2-50 and t.x<WIDTH/2+50 and t.y>HEIGHT-125 and t.y<HEIGHT-75 then img2=img:copy(x1-dx/2,y1-dy/2,dx,dy) sx=dx/2 sy=HEIGHT-dy/2 end end if t.state==BEGAN and t.tapCount==2 then mov=not mov end if t.state==MOVING and not mov then dx=math.abs(dx+t.deltaX) dy=math.abs(dy+t.deltaY) end if mov then x1=x1+t.deltaX y1=y1+t.deltaY end end
@dave1707 Wow! That’s getting me much closer. Two things:
- Could this work when the captured image is resized to less than full screen? The frame looks at the full screen.
- Is there a way to make the inside of the frame transparent so the underlying photo can be seen as the frame is moved?
Thanks a bunch.
@DaveW This was just a quick example to show you that cropping can be done. This can be changed to work with any sized image and changed to resize the crop area. As for making the inside transparent, that depends on what you want to do. Are you cutting multiple images out of a single image or will you just capture one image. The inside could be cleared after you save the captured image, so that basically makes it transparent. How this gets changed is up to you, but I’m sure no matter what you want to do, it can be done.
@DaveW I made changes to the above code. You can resize or move the crop area by moving your finger around the screen. Double tap the screen to toggle between resizing the crop area or moving the crop area. Tap “Save image” to capture what’s in the crop area. The rectangle will be red when the crop area can be moved around, white for resize.
@dave1707, This seems to work perfectly! Thanks a bunch!