Question

我使用下面的代码将HTML绘制为PDF。当HTML呈现给设备时，我使用css列将HTML布局在两列中，但是当它呈现为PDF时，它只在一列中。有没有办法可以将多列中的HTML呈现为PDF？我猜测UIPrintPageRenderer不支持列，但无法找到任何可以确认的内容。

我使用css列的原因是内容的长度可变，我希望它动态地溢出到下一列。

这是我的代码。 content是包含HTML的String。我将完全相同的字符串发送到UIWebView.loadHTMLString(_:baseURL:)，然后呈现两列。

    let renderer = UIPrintPageRenderer()
    renderer.headerHeight = 36
    renderer.footerHeight = 36

    let htmlFormatter = UIMarkupTextPrintFormatter(markupText: content)
    htmlFormatter.startPage = 0
    htmlFormatter.contentInsets = UIEdgeInsetsMake(0, 36, 0, 36)
    renderer.addPrintFormatter(htmlFormatter, startingAtPageAtIndex: 0)

    let paperRect = CGRectMake(0, 0, 612, 792)
    let printableRect = CGRectInset(paperRect, 0, 0)
    renderer.setValue(NSValue.init(CGRect: paperRect), forKey: "paperRect")
    renderer.setValue(NSValue.init(CGRect: printableRect), forKey: "printableRect")

    let pdfData = NSMutableData()
    UIGraphicsBeginPDFContextToData(pdfData, CGRectZero, metadata)

    for i in 0 ..< renderer.numberOfPages() {
        UIGraphicsBeginPDFPage()
        let bounds = UIGraphicsGetPDFContextBounds()
        renderer.drawPageAtIndex(i, inRect: bounds)
    }
    UIGraphicsEndPDFContext()

用于呈现适用于UIWebView.loadHTMLString(_:baseURL:)但不适用于PDF的列的CSS如下所示。我将@media位仅显示在较小屏幕上的单个列中。但是，我已尝试删除此内容并添加@media print部分无效：它仍然只打印为PDF的单个列。

    .content {
        -webkit-columns: auto 2; /* Chrome, Safari, Opera */
        -moz-columns: auto 2; /* Firefox */
        columns: auto 2;
    }
    @media screen and (max-width: 736px) {
        .content {
            width: 100%;
            -webkit-columns: auto 1; /* Chrome, Safari, Opera */
            -moz-columns: auto 1; /* Firefox */
            columns: auto 1;
        }
    }

Answer 1

尝试执行此操作而不是css列尝试使用html列，然后使用css设置列的样式。我认为UIGraphics只会抓取HTML结构。

<table>
  <tr>
     <td>YourStuffHere</td>
     <td>YourStuffHere</td>
  </tr>
 </table>

iOS在多列中将HTML绘制为PDF

1 个答案: