ViewMode
When you open a document using ComPDFKit.openDocument()
, you can set the default display mode according to your product's needs. For example, the default Viewer Mode
allows viewing PDF documents and filling out forms but does not allow editing annotations, text, etc.
Setting the Default Mode
The following example demonstrates how to set Annotation Mode as the default display mode. In Annotation Mode, users can add, delete, and modify annotations.
// ComPDFKit.openDocument Sample
var config = ComPDFKit.getDefaultConfig({
modeConfig : {
initialViewMode: CPDFViewMode.ANNOTATIONS
}
})
ComPDFKit.openDocument(samplePDF, '', config)
// CPDFReaderView Sample
<CPDFReaderView
ref={pdfReaderRef}
document={samplePDF}
saveDocument={saveDocument}
configuration={config}/>
The results are as follows:
Android | iOS |
---|---|
![]() | ![]() |
Setting the Mode List
You can switch modes by clicking the top title. Depending on your needs, you can configure the required modes and their display order in CPDFConfiguration
. The following example shows how to configure only Viewer Mode and Annotation Mode:
// ComPDFKit.openDocument Sample
var config = ComPDFKit.getDefaultConfig({
modeConfig : {
availableViewModes: [
CPDFViewMode.VIEWER,
CPDFViewMode.ANNOTATIONS
]
}
})
ComPDFKit.openDocument(samplePDF, '', config)
// CPDFReaderView Sample
<CPDFReaderView
ref={pdfReaderRef}
document={samplePDF}
saveDocument={saveDocument}
configuration={config}/>
The results are as follows:
Android | iOS |
---|---|
![]() | ![]() |
Switching View Modes:
When using the CPDFReaderView
to display a PDF, you can programmatically switch the current view mode using the provided API.
// Switch to annotation mode
await pdfReaderRef.current?.setPreviewMode(CPDFViewMode.VIEWER);
// Get the current view mode
const mode = await pdfReaderRef.current?.getPreviewMode();