|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +title: Add, Remove, and Edit Annotations in .NET MAUI PDF Viewer | Syncfusion |
| 4 | +description: Learn here all about adding, removing and editing annotations in a PDF document using Syncfusion<sup>®</sup> .NET MAUI PDF Viewer (SfPdfViewer) control. |
| 5 | +platform: MAUI |
| 6 | +control: SfPdfViewer |
| 7 | +documentation: ug |
| 8 | +keywords: .net maui pdf viewer, .net maui view pdf, pdf viewer in .net maui, .net maui open pdf, maui pdf viewer, maui pdf view |
| 9 | +--- |
| 10 | + |
| 11 | +# Add, Remove, and Edit Annotations in .NET MAUI PDF Viewer (SfPdfViewer) |
| 12 | + |
| 13 | +This section will review the various functions in the [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) for adding, removing, and editing annotations in a PDF document. |
| 14 | + |
| 15 | +## Add annotations to a PDF document |
| 16 | + |
| 17 | +This section will go through how to add annotations to a PDF document programmatically. |
| 18 | + |
| 19 | +### Add annotations programmatically |
| 20 | + |
| 21 | +You can add a new annotation to the PDF document programmatically by creating an annotation instance and providing it as a parameter to the [AddAnnotation](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_AddAnnotation_Syncfusion_Maui_PdfViewer_Annotation_) method. The following example shows how to create an instance of a circle annotation and add it to the PDF document. Similarly, you can create and add other types of annotations. |
| 22 | + |
| 23 | +{% tabs %} |
| 24 | +{% highlight c# %} |
| 25 | +void AddCircleAnnotation() |
| 26 | +{ |
| 27 | + int pageNumber = 1; |
| 28 | + // Define the bounds for the circle in the PDF coordinates. |
| 29 | + RectF circleBounds = new RectF(10, 10, 100, 100); |
| 30 | + |
| 31 | + // Create a circle annotation. |
| 32 | + CircleAnnotation annotation = new CircleAnnotation(circleBounds, pageNumber); |
| 33 | + |
| 34 | + // Set the appearance for the circle annotation. |
| 35 | + annotation.Color = Colors.Red; //Stroke color |
| 36 | + annotation.FillColor = Colors.Green; //Fill color |
| 37 | + annotation.BorderWidth = 2; //Stroke thickness |
| 38 | + annotation.Opacity = 0.75f; // 75% Opacity |
| 39 | + |
| 40 | + // Add the annotation to the PDF document using the `AddAnnotation` method of `SfPdfViewer`. |
| 41 | + PdfViewer.AddAnnotation(annotation); |
| 42 | +} |
| 43 | +{% endhighlight %} |
| 44 | +{% endtabs %} |
| 45 | + |
| 46 | +### AnnotationAdded event |
| 47 | + |
| 48 | +The [AnnotationAdded](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_AnnotationAdded) event occurs when an annotation is added successfully to the PDF document. The following example explains how to wire and handle the event. |
| 49 | + |
| 50 | +{% tabs %} |
| 51 | +{% highlight c# %} |
| 52 | +void WireAnnotationAddedEvent() |
| 53 | +{ |
| 54 | + // Wire the annotation added event of [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) control. |
| 55 | + PdfViewer.AnnotationAdded += OnAnnotationAdded; |
| 56 | +} |
| 57 | + |
| 58 | +private void OnAnnotationAdded(object sender, AnnotationEventArgs e) |
| 59 | +{ |
| 60 | + Annotation addedAnnotation = e.Annotation; |
| 61 | + Debug.WriteLine("{0} is added to the document successfully", addedAnnotation.Name); |
| 62 | +} |
| 63 | +{% endhighlight %} |
| 64 | +{% endtabs %} |
| 65 | + |
| 66 | +## Remove annotations from the PDF document |
| 67 | + |
| 68 | +This section will go through different methods of removing annotations from a PDF document. |
| 69 | + |
| 70 | +### Remove a specific annotation |
| 71 | + |
| 72 | +You can remove an annotation from the document programmatically by providing the specific annotation instance as the parameter to the [RemoveAnnotation](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_RemoveAnnotation_Syncfusion_Maui_PdfViewer_Annotation_) method of [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html). The following example shows how to remove the first annotation in the annotation collection from a PDF document. |
| 73 | + |
| 74 | +{% tabs %} |
| 75 | +{% highlight c# %} |
| 76 | +void RemoveFirstAnnotation() |
| 77 | +{ |
| 78 | + //Obtain the annotation collection using [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) instance. |
| 79 | + ReadOnlyObservableCollection<Annotation> annotations = PdfViewer.Annotations; |
| 80 | + |
| 81 | + //Obtain the first annotation in the annotation collection. |
| 82 | + Annotation firstAnnotation = annotations[0]; |
| 83 | + |
| 84 | + //Remove the annotation using the RemoveAnnotation method of `SfPdfViewer`. |
| 85 | + PdfViewer.RemoveAnnotation(firstAnnotation); |
| 86 | +} |
| 87 | +{% endhighlight %} |
| 88 | +{% endtabs %} |
| 89 | + |
| 90 | +### Remove all the annotations |
| 91 | + |
| 92 | +You can remove all the annotations from a document programmatically by calling the [RemoveAllAnnotations](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_RemoveAllAnnotations) method. The following example shows how to remove all the annotations from a PDF document. |
| 93 | + |
| 94 | +{% tabs %} |
| 95 | +{% highlight c# %} |
| 96 | +void RemoveAllAnnotations() |
| 97 | +{ |
| 98 | + // Removes all the annotations from a PDF document using [RemoveAllAnnotations](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_RemoveAllAnnotations) method of [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html). |
| 99 | + PdfViewer.RemoveAllAnnotations(); |
| 100 | +} |
| 101 | +{% endhighlight %} |
| 102 | +{% endtabs %} |
| 103 | + |
| 104 | +### AnnotationRemoved event |
| 105 | + |
| 106 | +The [AnnotationRemoved](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_AnnotationRemoved) event occurs when an annotation is removed successfully from the PDF document. The following example explains how to wire and handle the event. |
| 107 | + |
| 108 | +{% tabs %} |
| 109 | +{% highlight c# %} |
| 110 | +void WireAnnotationRemovedEvent() |
| 111 | +{ |
| 112 | + // Wire the annotation removed event of [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html). |
| 113 | + PdfViewer.AnnotationRemoved += OnAnnotationRemoved; |
| 114 | +} |
| 115 | + |
| 116 | +private void OnAnnotationRemoved(object sender, AnnotationEventArgs e) |
| 117 | +{ |
| 118 | + Annotation removedAnnotation = e.Annotation; |
| 119 | + Debug.WriteLine("{0} is removed from the document successfully", removedAnnotation.Name); |
| 120 | +} |
| 121 | +{% endhighlight %} |
| 122 | +{% endtabs %} |
| 123 | + |
| 124 | +## Edit annotations |
| 125 | + |
| 126 | +This section will go through different methods of editing annotations in a PDF document programmatically. |
| 127 | + |
| 128 | +### Edit a specific annotation |
| 129 | + |
| 130 | +You can edit the properties of an annotation from the document programmatically by accessing the specific annotation instance from the [Annotations](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_Annotations) property of the SfPdfViewer. The following example shows how to edit the first annotation in the annotation collection. Similarly, you can also modify the other properties. |
| 131 | + |
| 132 | +{% tabs %} |
| 133 | +{% highlight c# %} |
| 134 | +void EditFirstAnnotation() |
| 135 | +{ |
| 136 | + // Obtain the annotation collection using [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) instance. |
| 137 | + ReadOnlyObservableCollection<Annotation> annotations = PdfViewer.Annotations; |
| 138 | + |
| 139 | + // Obtain the first annotation in the annotation collection. |
| 140 | + Annotation annotation = annotations[0]; |
| 141 | + |
| 142 | + // Edit the annotation properties. |
| 143 | + annotation.Color = Colors.Green; //Stroke color. |
| 144 | + annotation.Opacity = 0.75f; // 75% Opacity |
| 145 | + |
| 146 | + // Type cast to edit the properties of the specific annotation type. Here, the first annotation is a circle annotation. |
| 147 | + if (annotation is CircleAnnotation circleAnnotation) |
| 148 | + { |
| 149 | + circleAnnotation.FillColor = Colors.Red; //Inner fill color. |
| 150 | + circleAnnotation.BorderWidth = 2; //Stroke thickness. |
| 151 | + circleAnnotation.Bounds = new RectF(10, 10, 100, 100); // Bounds in PDF coordinates. |
| 152 | + } |
| 153 | +} |
| 154 | +{% endhighlight %} |
| 155 | +{% endtabs %} |
| 156 | + |
| 157 | +### AnnotationEdited event |
| 158 | + |
| 159 | +The [AnnotationEdited](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html#Syncfusion_Maui_PdfViewer_SfPdfViewer_AnnotationEdited) event occurs when an annotation is edited in the PDF document. The following example explains how to wire and handle the event. |
| 160 | + |
| 161 | +{% tabs %} |
| 162 | +{% highlight c# %} |
| 163 | +void WireAnnotationEditedEvent() |
| 164 | +{ |
| 165 | + // Wire the annotation edited event of [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html). |
| 166 | + PdfViewer.AnnotationEdited += OnAnnotationEdited; |
| 167 | +} |
| 168 | + |
| 169 | +private void OnAnnotationEdited(object sender, AnnotationEventArgs e) |
| 170 | +{ |
| 171 | + Annotation editedAnnotation = e.Annotation; |
| 172 | + Debug.WriteLine("The {0} is edited successfully", editedAnnotation.Name); |
| 173 | +} |
| 174 | +{% endhighlight %} |
| 175 | +{% endtabs %} |
| 176 | + |
| 177 | +### Adding custom information to an annotation |
| 178 | + |
| 179 | +The [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) allows you to assign custom information to annotations. The [CustomData](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.Annotation.html#Syncfusion_Maui_PdfViewer_Annotation_CustomData) property is utilized to store additional information about each annotation instance for reference. However, it's essential to note that these data are solely intended for reference purposes and will not be displayed in the [SfPdfViewer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.SfPdfViewer.html) interface. |
| 180 | + |
| 181 | +The provided code sample illustrates how to set the [CustomData](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.PdfViewer.Annotation.html#Syncfusion_Maui_PdfViewer_Annotation_CustomData) property for an annotation. Within this code sample, we set the custom data to represent the creation date of the annotation. |
| 182 | + |
| 183 | +{% tabs %} |
| 184 | +{% highlight C# %} |
| 185 | + |
| 186 | +private void OnAnnotationAdded(object sender, AnnotationEventArgs e) |
| 187 | +{ |
| 188 | + e.Annotation.CustomData="Created Date is: " +DateTime.Now.ToString(); |
| 189 | +} |
| 190 | + |
| 191 | +{% endhighlight %} |
| 192 | +{% endtabs %} |
0 commit comments