Example of Custom Toolbar in React PDF Viewer Component

All Controls
/
Pdfviewer
/
CustomToolbar

This example illustrates the process of crafting a customized toolbar within the PDF Viewer, allowing you to incorporate specific tools tailored to your needs.

More Details...

Loading....
Description

This sample demonstrate how to perform the PDF Viewer core functionalities using a custom toolbar.In this example, you can see PDF Viewer control API in action to perform the functionalities

  • Load document - viewer.load(fileName, password)
  • Save - viewer.download()
  • Go to Previous Page - viewer.navigation.goToPreviousPage()
  • Go to Next Page - viewer.navigation.goToNextPage()
  • Go to Page - viewer.navigation.goToPage(pageindex)
  • TextSelection - textSelection()
  • Pan - panMode()
  • Annotation Edit - openEditAnnotation()
  • FormFields Edit - addEditFormFields()
  • Search Text - viewer.textSearch.searchText(searchText,isMatchCase)
  • Search Next - viewer.textSearch.searchNext()
  • Search Previous - viewer.textSearch.searchPrevious()
  • Cancel Search Text - viewer.textSearch.cancelTextSearch()
  • Print - viewer.print.print()
  • Fit To Page - viewer.magnification.fitToPage()
  • Zoom In - viewer.magnification.zoomIn()
  • Zoom Out - viewer.magnification.zoomOut()

More information on the PDF Viewer instantiation can be found in this documentation section .