html_to_pdf_plus 1.0.6 copy "html_to_pdf_plus: ^1.0.6" to clipboard
html_to_pdf_plus: ^1.0.6 copied to clipboard

Flutter plugin for generating PDF documents from HTML code templates

html_to_pdf_plus #

pub package

Flutter plugin for generating PDF files from HTML

Screenshots #

image

Usage #

 final htmlContent = """
    <!DOCTYPE html>
    <html>
      <head>
        <style>
        table, th, td {
          border: 1px solid black;
          border-collapse: collapse;
        }
        th, td, p {
          padding: 5px;
          text-align: left;
        }
        </style>
      </head>
      <body>
        <h2>PDF Generated with html_to_pdf_plus plugin</h2>
        
        <table style="width:100%">
          <caption>Sample HTML Table</caption>
          <tr>
            <th>Portfolio</th>
            <th>Link</th>
          </tr>
          <tr>
            <td>Website</td>
            <td><a href="https://khizarrehman.com/">https://khizarrehman.com/</a></td>
          </tr>
          <tr>
            <td>Fiverr</td>
            <td><a href="https://www.fiverr.com/ranakhizar">https://www.fiverr.com/ranakhizar</a></td>
         </tr>
        </table>
        
        <img src="https://avatars.githubusercontent.com/u/32544554?v=4" alt="web-img">
      </body>
    </html>
    """;

var targetPath = "/your/sample/path";
var targetFileName = "example_pdf_file";

final generatedPdfFile = await HtmlToPdf.convertFromHtmlContent(
  htmlContent: htmlContent,
  configuration: PdfConfiguration(
  targetDirectory: targetPath,
  targetName: targetFileName,
  printSize: PrintSize.A4,
  printOrientation: PrintOrientation.Landscape,
  linksClickable: true
));

Code above simply generates PDF file from HTML content. It should work with most of common HTML markers. You don’t need to add .pdf extension to targetFileName because plugin only generates PDF files and extension will be added automatically.

Other Usages

You can also pass File object with HTML content inside as parameter

var file = File("/sample_path/example.html");
var generatedPdfFilee = await HtmlToPdf.convertFromHtmlFile(
  htmlFile: file,
  configuration: PdfConfiguration(
  targetDirectory: targetPath,
  targetName: targetFileName,
  printSize: PrintSize.A4,
  printOrientation: PrintOrientation.Portrait,
  linksClickable: true
));

or even just path to this file

var filePath = "/sample_path/example.html";
var generatedPdfFilee = await HtmlToPdf.convertFromHtmlFilePath(
  htmlFilePath: filePath,
  configuration: PdfConfiguration(
  targetDirectory: targetPath,
  targetName: targetFileName,
  printSize: PrintSize.A4,
  printOrientation: PrintOrientation.Portrait,
  linksClickable: true
));

Images

If your want to add local image from device to your HTML you need to pass path to image as src value.

<img src="file:///storage/example/your_sample_image.png" alt="web-img">

or if you want to use the image File object

<img src="${imageFile.path}" alt="web-img">

Many images inside your document can significantly affect the final file size so I suggest to use flutter_image_compress plugin.

17
likes
150
points
1.88k
downloads

Publisher

verified publisherkhizarrehman.com

Weekly Downloads

Flutter plugin for generating PDF documents from HTML code templates

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on html_to_pdf_plus