Form Image Button

Xodo PDF Studio is capable of creating an image import button to allow users to insert images into the PDF document when completing a form. This button is the same as a standard button only that it has specific settings and JavaScript set automatically to make it work as an image import button.

Creating Image Buttons

  1. Start the Form Editing Mode by going to the Forms Tab
  2. Click on the Image Button button located on the tool bar. The cursor will then change to show a preview of the field
  3. Using the mouse move to the location you want to place the field and then click to place the field or click and drag to create a custom field size.
  4. Repeat to create as many Image Buttons as you need
  5. To finish placing Image Buttons press Esc or click on the button on the toolbar

Button Properties

To access the Image Button properties right click (Mac: Ctrl + Click) on the field and choose Properties in the mouse menu or click on the edit button on the Mini Toolbar. The Image Button contains the following property settings.

Appearance

Name - The Image Button field

Tooltip - The tip that is shown when the mouse is hovered over the field

Style

Font - Sets the font of the text on the button

Size - Sets the font size of the text on the button

Text Color - Sets the text color on the button

Border Color - Sets the color of the border on the button

Line Width - Sets the width of the border line on the button

Fill Color - Sets the fill color on the button

Style - Sets the style for the border line (i.e. dotted, dashed, cloud, etc...) on the button

Save as default - When checked this will make the selected style settings the default for any new Image Buttons going forward

Properties

Rotation - Sets the field rotation in 90 degree increments

Required - This option is not available on Image Buttons

Visibility - Sets one of four visibility options for the field

      • Show: the default setting makes the field visible
      • Hide: hides the field from being displayed when viewing the document
      • Show/Do not print: shows the field but will not print the field or it's values
      • Hide/Print: hides the field but the field and its value will be printed

Read Only - Makes the field uneditable and will just display the value currently set in the field

Locked - When checked prevents the following on the field: being moved or resized, editing appearance properties, & deleting the annotation.

Options

NOTE: These options have been preset to make the Image Button function correctly. Changing these settings may cause the Image Button to no longer work.

Style - Sets the style of the Image Button

    • None: The button will have no effect when pushed
    • Invert: The entire button will highlight when pressed
    • Outline: Only the outline of the button will be highlighted when pressed. Change to a larger line width to see it more
    • Push: Allows you to define separate labels for each of the below interactions with the button
      • Up: when the button is not being acted on
      • Down: when the button is pressed
      • Mouse Over: When the mouse is hovered over the button

Label - Sets whether the button has a label and it's location

Image - Sets whether the button has an image in the background and it's location

Note: Any of the supported image formats (JPEG, PNG, GIF, & TIFF) or a PDF document can be set as the image on the button

Actions

NOTE: These options have been preset to make the Image Button function correctly. Changing these settings may cause the Image Button to no longer work.

The Action Panel displays a list of the current actions associated with the field. Actions can be added, edited, or deleted using the buttons below the actions list.

Add - Adds a custom Form Field Actions from a list of available actions.

Edit - Edits the currently selected action from the list

Remove -  Removes the currently selected action from the list