Images not working

[jberkhei]

Cannot get a base64 image to render nor an image on the local device. If I log the generated HTML and open in Safari both base64 & local images work. When I save this HTML to a pdf the images are not rendered

[NGromann]

Hi @jberkhei! Could you share the code snippet that you have tried? I just tried the following inside the example project:

<img src="data:image/png;base64,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" alt="example logo" />

This seems to be working. The image is shown in the top right:

[jberkhei]

That's in the preview mode, not the actual PDF. When PDF'd, images do not appear because UISimpleTextPrintFormatter does not support images. You need to use WKWebView instead. Example below:

import Foundation import WebKit

typealias ExportManagerCompletion = (NSData) -> Void

class ExportManager: NSObject, WKNavigationDelegate { var webView: WKWebView? = nil var completion: ExportManagerCompletion!

func exportPDF(html: String, completion: @escaping ExportManagerCompletion) throws {
    self.completion = completion

    let webView = WKWebView()
    webView.navigationDelegate = self
    webView.loadHTMLString(html, baseURL: nil)
    self.webView = webView
}
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
    let formatter = webView.viewPrintFormatter()
    createPDF(formatter)
}

func createPDF(_ formatter: UIViewPrintFormatter) {
  let render = UIPrintPageRenderer()
  render.addPrintFormatter(formatter, startingAtPageAt: 0)

  let paperRect = CGRect(x: 0, y: 0, width: 595.2, height: 841.8)
  render.setValue(paperRect, forKey: "paperRect")
  let padding: CGFloat = 24
  let printableRect = paperRect.insetBy(dx: padding, dy: padding)
  render.setValue(printableRect, forKey: "printableRect")

  let pdfData = NSMutableData()
  UIGraphicsBeginPDFContextToData(pdfData, .zero, nil)
  for i in 0..<render.numberOfPages {
      UIGraphicsBeginPDFPage();
      render.drawPage(at: i, in: UIGraphicsGetPDFContextBounds())
  }
  UIGraphicsEndPDFContext();

  self.completion?(pdfData)
}

}

[NGromann]

The example I showed also works in the exported PDF:

Could you share an example of the HTML including the base64 image?