Skip to content
DemoAPI 参考文档FAQ

PDF 生成模板编辑器

开源可视化 PDF 生成引擎,支持自定义模板,并提供面向开发者的 API,灵活构建文档生成流程。

查看 GitHub
Guides

添加文本水印

ComPDF 支持 两种方式 添加文本水印:

编程方式

通过 createTextWatermarkdocument.createWatermark 创建文本水印,适合需要在代码中自动生成水印的场景。

tsx
import {
  CPDFReaderView,
  createTextWatermark,
} from "@compdfkit_pdf_sdk/react_native";

const pdfReaderRef = useRef<CPDFReaderView>(null);

const addTextWatermark = async () => {
  const result = await pdfReaderRef.current?._pdfDocument.createWatermark(
    createTextWatermark({
      textContent: "ComPDF",
      pages: [0, 1, 2, 3],
      textColor: "#FF0000",
      fontSize: 60,
      scale: 1,
      rotation: 0,
      opacity: 1,
      horizontalAlignment: "center",
      verticalAlignment: "center",
    })
  );

  console.log("Add text watermark result:", result);
};

UI 弹窗方式

ComPDF React Native SDK 也支持通过 UI 交互形式添加文本水印,在 CPDFConfiguration 中配置水印默认样式,例如默认文本、颜色、字体大小。

tsx
// 在配置中设置默认文本水印样式
ComPDFKit.getDefaultConfig({
  global: {
    watermark: {
      types: ['text', 'image'],
      text: 'ComPDF-RN',
      textColor: '#000000',
      textSize: 36,
      rotation: -45,
      opacity: 255,
    }
  }
})

// 通过API打开添加水印弹窗
await pdfReaderRef.current?.showAddWatermarkView({
  types: ['text', 'image'],
  text: 'ComPDF RN',
  textColor: '#000000',
  textSize: 36,
  rotation: -45,
  opacity: 255,
});