打印UIWebView时出现意外的分页符

Jak*_*ano 14 html pdf-generation uiwebview ios uiprintformatter

TLDR:如果您打印UIWebView包含HTML由文本对齐元素含量right/ center,导致文档中就有出乎意料的大底边距页.

我遇到了这个问题,当我无法谷歌任何有类似问题的人时,我感到非常惊讶.我已经提交了雷达与苹果(#20760071),并创建了一个问题ResearchKit的GitHub库,因为这会影响他们ORKHTMLPDFWriter.

AFAIK这也影响到所有使用库UIWebView转换HTMLPDF,我已经测试:

我想知道是否有人能想出一些解决方法.

如何重现:

NSMutableString* html = [NSMutableString string];
[html appendString:@"<html><body>"];
for (int i=0; i<200; i++) {
    [html appendString:@"<div align=\"right\">line</div>"];
}
[html appendString:@"</body></html>"];

UIPrintInteractionController* pc = [UIPrintInteractionController sharedPrintController];

UIPrintInfo* printInfo = [UIPrintInfo printInfo];
printInfo.outputType = UIPrintInfoOutputGrayscale;

pc.printInfo = printInfo;
pc.showsPaperSelectionForLoadedPapers = YES;

UIWebView* web = [UIWebView new];
[web loadHTMLString:html baseURL:nil];
pc.printFormatter = web.viewPrintFormatter;

[pc presentAnimated:YES completionHandler:^(UIPrintInteractionController *printInteractionController, BOOL completed, NSError *error) {
    NSLog(@"%d -- %@",completed, error);

}];
Run Code Online (Sandbox Code Playgroud)

您还可以克隆演示此问题的项目ResearchKit.


编辑 - 有些可用的解决方法:

知道内容的特定宽度(例如图像),可以在不指定文本对齐的情况下对齐它,例如:

使用自动边距:

<div>
    <div style="width:200px; margin-left:auto; margin-right:0px;">
        content
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

浮动列:

<div>
    <div style="width:200px; float:right;">
        content
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

但是,以上都没有用于对齐变长文本,这是我关注的主要用例.

小智 4

瓦诺,

经过一些测试后我想出的解决方案是添加以下带有文本对齐的 CSS 规则。

display: -webkit-box;
display: -webkit-flex;
display: flex;
justify-content: flex-end;
-webkit-justify-content: flex-end;
text-align:right;
Run Code Online (Sandbox Code Playgroud)