Inserting image into a specific shape

[brettb38818605]

Hello all! I have been making a form-fillable character sheet for people to use for their dnd characters. My art serves as a backdrop and I build all of the fillable segments manually.

Most of it has been easy to set up in Acrobat Pro but I'm having trouble with inserting an image into a specific shape. See example below.

insert image

I'm expecting this to require a bit of coding which I am admittedly a novice at but think I could figure out with some help.

Any thoughts or help would be greatly appreciated.

Thanks!

[George_Johnson]

It cold work with two overlapping buttons. The first would be the one that displays the image you want, and the other would include that graphic you show surrounding it. Both buttons should be read-only. The center area would have to be transparent and you'd have to provide some means other than clicking the first button to prompt the user to import an image.

[brettb38818605]

Okay I think the 2 button overlay is working. I've added a button elsewhere that the user can click to access the portrait below. I just don't know the javascript for that. How do I make a button interact with another button on my page?

[George_Johnson]

Something like this in the Mouse Up event of the button that you added:

// Get a reference to the button used to display the image

var f = getField("image_button");

// Propmt the user to select an image

f.buttonImportIcon();

That's a bearbones script. You could add additional code to handle errors. More information: https://help.adobe.com/en_US/acrobat/acrobat_dc_sdk/2015/HTMLHelp/#t=Acro12_MasterBook%2FJS_API_Acro...

[brettb38818605]

Works like a charm! Thanks so much for taking the time to help me out!

[Felderburg]

Hello, could either of you describe how you get a button that looks like an image? I have the same issue, but the only button options I have don't seem to allow for a custom graphic as their appearance. Or even how to make an image have a shape other than rectangle would work.

[Felderburg]

Well, since there doesn't seem to be a way to edit this post:

Using info from https://community.adobe.com/t5/acrobat-discussions/round-image-field-in-acrobat/m-p/11270806 as well, what I did was create a PNG of the artwork area around the image with a transparent area that as the shape I needed. I then created an image form field, and used that PNG as the field's "icon" (this can be done either by closing out of preparing and just adding it as an image, or in the "option" tab of its properties choosing the Icon). I did have to resize the mask PNG.

Create a second image field, make sure it's below the mask and is read only. Add the code from this thread to the mouse up action of the mask button (renaming the "image_button" in the code to my field). And that works perfectly.

[Felderburg]

Crap, forgot to note that in the lower actual image field, I had to change the properties. Using the "Advanced" button next to layout, I turned "Fit to bounds" on. It also always scales, and scales proprtionally.