How to change color of the annotation fields inside the PDF?

Technical Support
, ,
1

I want to change the color of the annotation fields from black to blue inside the PDF. How can I achieve this?
Note: I’m using Angular 12.
Please refer screenshot for more clarity.

annotation fields
annotation fields1162×407 109 KB

2

Hello @Anurag,

In order to change the font color of the text fields you have to set this on the field itself. Each field has a font property, on which you can then set your desired strokeColor and fillColor. Here is an example of how this would be achieved programatically:

// First get your field from the field manager
const fieldManager = documentViewer.getAnnotationManager().getFieldManager()
const myField = fieldManager.getField('my-field-name')

//Set the fill color on the font
myField.font.fillColor = new Annotations.Color(255, 0, 0, 1)

// You can then trigger a major redraw of the page to reflect the new color
// https://www.pdftron.com/api/web/Core.AnnotationManager.html#drawAnnotations__anchor

Alternatively, you can set the colors using our form builder. Simply enter form builder, select your text widget and set the text color through the styling options from the popup.
image

Here are some relevant API links for you to go over:
https://www.pdftron.com/api/web/Core.Annotations.Forms.Field.html#main
https://www.pdftron.com/api/web/Core.Annotations.Font.html#main
https://www.pdftron.com/api/web/Core.Annotations.Forms.FieldManager.html#main

Best Regards,
Armando Bollain
Software Developer
PDFTron Systems, Inc.

3

Hi Armando,
Thanks a lot for your response. This method is working perfectly.

1 Like