IOS Рисунок HTML для PDF в нескольких столбцах

Я рисую HTML в PDF, используя следующий код. Когда HTML отображается на устройство, я использую столбцы css для компоновки HTML в двух столбцах, но когда он отображает PDF, он находится только в одном столбце. Есть ли способ показать HTML в нескольких столбцах как PDF? Я предполагаю, что UIPrintPageRenderer не поддерживает столбцы, но не может найти ничего, чтобы подтвердить это.

Причина, по которой я использую столбцы css, заключается в том, что содержимое переменной длины, и я хочу, чтобы он переполнялся до следующего столбца динамически.

Вот мой код. content - это String, содержащий HTML. Я отправляю ту же строку в 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()

CSS для рендеринга в столбцах, который работает для UIWebView.loadHTMLString(_:baseURL:), но не для PDF, приведен ниже. У меня бит @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