Syncfusion AI Assistant

How can I help you?

Customize Form Fields in .NET MAUI PDF Viewer (SfPdfViewer)

25 Mar 20265 minutes to read

The SfPdfViewer allows you to customize the visual appearance of form fields by modifying properties on their Widget objects. You can change the background color, text (foreground) color, border color, and border width.

NOTE

  • Appearance customizations support undo and redo.
  • Customizations cannot be applied when a form field is locked.
  • Customized colors and border width are preserved during import, export, printing, and saving.

Customize the background color

The BackgroundColor property sets the fill color behind the field content. The following example applies a uniform background color to all form fields in the document.

foreach (FormField formField in PdfViewer.FormFields)
{
    foreach (Widget widget in formField.Widgets)
    {
        // Apply a semitransparent blue background (matches the pre-v29.1.33 default).
        widget.BackgroundColor = Color.FromRgba(204, 215, 255, 200);
    }
}

Customize the text color

The ForegroundColor property sets the text color inside the form field. The following example applies a red text color to all text form fields.

foreach (FormField formField in PdfViewer.FormFields)
{
    if (formField is TextFormField textBoxField)
    {
        foreach (var widget in textBoxField.Widgets)
        {
            widget.ForegroundColor = Colors.Red;
        }
    }
}

Customize the border color

The BorderColor property sets the color of the border drawn around the form field. The following example applies a red border to all text form fields.

foreach (FormField formField in PdfViewer.FormFields)
{
    if (formField is TextFormField textBoxField)
    {
        foreach (var widget in textBoxField.Widgets)
        {
            widget.BorderColor = Colors.Red;
        }
    }
}

Customize the border width

The BorderWidth property sets the thickness of the border around the form field. The following example sets a border width of 2.0 on all text form fields.

foreach (FormField formField in PdfViewer.FormFields)
{
    if (formField is TextFormField textBoxField)
    {
        foreach (var widget in textBoxField.Widgets)
        {
            widget.BorderWidth = 2.0f;
        }
    }
}

Detect widget property changes

The PropertyChanged event on a Widget fires whenever a widget property — such as BorderColor, BackgroundColor, BorderWidth, or ForegroundColor — changes. Subscribe to this event after the document loads.

void SubscribeToWidgetPropertyChanges()
{
    foreach (FormField formField in pdfViewer.FormFields)
    {
        foreach (var widget in formField.Widgets)
        {
            widget.PropertyChanged += Widget_PropertyChanged;
        }
    }
}

private void Widget_PropertyChanged(object? sender, System.ComponentModel.PropertyChangedEventArgs e)
{
    if (sender is Widget widget)
    {
        if (e.PropertyName == nameof(widget.BorderWidth))
        {
            double width = widget.BorderWidth;
            // Respond to the border width change.
        }
    }
}

See Also