2016-06-22 5 views
10

아래 코드를 사용하여 HTML을 PDF로 그립니다. HTML을 장치로 렌더링 할 때 CSS 열을 사용하여 HTML을 두 개의 열로 배치하지만 PDF로 렌더링하면 열은 하나뿐입니다. 여러 열의 HTML을 PDF로 렌더링 할 수있는 방법이 있습니까? 나는 UIPrintPageRenderer이 열을 지원하지 않지만 그걸 확인하기 위해 아무것도 찾을 수 없다고 생각합니다.iOS 여러 열로 PDF를 HTML로 그리기

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에는 많은 pdf 작성자가 있으므로 열을 변경하려면 javascript를 사용해야 할 수도 있습니다. – Ruan33

관련 문제