2016-06-22 14 views
10

我使用下面的代碼將HTML繪製爲PDF。當HTML呈現給設備時,我使用css列來將HTML分成兩列,但當它呈現爲PDF時,它只能在一列中顯示。有沒有一種方法可以將多個列中的HTML呈現爲PDF?我猜UIPrintPageRenderer不支持列,但找不到任何東西來確認。iOS在多欄中將HTML繪製爲PDF

我使用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; 
     } 
    } 
+1

你可以分享你的源代碼嗎?即使只有一些源代碼片段。 – ylgwhyh

+0

@ylgwhyh我在上面添加了我的代碼。 – SeanR

+0

嘗試在每個css列值的末尾添加'!important'?可能它被覆蓋... – hakJav

回答

1

嘗試這樣做,而不是css列嘗試使用html列,只是樣式使用css列。我認爲UIGraphics將只抓取HTML結構。

<table> 
    <tr> 
    <td>YourStuffHere</td> 
    <td>YourStuffHere</td> 
    </tr> 
</table> 
+0

我希望列能夠流動取決於內容。對不起,我應該在問題中澄清。我現在編輯它。 – SeanR

+0

您可能必須使用javascript來更改列,因爲JavaScript有很多PDF編寫器。 – Ruan33