Guides

显示模式

滚动方向

页面滚动方向可以是水平或垂直。

如果 verticalMode 是 true，表示是垂直滚动；否则，是水平滚动。

let config = ComPDFKit.getDefaultConfig({
  readerViewConfig: {
    verticalMode: true
  }
});
ComPDFKit.openDocument(_document, '', config);

// CPDFReaderWidget 示例
const pdfReaderRef = useRef<CPDFReaderView>(null);

<CPDFReaderView
  ref={pdfReaderRef}
  document={samplePDF}
  onSaveDocument={saveDocument}
  configuration={config}/>

您还可以通过API设置滚动方向：

await pdfReaderRef.current?.setVerticalMode(true);

显示模式

页面显示模式可以是 单页模式、双页模式 或 封面模式。

let config = ComPDFKit.getDefaultConfig({
  readerViewConfig: {
    displayMode: CPDFDisplayMode.DOUBLE_PAGE
  }
});
ComPDFKit.openDocument(_document, '', config);

// CPDFReaderWidget 示例
const pdfReaderRef = useRef<CPDFReaderView>(null);

<CPDFReaderView
  ref={pdfReaderRef}
  document={samplePDF}
  onSaveDocument={saveDocument}
  configuration={config}/>

通过API设置显示模式：

• 单页模式

await pdfReaderRef.current?.setDoublePageMode(false);

• 双页模式

await pdfReaderRef.current?.setDoublePageMode(true);

• 封面模式

await pdfReaderRef.current?.setCoverPageMode(true);

滚动模式

滚动模式可以设置为连续滚动或翻页滚动模式。当 continueMode 为 true 时，表示连续滚动；否则，是翻页滚动。

let config = ComPDFKit.getDefaultConfig({
  readerViewConfig: {
    continueMode: true
  }
});
ComPDFKit.openDocument(_document, '', config);

// CPDFReaderWidget 示例
const pdfReaderRef = useRef<CPDFReaderView>(null);

<CPDFReaderView
  ref={pdfReaderRef}
  document={samplePDF}
  onSaveDocument={saveDocument}
  configuration={config}/>

通过API设置滚动模式：

await pdfReaderRef.current?.setContinueMode(true);

裁剪模式

在裁剪 PDF 周围的空白区域后显示文档时，当 cropMode 为 true 时，表示启用了裁剪模式；否则，未裁剪。

let config = ComPDFKit.getDefaultConfig({
  readerViewConfig: {
    cropMode: true
  }
});
ComPDFKit.openDocument(_document, '', config);

// CPDFReaderWidget 示例
const pdfReaderRef = useRef<CPDFReaderView>(null);

<CPDFReaderView
  ref={pdfReaderRef}
  document={samplePDF}
  onSaveDocument={saveDocument}
  configuration={config}/>

通过API设置裁剪模式：

await pdfReaderRef.current?.setCropMode(true);