Générer un PDF dans ElectronJS

Electron est un framework populaire pour créer des applications de bureau multiplateformes à l'aide de JavaScript, HTML et CSS.

Dans cet article, nous explorerons comment générer des fichiers PDF dans Electron à l'aide de la bibliothèque jsPDF. Nous aborderons les bases de la génération de PDF, comment installer et utiliser la bibliothèque jsPDF et comment personnaliser l'apparence et le contenu des PDF.

PDF signifie Portable Document Format. PDF est un format de fichier utilisé pour représenter des documents, indépendant du système d'exploitation, du logiciel et du matériel utilisés pour créer le document. Les fichiers PDF peuvent être ouverts et visualisés sur n'importe quel appareil doté d'un lecteur PDF et sont souvent utilisés pour partager des documents et des données.

PDF développé par Adobe Systems.

Les fichiers PDF peuvent contenir une variété de contenus, notamment du texte, des images, des tableaux et d'autres données, et peuvent être personnalisés à l'aide de fonctionnalités telles que la mise en page, les marges, les en-têtes et les pieds de page.

Générer des fichiers PDF dans Electron

La bibliothèque

jsPDF, un framework populaire et facile à utiliser pour créer des fichiers PDF en JavaScript, sera utilisée pour créer des fichiers PDF dans Electron.

Exécutez la commande suivante dans une fenêtre de terminal pour installer la bibliothèque jsPDF -

npm install jspdf

Nous pouvons exploiter cette bibliothèque pour générer des fichiers PDF en l'exigeant dans notre application Electron après l'installation et en créant un nouveau fichier PDF à l'aide de la fonction "jsPDF" Object() { [code natif] }.

Voici un exemple de création d'un simple fichier PDF contenant une seule page de texte -

const { jsPDF } = require("jspdf");
const doc_file = new jsPDF();
doc_file.text('Welcome Home!', 15, 15);
doc_file.save('demo_document.pdf');

En exécutant ce code, un nouveau document PDF sera créé, le mot "Hello, World!" sera ajouté au document et le document sera enregistré dans le répertoire actuel sous le nom de "document.pdf".

Personnaliser l'apparence et le contenu du PDF

Le package

jsPDF offre de nombreuses options pour modifier l'apparence du PDF. Par exemple, nous pouvons personnaliser la taille de la page, les marges, les polices du PDF et ajouter des photos et des tableaux.

Taille de la page

Pour définir la taille de la page, nous pouvons utiliser la méthode "setProperties", qui nous permet de spécifier la taille de la page et l'orientation du PDF -

const jsPDF = require('jspdf');
const doc_file = new jsPDF();
doc_file.setProperties({
   title: 'New Doc File',
   subject: 'Creating text document',
   author: 'Prerna Tiwari',
   keywords: 'text, document, PDF',
   creator: 'New Text'
});
doc_file.text('Welcome Home!', 10, 10);
doc_file.save('demo_document.pdf');

Marge

Pour définir les marges d'un PDF, nous pouvons utiliser la méthode "setMargins", qui nous permet de spécifier les marges supérieure, inférieure, gauche et droite du PDF en points (1/72 pouces) -

const jsPDF = require('jspdf');
const doc_file = new jsPDF();
doc_file.setMargins(5, 5, 5, 5);
doc_file.text('Welcome Home!', 5, 5);
doc_file.save('demo_document.pdf');

Police

Pour définir la police d'un PDF nous pouvons utiliser la méthode "setFont" qui nous permet de spécifier la famille, la taille et le style de la police -

const jsPDF = require('jspdf');
const doc_file = new jsPDF();
doc_file.setFont('Times New Roman', 'Italics');
doc_file.text('Welcome Home!', 10, 10);
doc_file.save('demo_document.pdf');

Ajouter une image

Pour ajouter une image à un PDF nous pouvons utiliser la méthode "addImage" qui nous permet de spécifier le fichier image, l'emplacement et la taille -

const jsPDF = require('jspdf');
const doc_file = new jsPDF();
doc_file.addImage(imageData, 'PNG', 15, 15, 150, 160);
doc_file.save('demo_document.pdf');

Ce code ajoutera une image JPEG à un fichier PDF à l'emplacement et à la taille spécifiés.

Ajouter un formulaire

Pour ajouter un tableau au PDF, nous pouvons utiliser la méthode "autoTable" qui nous permet de spécifier les données du tableau, les colonnes et les options de mise en page -

const jsPDF = require('jspdf');
const doc_file = new jsPDF();
const tableData = [
   ['Name', 'Age', 'City'],
   ['John', '30', 'New York'],
   ['Jane', '25', 'Chicago'],
   ['Bob', '35', 'Los Angeles'] 
];
doc_file.autoTable({
   head: [['Name', 'Age', 'City']],
   body: tableData
});
doc+_file.save('demo_document.pdf');

Ce code ajoutera un tableau avec le titre et les données spécifiés au PDF.

Conclusion

Dans ce tutoriel, nous avons vu comment créer des fichiers PDF dans Electron à l'aide du package jsPDF. Les bases de la création de PDF, l'installation et l'utilisation de la bibliothèque jsPDF, ainsi que la manière de modifier l'apparence d'un PDF sont toutes abordées.

En utilisant le module jsPDF, vous pouvez facilement créer des fichiers PDF dans Electron et modifier leur apparence et leur contenu en fonction des exigences de votre application. Pour partager des documents et des données, les fichiers PDF constituent une option pratique et bien prise en charge qui peut être utilisée dans diverses applications.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!