Lompat ke konten utama
Kembali ke plugin
@capgo/capacitor-printer
Tutorial
@capgo/capacitor-printer

Cetak

Capacitor plugin untuk mencetak dokumen, HTML, PDF, gambar, dan tampilan web

Panduan

Tutorial pada Printer

Uji coba pada perangkat

Unduh aplikasi Capgo terlebih dahulu, kemudian scan kode QR code.

Tautan QR pratinjau plugin printer code

Menggunakan @capgo/capacitor-printer

Capacitor plugin untuk mencetak dokumen, HTML, PDF, gambar, dan tampilan web.

Pasang

bun add @capgo/capacitor-printer
bunx cap sync

Apa yang Dapat Diketahui Plugin Ini

  • printBase64 - Menampilkan antarmuka pencetakan untuk mencetak file yang dikodekan sebagai string base64.
  • printFile - Menampilkan antarmuka pencetakan untuk mencetak file perangkat.
  • printHtml - Menampilkan antarmuka pencetakan untuk mencetak dokumen HTML.
  • printPdf - Menampilkan antarmuka pencetakan untuk mencetak dokumen PDF.

Contoh Penggunaan

printBase64

Menampilkan antarmuka pencetakan untuk mencetak file yang dikodekan sebagai string base64.

import { Printer } from '@capgo/capacitor-printer';

// Print a base64 encoded PDF
await Printer.printBase64({
  name: 'Invoice #12345',
  data: 'base64-encoded-pdf-data',
  mimeType: 'application/pdf',
});

// Print a base64 encoded image
await Printer.printBase64({
  name: 'Product Photo',
  data: '/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDA...',
  mimeType: 'image/jpeg',
});

printFile

Presents the printing UI to print device files.

import { Printer } from '@capgo/capacitor-printer';

// iOS: Print from app documents directory
await Printer.printFile({
  name: 'Contract',
  path: 'file:///var/mobile/Containers/Data/Application/.../Documents/contract.pdf',
});

// Android: Print from content URI
await Printer.printFile({
  name: 'Receipt',
  path: 'content://com.android.providers.downloads.documents/document/123',
  mimeType: 'application/pdf',
});

// Android: Print from file path
await Printer.printFile({
  name: 'Photo',
  path: 'file:///storage/emulated/0/Download/photo.jpg',
  mimeType: 'image/jpeg',
});

printHtml

Presents the printing UI to print dokumen HTML.

import { Printer } from '@capgo/capacitor-printer';

// Simple HTML document
await Printer.printHtml({
name: 'Sales Report',
html: '<html><body><h1>Q4 Sales Report</h1><p>Revenue: $125,000</p></body></html>',
});

// HTML with print-specific CSS
await Printer.printHtml({
name: 'Styled Invoice',
html: `
<html>
<head>
<style>

printPdf

Presents the printing UI to print dokumen PDF.

import { Printer } from '@capgo/capacitor-printer';

// Print PDF from app storage
await Printer.printPdf({
  name: 'Annual Report 2024',
  path: 'file:///var/mobile/Containers/Data/Application/.../Documents/report.pdf',
});

// Print PDF from Android downloads
await Printer.printPdf({
  name: 'Downloaded Document',
  path: 'content://com.android.providers.downloads.documents/document/123',
});

Referensi Lengkap

Teruskan dari Menggunakan @capgo/capacitor-printer

Jika Anda menggunakan Menggunakan @capgo/capacitor-printer untuk merencanakan kerja plugin native, hubungkannya dengan @capgo/capacitor-printer untuk detail implementasi di @capgo/capacitor-printer, Mulai Membangun untuk detail implementasi di Mulai Membangun, Capgo Direktori Plugin untuk alur kerja produk di Capgo Direktori Plugin, Capacitor Plugin oleh Capgo untuk detail implementasi di Capacitor Plugin oleh Capgo, dan Menambahkan atau Mengupdate Plugin untuk detail implementasi di Menambahkan atau Mengupdate Plugin.