How to draw smooth ink annotation on PDF in iOS using Objective-C

Question

I am drawing ink annotation in pdf using objective-c. Pdf specifications say that we need to provide an array of points for the ink drawing. I am using PoDoFo library.

This is how I am drawing ink annotation currently:

PoDoFo::PdfArray arr; //This is the array of points to be drawn

arr.push_back(X1);
arr.push_back(Y1);
arr.push_back(X2);
arr.push_back(Y2);
arr.push_back(X3);
arr.push_back(Y3);
 .
 .
 .
arr.push_back(Xn-1);
arr.push_back(Yn-1);
arr.push_back(Xn);
arr.push_back(Yn);

PoDoFo::PdfMemDocument* doc = (PoDoFo::PdfMemDocument *)aDoc;

PoDoFo::PdfPage* pPage = doc->GetPage(pageIndex);
//PageIndex is page number
if (! pPage) {
    // couldn't get that page
    return;
}
PoDoFo::PdfAnnotation* anno;
PoDoFo::EPdfAnnotation type= PoDoFo::ePdfAnnotation_Ink;

PoDoFo::PdfRect rect;
rect.SetBottom(aRect.origin.y);
rect.SetLeft(aRect.origin.x);
rect.SetHeight(aRect.size.height);
rect.SetWidth(aRect.size.width);

//aRect is CGRect where annotation is to be drawn on page

anno = pPage->CreateAnnotation(type , rect);
anno->GetObject()->GetDictionary().AddKey("InkList", arr);

The problem is that how do I make an array which covers every point. I am getting points from touches delegate methods (e.g. TouchesMoved), but when user draw with high velocity then some points/pixels are skipped and pdf just can’t interpolate those skipped points for itself. Bezier curves can interpolate and draw smooth curves but Bezier-curve don’t provide me the array of all the points (including skipped one) and I need such an array so that when the pdf is opened in adobe reader, it shows smooth curves. Right now I get smooth curve in any iOS device but the curve isn’t smooth on adobe reader. Here is the comparison of curves, one drawn using Bezier-curves in simulator and other in adobe reader.

Above picture is taken from iPad simulator which is drawn using Bezier curve and is smooth.

Above picture is taken from adobe reader. You can see the red curve isn’t smooth like the blue one. How do I make it smooth?

Thanks for the code. This is the only sample code of adding ink annotation using Podofo I can find on internet. I need to point out the last line of code is wrong. We should add an array of points array instead of a points array into InkList. — Vince Yuan

John Tracid John Tracid · Accepted Answer · 2015-09-08T08:18:05

According to PDF 1.3 specification for InkList array:

An array of n arrays, each representing a stroked path. Each array is a series of alternating x and y coordinates in default user space, specifying points along the path. When drawn, the points are connected by straight lines or curves in an implementation-dependent way. (See implementation note 60 in Appendix H.)

And from note 60:

Acrobat viewers always connect the points along each path with straight lines.

So you can't have smooth line here like bezier curve. This is true up to version 1.7.

The only way to have it smooth is to render as image with Core Graphics and add it to PDF.

How to draw smooth ink annotation on PDF in iOS using Objective-C

1 Answers