Tuesday, July 17, 2012

Tutorial: How to use QLPreviewController to preview files.


This tutorial will talk about implementation of preview feature of documents, images and files available on iOS 4.0 onwards. Apple reference document says:


A Quick Look preview controller can display previews for the following items:
  • iWork documents
  • Microsoft Office documents (Office ‘97 and newer)
  • Rich Text Format (RTF) documents
  • PDF files
  • Images
  • Text files whose uniform type identifier (UTI) conforms to the public.text type (see Uniform Type Identifiers Reference)
  • Comma-separated value (csv) files


You need to add QuickLook.framework in your project. and import QuickLook/QuickLook.h
and add protocols <QLPreviewControllerDataSource,QLPreviewControllerDelegate>





QLPreviewController *previewController=[[QLPreviewController alloc]init];
previewController.delegate=self;
previewController.dataSource=self;
[self presentModalViewController:previewController animated:YES];
[previewController.navigationItem setRightBarButtonItem:nil];


You need to add datasource methods for sure. Return more than 1 for numberOfPreviewItemsInPreviewController if you want user to be able to preview next and previous file while in preview mode. Else return 1 if you want user to exclusively preview only selected file.
- (NSInteger)numberOfPreviewItemsInPreviewController:(QLPreviewController *)controller
- (id <QLPreviewItem>)previewController:(QLPreviewController *)controller previewItemAtIndex:(NSInteger)index


You may add delegate methods  optionally depending on your requirements. In Sample code, I have used these delegate methods to add the zooming effect where the preview seems to come out of the same button clicked by user.



- (BOOL)previewController:(QLPreviewController *)controller shouldOpenURL:(NSURL *)url forPreviewItem:(id <QLPreviewItem>)item
- (CGRect)previewController:(QLPreviewController *)controller frameForPreviewItem:(id <QLPreviewItem>)item inSourceView:(UIView **)view



For more information, you can view the Apple reference document.

Link of the sample code to download.

14 comments:

  1. I can not figure out how to set the Title of these documents I load, instead of using the filename.
    Can you help?

    ReplyDelete
  2. I agree with you. This post is truly inspiring. I like your post and everything you share with us is current and very informative, I want to bookmark the page so I can return here from you that you have done a fantastic job.
    solavei

    ReplyDelete
  3. You are a Great while writing in the blogs it is awesome I liked it too much good and informative thanks for the sharing.
    cheap paper online | help with assignment

    ReplyDelete
  4. Thanks for the tutorial its really awesome.

    its working in ios5 i changed the file which is in remote url it not showing the pdf document can u help me to fix the issue.

    bala

    ReplyDelete
  5. It’s a great site to see. That will help for improvisation of me. Will definitely marked as Bookmark.

    business voip systems

    ReplyDelete
  6. Is there possible to scale a pdf page by height? Because it fits by width by default

    ReplyDelete
  7. Hi is there any way to edit document file using this. I have downloaded one application, in it user can edit and made more customization which we see in MSOffice.like edit, cut, copy, past, bold, italic.. Please share if you have any idea about this. Thanks

    ReplyDelete
  8. Is there a way to preview a PDF document, one page at a time?

    ReplyDelete
  9. Is there a way to preview server side uploaded document, using QLPreviewController? Please be helpful

    ReplyDelete
  10. When we opening the pdf file, in the console we are getting runtime warning kind of message how can we fix this

    Unbalanced calls to begin/end appearance transitions for .

    ReplyDelete
    Replies
    1. Not sure how you are presenting your preview viewcontroller, but this can happen when you are trying to display an alert/alertviewcontroller with options for a user and then present another alert/alertview/viewcontroller. Choosing an option for the alert is dismissing it while also trying to present that option's alert/alertview/viewcontroller and is sets it off balance

      Delete
    2. You can fix this by adding listeners to the dismissed or did dismiss events of anything you are presenting.

      Delete
  11. iOS 10 previewController:(QLPreviewController *)controller shouldOpenURL:(NSURL *)url forPreviewItem:(id )item this delegate method is not firing.

    Anyone has a solution for this.

    ReplyDelete