Custom Crop Shape

Solar2D General Questions/Discussion
#1

I want to crop an asymmetric image after the user outlines the shape of the object they would like to crop.   I have the selection capability down and the ability to put a container around the MinX,MaxX,MinY,MaxX of the selection but being able to fill the area all the way up to the borders of the cropped image has proven challenging.   I have created something to detect for non-physics collision(using the tutorial) for each pixel but that takes through long to run through a loop for each pixel.

Anyone have any suggestions on how to fill an area around a crop image after you get the selection done?  Thanks for the help!

#2

When you say asymmetric… will these just be horizontal and vertical offset, or are you after something like what you’d make with display.newPolygon ()?

#3

Currently I am drawing a line graphic which I then rotate depending on the the slope(Block 1).  It so far is working pretty well in terms of creating the outline.  I then create a table of all the (xMax,xMin,yMax,yMin) for each line and then create an additional connection line between each point.  After the user has finished the crop selection , I then draw a continuous line (Block 2), the challenge then is to fill the area outside the line.   I have tried display.newPolygon but if I have an polygon failures ( which there will be a couple) then it doesn’t fill it in completely. 

(Block 1)

local line = display.newImageRect( “images/MarchingAnt.png”,4,1 )

local slopea= (linePoints[#linePoints].y-linePoints[#linePoints-1].y)

local slopeb= (linePoints[#linePoints].x-linePoints[#linePoints-1].x)

local slope  = math.deg(math.atan2(slopea,slopeb))

(Block 2)

if tableToColor[i].slope<-90  then

line = display.newLine(tableToColor[i].xm,tableToColor[i].ym+1,tableToColor[i].xx-1,tableToColor[i].yx)

elseif tableToColor[i].slope<0  then

line = display.newLine(tableToColor[i].xx-1,tableToColor[i].ym,tableToColor[i].xm,tableToColor[i].yx-1)

elseif tableToColor[i].slope<90  then

line = display.newLine(tableToColor[i].xm+1,tableToColor[i].ym,tableToColor[i].xx,tableToColor[i].yx-1)

else   

line = display.newLine(tableToColor[i].xx,tableToColor[i].ym+1,tableToColor[i].xm+1,tableToColor[i].yx)

end

#4

Okay, but it sounds like the general idea behind the polygon approach applies.

If you’re running into occasional errors, it might be worth just triangulating the whole thing (Roland’s claims to expect convex polygons, so it might not work, but the others don’t mention such a restriction…) and drawing each individual triangle.

I’m thinking something like this, but where you start with the triangle soup and then blend the original image on top of that. (Off-hand I don’t know what blend mode this would be.)

#5

Thanks for the advice! I will check it out tonight.

#6

When you say asymmetric… will these just be horizontal and vertical offset, or are you after something like what you’d make with display.newPolygon ()?

#7

Currently I am drawing a line graphic which I then rotate depending on the the slope(Block 1).  It so far is working pretty well in terms of creating the outline.  I then create a table of all the (xMax,xMin,yMax,yMin) for each line and then create an additional connection line between each point.  After the user has finished the crop selection , I then draw a continuous line (Block 2), the challenge then is to fill the area outside the line.   I have tried display.newPolygon but if I have an polygon failures ( which there will be a couple) then it doesn’t fill it in completely. 

(Block 1)

local line = display.newImageRect( “images/MarchingAnt.png”,4,1 )

local slopea= (linePoints[#linePoints].y-linePoints[#linePoints-1].y)

local slopeb= (linePoints[#linePoints].x-linePoints[#linePoints-1].x)

local slope  = math.deg(math.atan2(slopea,slopeb))

(Block 2)

if tableToColor[i].slope<-90  then

line = display.newLine(tableToColor[i].xm,tableToColor[i].ym+1,tableToColor[i].xx-1,tableToColor[i].yx)

elseif tableToColor[i].slope<0  then

line = display.newLine(tableToColor[i].xx-1,tableToColor[i].ym,tableToColor[i].xm,tableToColor[i].yx-1)

elseif tableToColor[i].slope<90  then

line = display.newLine(tableToColor[i].xm+1,tableToColor[i].ym,tableToColor[i].xx,tableToColor[i].yx-1)

else   

line = display.newLine(tableToColor[i].xx,tableToColor[i].ym+1,tableToColor[i].xm+1,tableToColor[i].yx)

end

#8

Okay, but it sounds like the general idea behind the polygon approach applies.

If you’re running into occasional errors, it might be worth just triangulating the whole thing (Roland’s claims to expect convex polygons, so it might not work, but the others don’t mention such a restriction…) and drawing each individual triangle.

I’m thinking something like this, but where you start with the triangle soup and then blend the original image on top of that. (Off-hand I don’t know what blend mode this would be.)

#9

Thanks for the advice! I will check it out tonight.