Looking for conceptual help

I am looking for psuedo code or even an explanation of the best way to accomplish a goal of having an app that the user can take a picture, have them resize the picture to fit in a frame and have the resulting picture be used as a sprite in an animation.

For example, I want to be able to take a picture of a person (mostly their face), insert it in to a template picture of say a santa head, allow them to resize and rotate the picture of the face so that it fits nicely in to the face hole of the santa hat and beard and save it to be used as a sprite in an animation.

I believe I should be looking at image masks but Im not sure if thats the direction I should be headed. I’m not looking for code examples, just some nudging in the right direction on where I should be looking to accomplish such a goal.

Thanks in advance

I don’t think there is a simple answer to this as you have a lot of steps required:

  1. Take a photo

  2. Resize a photo

  3. Merge with an existing image

  4. Resize and rotate the result

  5. Save image to disk

  6. Use the result as a displayObject

At a glance, I think this stuff is mostly achievable using the new public build (“Graphics 2.0”) but you’ll need to look at:

a. display.newContainer or graphics.newMask depending on the mask shape you need

b. media.* for capturing and manipulating photos

c. touch events (so you can write the code to resize/rotate things)

d. io.* (possibly needed to write/read from disk)

…and possibly more. All I can really recommend is to tackle things one step at a time.

Thanks for the response. That gives me a direction to start looking. The first few steps are probably where I need the most help because I want the person taking the picture (or choosing an existing picture from the camera roll) to be able to resize the picture(pinch and zoom) of their face to fit in to an existing picture like a faceless santa with hat, beard etc (Think of those wooden cutouts that you can stick your head through at carnivals for silly picture taking). I imagine it would be a lot harder to figure out the particular portion of a photo that is the face and resize it to fit the faceless santa using just code.

So my thought is that it would be easier for a user to choose an existing photo or take a picture and be able to pinch, zoom and rotate the camera image so that only their face fills the hole in the overlay and they can click finish when they have it sized and centered the way they like it, then like you said to use the result as a display object.

Finding the “face” in a photo is the hardest part and I’m really not sure if Corona can do that yet, because I’m guessing you need to read in the pixels and do some math. It would be much easier to take a photo and then allow the user to try and align the face to fit through the hole. (display.newGroup or display.newContainer would make the layering trivial) Then you would presumably use capture to grab what you have on-screen and save to disk.

Still a lot of things to look into but take it one step at a time and you should figure it out. :slight_smile:

Thanks for the input richard9. I appreciate it.

I don’t think there is a simple answer to this as you have a lot of steps required:

  1. Take a photo

  2. Resize a photo

  3. Merge with an existing image

  4. Resize and rotate the result

  5. Save image to disk

  6. Use the result as a displayObject

At a glance, I think this stuff is mostly achievable using the new public build (“Graphics 2.0”) but you’ll need to look at:

a. display.newContainer or graphics.newMask depending on the mask shape you need

b. media.* for capturing and manipulating photos

c. touch events (so you can write the code to resize/rotate things)

d. io.* (possibly needed to write/read from disk)

…and possibly more. All I can really recommend is to tackle things one step at a time.

Thanks for the response. That gives me a direction to start looking. The first few steps are probably where I need the most help because I want the person taking the picture (or choosing an existing picture from the camera roll) to be able to resize the picture(pinch and zoom) of their face to fit in to an existing picture like a faceless santa with hat, beard etc (Think of those wooden cutouts that you can stick your head through at carnivals for silly picture taking). I imagine it would be a lot harder to figure out the particular portion of a photo that is the face and resize it to fit the faceless santa using just code.

So my thought is that it would be easier for a user to choose an existing photo or take a picture and be able to pinch, zoom and rotate the camera image so that only their face fills the hole in the overlay and they can click finish when they have it sized and centered the way they like it, then like you said to use the result as a display object.

Finding the “face” in a photo is the hardest part and I’m really not sure if Corona can do that yet, because I’m guessing you need to read in the pixels and do some math. It would be much easier to take a photo and then allow the user to try and align the face to fit through the hole. (display.newGroup or display.newContainer would make the layering trivial) Then you would presumably use capture to grab what you have on-screen and save to disk.

Still a lot of things to look into but take it one step at a time and you should figure it out. :slight_smile:

Thanks for the input richard9. I appreciate it.