ComPDFKit React Native supports TypeScript. Types used in this document will be described using TypeScript types. Type information is automatically provided when encoding, and the exact type aliases and constants used in our custom types can be found in the CPDFConfiguration and CPDFOptions source folders.
ComPDFKit contains static methods for global library initialization, configuration, and utility methods.
Initialize the ComPDFKit SDK offline using your ComPDFKit commercial license key. Please contact our sales to obtain a trial license.
Parameters:
Name | Type | Description |
---|---|---|
license | String | Your ComPDFKit license key |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if initialization is successful, otherwise returns false . |
ComPDFKit.init_('your compdfkit license')
Use your ComPDFKit commercial license key to initialize the ComPDFKit SDK using online authentication. Please contact our sales to obtain a trial license.
Parameters:
Name | Type | Description |
---|---|---|
androidOnlineLicense | string | Your ComPDFKit for React Native Android online license key. |
iosOnlineLicense | string | Your ComPDFKit for React Native iOS online license key. |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if initialization is successful, otherwise returns false . |
ComPDFKit.initialize('android online license', 'ios online license')
Get the version number of the ComPDFKit SDK.
For example: '2.0.1'
Returns a Promise.
Name | Type | Description |
---|---|---|
versionCode | String | the version number of the ComPDFKit SDK. |
ComPDFKit.getVersionCode().then((versionCode : string) => {
console.log('ComPDFKit SDK Version:', versionCode)
})
Get the build tag of the ComPDFKit PDF SDK.
For example: "build_beta_2.0.0_42db96987_202404081007"
Returns a Promise.
Name | Type | Description |
---|---|---|
buildTag | String | the build tag of the ComPDFKit PDF SDK. |
ComPDFKit.getSDKBuildTag().then((buildTag : string) => {
console.log('ComPDFKit Build Tag:', buildTag)
})
Used to present a PDF document.
Parameters:
Name | Type | Description |
---|---|---|
document | string | The path to the PDF document to be presented. |
password | string | PDF document password. |
configuration | string | Configuration objects to customize the appearance and behavior of ComPDFKit. |
document = '/storage/emulated/0/Download/PDF_document.pdf'
ComPDFKit.openDocument(document, '', ComPDFKit.getDefaultConfig({}))
document = 'content://...'
ComPDFKit.openDocument(document, '', ComPDFKit.getDefaultConfig({}))
document = "file:///android_asset/..."
ComPDFKit.openDocument(document, '', ComPDFKit.getDefaultConfig({}))
document = 'pdf_document.pdf'
ComPDFKit.openDocument(document, '', ComPDFKit.getDefaultConfig({}))
When using the ComPDFKit.openDocument
method or the CPDFReaderView
UI component to display a PDF file, you need to pass configuration parameters to customize the UI features and PDF view properties. ComPDFKit
provides default configuration parameters through ComPDFKit.getDefaultConfig
. You can retrieve them using the following example:
ComPDFKit.getDefaultConfig({})
You can modify certain parameters to meet your requirements. Here are some usage examples:
ComPDFKit.getDefaultConfig({
modeConfig: {
initialViewMode: CPDFViewMode.VIEWER,
availableViewModes: [
CPDFViewMode.VIEWER,
CPDFViewMode.ANNOTATIONS
]
}
})
ComPDFKit.getDefaultConfig({
annotationsConfig:{
availableType:[
CPDFAnnotationType.NOTE
],
availableTools:[
CPDFConfigTool.SETTING,
CPDFConfigTool.UNDO,
CPDFConfigTool.REDO
],
initAttribute:{
note:{
color: '#1460F3',
alpha: 255
}
}
}
})
3.Setting the display mode and page turning direction:
ComPDFKit.getDefaultConfig({
readerViewConfig:{
displayMode: CPDFDisplayMode.DOUBLE_PAGE,
verticalMode: false
}
})
For more configuration parameter descriptions, please see CPDFCONFIGURATION.md.
Delete the signature saved in the electronic signature annotation list.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if the deletion was successful, otherwise returns false . |
ComPDFKit.removeSignFileList();
Opens the system file picker to select a PDF document.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | string | Returns the selected PDF file path |
String? path = ComPDFKit.pickFile();
Imports font files to support displaying additional languages. mported fonts will appear in the font list for FreeText annotations and text editing.
Note: Fonts must be imported before initializing the SDK.
steps to import fonts:
setImportFontDir
with the folder path as a parameter.ComPDFKit.init_
.Parameters:
Name | Type | Description |
---|---|---|
fontDir | string | The path to the folder containing font files to import. |
addSysFont | string | Whether to include system fonts in the font list. |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | bool | Returns true if the setting is successful, otherwise false |
// Set the font directory
ComPDFKit.setImportFontDir('fontdir', true);
// Initialize the ComPDFKit SDK
ComPDFKit.init_('your license key');
CPDFReaderView
is a React component designed to display PDF documents. Below are details about the required document
prop.
Specifies the path or URI of the PDF document to be displayed.
string
**Usage Examples:
<CPDFReaderView
document={'/storage/emulated/0/Download/PDF_document.pdf'}/>
<CPDFReaderView
document={'content://...'}/>
<CPDFReaderView
document={'file:///android_asset/...'}/>
<CPDFReaderView
document={'pdf_document.pdf'}/>
The password to open the document is an optional parameter.
string
Usage Examples:
<CPDFReaderView
document={'pdf_document.pdf'}
password={'password'}/>
Used to pass configuration parameters when rendering a PDF file to customize UI features and PDF view properties. ComPDFKit
provides default configuration parameters through ComPDFKit.getDefaultConfig
.
string
Usage Examples:
<CPDFReaderView
document={samplePDF}
configuration={ComPDFKit.getDefaultConfig({
})}
style={{flex:1}}
/>
Reopens a specified document in the current CPDFReaderView
component.
Parameters:
Name | Type | Description |
---|---|---|
document | string | The file path of the PDF document. |
password | string | The password for the document, which can be null or empty. |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | bool | A promise that resolves to true if the document is successfully opened, otherwise false . |
await pdfReaderRef.current?._pdfDocument.open(document, 'password');
Checks whether the document has been modified.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
hasChange | boolean | true : The document has been modified, false : The document has not been modified. |
const hasChange = await pdfReaderRef.current?.hasChange();
Save the current document changes.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
result | boolean | true: Save successful,``false: Save failed. |
const saveResult = await pdfReaderRef.current.save();
function, optional
This function will be called when the document is saved.
Parameters:
Name | Type | Description |
---|---|---|
pageNumber | int | the current page number |
<CPDFReaderView
onSaveDocument={()=>{}}
/>
Gets the file name of the PDF document.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | string | Gets the file name of the PDF document. |
const fileName = await pdfReaderRef.current?._pdfDocument.getFileName();
Checks if the PDF document is an image document. This is a time-consuming operation that depends on the document size.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Return true if the document is a scanned image document, otherwise return false . |
const isImageDoc = await pdfReaderRef.current?._pdfDocument.isImageDoc();
Set the current PDF view margin.
Parameters:
Name | Type | Description |
---|---|---|
left | int | margin left |
top | int | margin top |
right | int | margin right |
bottom | int | margin bottom |
await pdfReaderRef.current?.setMargins(10,10,10,10);
Sets the spacing between pages. This method is supported only on the Android
platform.
iOS
platform, use the setMargins
method instead.The spacing between pages is equal to the value of CPDFEdgeInsets.top
.Parameters:
Name | Type | Description |
---|---|---|
pageSpacing | int | The space between pages, in pixels. |
await pdfReaderRef.current?.setPageSpacing(10);
Note: This method only supports the Android platform.
Set the page scale, Value Range: 1.0~5.0
Parameters:
Name | Type | Description |
---|---|---|
scale | number | scale value |
await pdfReaderRef.current?.setScale(2.0);
Get the current page scale
Returns a Promise.
Name | Type | Description |
---|---|---|
result | number | Returns the zoom ratio of the current page. |
const scale = await pdfReaderRef.current?.getScale();
Whether allow to scale.
Parameters:
Name | Type | Description |
---|---|---|
canScale | boolean | scale value |
await pdfReaderRef.current?.setCanScale(false);
Note: This method only supports the Android platform.
Sets background color of reader.
Parameters:
Name | Type | Description |
---|---|---|
theme | CPDFThemes |
await pdfReaderRef.current?.setReadBackgroundColor(CPDFThemes.LIGHT);
Explanation of Themes
Mode | Description | Option Values |
---|---|---|
LIGHT | Uses a white background and black text, suitable for reading in well-lit environments. | CPDFThemes.LIGHT |
DARK | Uses a dark background and light text, suitable for reading in low-light environments. | CPDFThemes.DARK |
SEPIA | Use a beige background for users who are used to reading on paper. | CPDFThemes.SEPIA |
RESEDA | Soft light green background reduces discomfort from high brightness and strong contrast when reading, effectively relieving visual fatigue. | CPDFThemes.RESEDA |
Get background color of reader.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | CPDFThemes |
CPDFThemes theme = await pdfReaderRef.current?.getReadBackgroundColor();
Sets whether to display highlight Form Field.
Parameters:
Name | Type | Description |
---|---|---|
isFormFieldHighlight | boolean | true to display highlight Form Field. |
await pdfReaderRef.current?.setFormFieldHighlight(true);
Whether to display highlight Form Field.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | 当前是否高亮表单域 |
const isFormFieldHighlight = await pdfReaderRef.current?.isFormFieldHighlight();
Sets whether to display highlight Link.
Parameters:
Name | Type | Description |
---|---|---|
isLinkHighlight | boolean | Whether to highlight Link. |
await pdfReaderRef.current?.setLinkHighlight(true);
Whether to display highlight Link.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean |
const isLinkHighlight = await pdfReaderRef.current?.isLinkHighlight();
Sets whether it is vertical scroll mode.
Parameters:
Name | Type | Description |
---|---|---|
isVerticalMode | boolean | Whether it is vertical scroll mode. |
await pdfReaderRef.current?.setVerticalMode(true);
Whether it is vertical scroll mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true for vertical scrolling and false for horizontal scrolling |
await pdfReaderRef.current?.isVerticalMode();
Sets whether it is continuous scroll mode.
Parameters:
Name | Type | Description |
---|---|---|
isContinueMode | boolean | Whether it is continuous scroll mode. |
await pdfReaderRef.current?.setContinueMode(true);
Whether it is continuous scroll mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if the page is scrolled continuously, otherwise returns false |
await pdfReaderRef.current?.isContinueMode();
Sets whether it is double page mode.
Parameters:
Name | Type | Description |
---|---|---|
isDoublePageMode | boolean | Whether it is double page mode. |
await pdfReaderRef.current?.setDoublePageMode(true);
Whether it is double page mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if double page display is enabled, otherwise returns false |
await pdfReaderRef.current?.isDoublePageMode();
await pdfReaderRef.current?.isContinueMode();
Sets whether it is cover page mode.
Parameters:
Name | Type | Description |
---|---|---|
isCoverPageMode | boolean | Whether to display the document in cover form |
await pdfReaderRef.current?.setCoverPageMode(true);
Whether it is cover page mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if the document cover is displayed, otherwise returns false |
await pdfReaderRef.current?.isCoverPageMode();
Sets whether it is crop mode.
Parameters:
Name | Type | Description |
---|---|---|
isCropMode | boolean | Whether it is crop mode. |
await pdfReaderRef.current?.setCropMode(true);
Whether it is cover page mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if the current mode is clipping mode, otherwise returns false |
await pdfReaderRef.current?.isCropMode();
In the single page mode, set whether all pages keep the same width and the original page keeps the same width as readerView.
Parameters:
Name | Type | Description |
---|---|---|
isPageSameWidth | boolean | true: All pages keep the same width, the original state keeps the same width as readerView; false: Show in the actual width of page |
await pdfReaderRef.current?.setPageSameWidth(true);
Note: This method only supports the Android platform.
Gets whether the specified pageIndex
is displayed on the screen
Parameters:
Name | Type | Description |
---|---|---|
pageIndex | int | page index |
const isPageInScreen = await pdfReaderRef.current?.isPageInScreen(1);
Note: This method only supports the Android platform.
Sets whether to fix the position of the non-swipe direction when zooming in for reading.
Parameters:
Name | Type | Description |
---|---|---|
isFixedScroll | boolean | Whether to fix scrolling |
await pdfReaderRef.current?.setFixedScroll(true);
Note: This method only supports the Android platform.
Switch the mode displayed by the current CPDFReaderWidget.
Parameters:
Name | Type | Description |
---|---|---|
viewMode | CPDFViewMode | The view mode to display |
await pdfReaderRef.current?.setPreviewMode(CPDFViewMode.VIEWER);
Get the currently displayed mode.
Returns a Promise.
Name | Type | Description |
---|---|---|
viewMode | CPDFViewMode | Returns the currently displayed view mode |
const mode = await pdfReaderRef.current?.getPreviewMode();
Displays the thumbnail view. When [editMode] is true
, the page enters edit mode, allowing operations such as insert, delete, extract, etc.
Returns a Promise.
Name | Type | Description |
---|---|---|
editMode | boolean | Whether to enable edit mode |
await pdfReaderRef.current?.showThumbnailView(true);
Displays the BOTA view, which includes the document outline, bookmarks, and annotation list.
await pdfReaderRef.current?.showBotaView();
Displays the BOTA view, which includes the document outline, bookmarks, and annotation list.
await pdfReaderRef.current?.showAddWatermarkView();
Displays the document security settings view, allowing users to configure document security options.
await pdfReaderRef.current?.showSecurityView();
Displays the display settings view, where users can configure options such as scroll direction, scroll mode, and themes.
await pdfReaderRef.current?.showDisplaySettingView();
Enters snip mode, allowing users to capture screenshots.
await pdfReaderRef.current?.enterSnipMode();
Enters snip mode, allowing users to capture screenshots.
await pdfReaderRef.current?.exitSnipMode();
Jump to the index page.
Parameters:
Name | Type | Description |
---|---|---|
pageIndex | int | Jump to page number |
await pdfReaderRef.current?.setDisplayPageIndex(1);
get current page index.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
pageIndex | int | Returns the page index of the current document display |
const pageIndex = await pdfReaderRef.current?.getCurrentPageIndex();
function, optional
This function is called when the page number has been changed.
Parameters:
Name | Type | Description |
---|---|---|
pageNumber | int | the current page number |
<CPDFReaderView
onPageChanged={(pageIndex:number)=>{
}}
/>
Get the total number of pages in the current document
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
count | int | Get the total number of pages in the current document |
const pageCount = await pdfReaderRef.current?._pdfDocument.getPageCount();
Imports annotations from the specified XFDF file into the current PDF document.
Parameters:
Name | Type | Description |
---|---|---|
xfdfFile | string | Path of the XFDF file to be imported.The Android platform supports the following paths: - assets file:'file:///android_assets/test.xfdf'- **file path**: '/data/xxx.xfdf' - Uri: 'content://xxxx' |
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
result | boolean | true: import successful,``false: import failed. |
const result = await pdfReaderRef.current.importAnnotations('xxx.xfdf');
Exports annotations from the current PDF document to an XFDF file.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
xfdfPath | string | The path of the XFDF file if export is successful; an empty string if the export fails. |
const exportXfdfFilePath = await pdfReaderRef.current?.exportAnnotations();
Delete all comments in the current document.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
result | boolean | true、false |
const removeResult = await pdfReaderRef.current?.removeAllAnnotations();
Imports the form data from the specified XFDF file into the current PDF document.
The API only imports form data and modifies the form content through the corresponding form name.
Parameters:
Name | Type | Description |
---|---|---|
xfdfFile | string | Path of the XFDF file to be imported.The Android platform supports the following paths: - assets file:'file:///android_assets/test.xfdf' - file path: '/data/xxx.xfdf' - Uri: 'content://xxxx' |
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
result | boolean | true: import successful,``false: import failed. |
const result = await pdfReaderRef.current.importWidgets('xxx.xfdf');
exports the form data from the current PDF document to an XFDF file.
Returns a Promise.
Promise Parameters:
Name | Type | Description |
---|---|---|
xfdfPath | string | The path of the XFDF file if export is successful; an empty string if the export fails. |
const exportXfdfFilePath = await pdfReaderRef.current?.exportWidgets();
Checks if the PDF document is encrypted.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Is the current document encrypted |
const isEncrypted = await pdfReaderRef.current?._pdfDocument.isEncrypted();
Gets the current document's permissions.
There are three types of permissions:
No restrictions: CPDFDocumentPermissions.NONE
If the document has an open password and an owner password,using the open password will grant CPDFDocumentPermissions.USER
permissions, and using the owner password will grant CPDFDocumentPermissions.OWNER
permissions.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | CPDFDocumentPermissions | Gets the current document's permissions. |
const permissions = await pdfReaderRef.current?._pdfDocument.getPermissions();
Check if owner permissions are unlocked
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean |
const unlocked = await pdfReaderRef.current?._pdfDocument.checkOwnerUnlocked();
Whether the owner password is correct. If the password is correct, the document will be unlocked with full owner permissions.
Parameters:
Name | Type | Description |
---|---|---|
password | string | password The owner password to be verified. |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | A promise that resolves to true if the owner password is correct, otherwise false . |
const check = await pdfReaderRef.current?._pdfDocument.checkOwnerPassword('ownerPassword');
This method sets the document password, including the user password for access restrictions and the owner password for granting permissions.
Parameters:
Name | Type | Description |
---|---|---|
userPassword | string | The user password for document access restrictions. |
ownerPassword | string | The owner password to grant permissions (e.g., printing, copying). |
allowsPrinting | boolean | Whether printing is allowed (true or false). |
allowsCopying | boolean | Whether copying is allowed (true or false). |
encryptAlgo | CPDFDocumentEncryptAlgo | The encryption algorithm to use (e.g.,CPDFDocumentEncryptAlgo.rc4 ). |
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | A promise that resolves to true if the password is successfully set, otherwise false . |
const success = await pdfReaderRef.current?._pdfDocument.setPassword(
'user_password',
'owner_password',
false,
false,
CPDFDocumentEncryptAlgo.rc4
);
Remove the user password and owner permission password. set in the document, and perform an incremental save.
Returns a Promise.
Name | Type | Description |
---|---|---|
result | boolean | Returns true if password removal is successful, otherwise false . |
const check = await pdfReaderRef.current?._pdfDocument.checkOwnerPassword('ownerPassword');
Get the encryption algorithm of the current document
Returns a Promise.
Name | Type | Description |
---|---|---|
result | CPDFDocumentEncryptAlgo | Encryption Type |
const encryptAlgo = await pdfReaderRef.current?._pdfDocument.getEncryptAlgo();