Add a UIView to a PDF page

This tutorial only applies to Xamarin.iOS. See Xamarin.Android equivalent here .

This guide demonstrates how to make a `UIView` appear as if it is stuck to a page.

It is convenient for the user to make a UIView that is "stuck" to a page record its desired page location. To do this, you could add an extension/category to a UIView, or use a derived class, as shown below:

1public class FloatingView : UIView
2{
3    public FloatingView() : base()
4    {
5        
6    }
7    
8    public int PageNumber { get; set; }
9
10    public pdftron.PDF.Rect PdfPageRect { get; set; }
11}

1class FloatingView: UIView {
2    // the page on which the UIView appears
3    
4    var pageNumber: Int32 = 0
5    // the location, expressed in PDF coordinates, at which the view appears
6    var pdfPageRect: PTPDFRect?
7}

1@interface FloatingView : UIView
2// the page on which the UIView appears
3@property (assign, nonatomic) int pageNumber;
4// the location, expressed in PDF coordinates, at which the view appears
5@property (strong, nonatomic) PTPDFRect* pdfPageRect;
6@end
7@implementation FloatingView
8@end

In this example, we will add a red square to a location near the bottom left hand corner of the first page:

1var mCustomView = new FloatingView();
2mCustomView.BackgroundColor = UIColor.Red;
3mCustomView.PageNumber = 1;
4mCustomView.PdfPageRect = new Rect(10, 10, 100, 100);
5mPdfViewCtrl.OverlayView.AddSubview(mCustomView);
6
7// position the view
8positionFloatingViews();

1// prepare the new view
2let redRect = FloatingView()
3redRect.backgroundColor = UIColor.red
4redRect.pageNumber = 1
5redRect.pdfPageRect = PTPDFRect(x1: 10, y1: 10, x2: 100, y2: 100)
6// add the view to PTPDFViewCtrl's overlayView
7self.pdfViewCtrl.overlayView.addSubview(redRect)
8// position the view
9positionFloatingViews()

1// prepare the new view
2FloatingView* redRect = [[FloatingView alloc] init];
3[redRect setBackgroundColor:[UIColor redColor]];
4redRect.pageNumber = 1;
5redRect.pdfPageRect = [[PTPDFRect alloc] initWithX1:10 y1:10 x2:100 y2:100];
6// add the view to PTPDFViewCtrl's overlayView
7[self.pdfViewCtrl.overlayView addSubview:redRect];
8// position the view
9[self positionFloatingViews];

Without the last line in the code snippet above, the new view would not appear in the correct location. The following method will position it, and any others that have been added:

1void positionFloatingViews()
2{
3    foreach (UIView view in mPdfViewCtrl.OverlayView.Subviews)
4    {
5        if (view is FloatingView)
6        {
7            var overlayView = view as FloatingView;
8            bool pageHidden = false;
9            if (!mPdfViewCtrl.PagePresentationModeIsContinuous)
10            {
11                pageHidden = !mPdfViewCtrl.PageIsOnScreen(overlayView.PageNumber);
12            }
13            overlayView.Hidden = pageHidden;
14            CGRect screenRect = mPdfViewCtrl.PDFRectPage2CGRectScreen(TypeConvertHelper.ConvRectToNative(overlayView.PdfPageRect), overlayView.PageNumber);
15            screenRect.X += (nfloat)mPdfViewCtrl.GetHScrollPos();
16            screenRect.Y += (nfloat)mPdfViewCtrl.GetVScrollPos();
17            overlayView.Frame = screenRect;
18        }
19    }
20}

1func positionFloatingViews() {
2    for case let overlayView as FloatingView in self.pdfViewCtrl.overlayView.subviews {
3        // make sure this is a floating view
4        if type(of: overlayView) === FloatingView.self {
5            var pageHidden = false
6            if !pdfViewCtrl.pagePresentationModeIsContinuous() {
7                pageHidden = !pdfViewCtrl.pageIs(onScreen: overlayView.pageNumber)
8            }
9            overlayView.isHidden = pageHidden
10            var screenRect: CGRect = pdfViewCtrl.pdfRectPage2CGRectScreen(overlayView.pdfPageRect, pageNumber: overlayView.pageNumber)
11            screenRect.origin.x += CGFloat(pdfViewCtrl.getHScrollPos())
12            screenRect.origin.y += CGFloat(pdfViewCtrl.getVScrollPos())
13            overlayView.frame = screenRect
14        }
15    }
16}

1-(void)positionFloatingViews
2{
3    for(FloatingView* overlayView in self.pdfViewCtrl.overlayView.subviews)
4    {
5        // make sure this is a floating view
6        if( [overlayView isMemberOfClass:[FloatingView class]])
7        {
8            BOOL pageHidden = NO;
9            if( ![self.pdfViewCtrl pagePresentationModeIsContinuous] )
10            {
11                pageHidden = ![self.pdfViewCtrl pageIsOnScreen:overlayView.pageNumber];
12            }
13            overlayView.hidden = pageHidden;
14            CGRect screenRect = [self.pdfViewCtrl PDFRectPage2CGRectScreen:overlayView.pdfPageRect PageNumber:overlayView.pageNumber];
15            screenRect.origin.x += [self.pdfViewCtrl GetHScrollPos];
16            screenRect.origin.y += [self.pdfViewCtrl GetVScrollPos];
17            overlayView.frame = screenRect;
18        }
19    }
20}

A red `UIView` positioned near the bottom left hand corner of the first page.

Whenever the PDF page shifts within the PTPDFViewCtrl, which may happen when changing the page presentation mode, zooming, and such, the views need to be re-positioned (positionFloatingViews needs to run again). To do this, implement the PTPDFViewCtrl delegate methods pdfScrollViewDidEndZooming: and onLayoutChanged, and in them, call positionFloatingViews:

1mPdfViewCtrl.PdfViewCtrlOnLayoutChanged += (sender, e) =>
2{
3    positionFloatingViews();
4};
5mPdfViewCtrl.PdfScrollViewDidEndZooming += (sender, e) =>
6{
7    positionFloatingViews();
8};

1func pdfViewCtrl(onLayoutChanged pdfViewCtrl: PTPDFViewCtrl!) {
2    positionFloatingViews()
3}
4func pdfViewCtrl(_ pdfViewCtrl: PTPDFViewCtrl!, pdfScrollViewDidEndZooming scrollView: UIScrollView!, with view: UIView!, atScale scale: Float) {
5    positionFloatingViews()
6}

1-(void)pdfViewCtrlOnLayoutChanged:(PTPDFViewCtrl *)pdfViewCtrl
2{
3    [self positionFloatingViews];
4}
5-(void)pdfViewCtrl:(PTPDFViewCtrl *)pdfViewCtrl pdfScrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale
6{
7    [self positionFloatingViews];
8}

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales