Swift-将图像插入PDF不再适用于iOS 13 [英] Swift - Inserting image onto PDF no longer working on iOS 13
问题描述
当前正在使用一项功能，可以在我的贷款计算器应用中导出PDF。我有一个预览屏幕，在保存之前会显示PDF。预览屏幕由包含占位符的html组成的webView组成。我能够成功地将图像插入正确的占位符，并将其显示在PDF上。但是在iOS 13上，该图像不再显示或显示得太小。
Currently working on a feature to export a PDF on my loan calculator app. I have a preview screen that'll show the PDF before you save it. The preview screen composes of a webView with html that contain placeholders. I was able to successfully insert an image onto the correct placeholder and have it display onto the PDF. But with iOS 13, the image no longer shows or it displays too small.
LineGraph.html
LineGraph.html
<div class ="line-graph">
<center class = "graph-header">Amortization Line Chart</center>
<img class = "image" src="data:image/png;base64,#ImageData#" alt="Line Graph">
</div>
将图像转换为Base-64编码的字符串并将其放置在#ImageData＃
Code that converts the image to Base-64 encoded string and place it in #ImageData#
let isLineGraphSelected = lineGraphDictionary[.isSelectedString] as! Bool
self.lineGraphSnapshot = lineGraphDictionary[.snapshotString] as? UIImage
if isLineGraphSelected && self.lineGraphSnapshot != nil{
let data = self.lineGraphSnapshot.pngData()
if let imageITData = data?.base64EncodedString() {
LineGraphHTMLContent = LineGraphHTMLContent.replacingOccurrences(of: "#ImageData#", with: imageITData)
}
} else {
LineGraphHTMLContent = ""
}
让我知道您是否需要更多背景信息。
Let me know if you need more context.
屏幕截图：
iOS 12.1
< a href = https://i.stack.imgur.com/DUoxR.png rel = nofollow noreferrer>
iOS 13.0
这是我的其他HTML文件，用于完整上下文
Here's my other HTML files for full context
PDFSheet.HTML
PDFSheet.HTML
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
.loan-box {
max-width: 800px;
margin: auto;
padding: 30px;
border: 1px solid #d9d9d9;
font-size: 16px;
line-height: 24px;
font-family: 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
color: #555;
}
.graph-header {
margin: auto;
font-size: 45px;
line-height: 45px;
padding: 30px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
color: #333;
}
.line-graph {
max-width: 800px;
margin: auto;
padding: 30px;
}
.loan-box table {
width: 100%;
line-height: inherit;
text-align: left;
}
.loan-box table td {
padding: 5px;
vertical-align: top;
}
.loan-box table tr td:nth-child(2) {
text-align: right;
}
.loan-box table tr.top table td {
padding-bottom: 20px;
width: 100%;
display: block;
text-align: center;
}
.loan-box table tr.top table td.title {
font-size: 45px;
line-height: 45px;
color: #333;
}
.loan-box table tr.top table td.date {
font-size: 24px;
}
.loan-box table tr.heading td {
background: #eee;
border-bottom: 1px solid #ddd;
font-weight: bold;
}
.loan-box table tr.item td{
border-bottom: 1px solid #eee;
}
.loan-box table tr.item.last td {
padding-bottom: 20px;
border-bottom: none;
}
.loan-box table tr.item.last.results td{
font-weight: bold;
}
.line-graph img {
display: block;
max-width: 800px;
width: auto;
height: auto;
}
* RTL *
.rtl {
direction: rtl;
font-family: Tahoma, 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
}
.rtl table {
text-align: right;
}
.rtl table tr td:nth-child(2) {
text-align: left;
}
</style>
</head>
<body>
#RESULTS#
#LINE_GRAPH#
</body>
</html>
Results.HTML
Results.HTML
<div class="loan-box">
<table cellpadding="0" cellspacing="0">
<tr class="top">
<td colspan="2">
<table>
<tr>
<td class="title">
#LOAN_NAME#
</td>
<td class="date">
#DATE_CREATED#
</td>
</tr>
</table>
</td>
</tr>
<tr class="heading">
<td>
Loan information
</td>
<td></td>
</tr>
<tr class="item">
<td>
Loan amount
</td>
<td>
#LOAN_AMOUNT#
</td>
</tr>
<tr class="item">
<td>
Interest rate
</td>
<td>
#INTEREST_RATE#
</td>
</tr>
<tr class="item">
<td>
Number of payments
</td>
<td>
#NUM_OF_PAYMENTS#
</td>
</tr>
<tr class="item">
<td>
Extra payments
</td>
<td>
#EXTRA_PAYMENTS#
</td>
</tr>
<tr class="item last">
<td>
Estimated payoff date
</td>
<td>
#PAYOFF_DATE#
</td>
</tr>
<tr class="heading">
<td>
Results
</td>
<td></td>
</tr>
<tr class="item">
<td>
Monthly Payments
</td>
<td>
#MONTHLY_PAYMENTS#
</td>
</tr>
<tr class="item">
<td>
Total interest
</td>
<td>
#TOTAL_INTEREST#
</td>
</tr>
<tr class="item">
<td>
Interest Savings
</td>
<td>
#INTEREST_SAVINGS#
</td>
</tr>
<tr class="item">
<td>
Time saved
</td>
<td>
#TIME_SAVED#
</td>
</tr>
<tr class="item last results">
<td>
Total loan amount
</td>
<td>
#TOTAL_LOAN#
</td>
</tr>
</table>
</div>
我使用的功能也可能捕获图像受到iOS 13的影响。我注意到，当我在CSS中将图像的宽度增加到惊人的程度时，图像的分辨率很低。这使我认为在iOS 13中生成的图像非常小。为什么？我没有虔诚的主意。
It also can be possible that the function I used to capture the image was affected in iOS 13. I noticed that when I increase the width of the image to a crazy amount in my CSS, the image was very low res. This makes me think that the image being generated is very small in iOS 13. Why? I have no godly idea.
func takeScreenshot() -> UIImage {
// Begin context
UIGraphicsBeginImageContextWithOptions(self.bounds.size, false, UIScreen.main.scale)
// Draw view in that context
drawHierarchy(in: self.bounds, afterScreenUpdates: true)
// And finally, get image
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
if (image != nil)
{
return image!
}
return UIImage()
}
新发现
我认为问题出在上面的takeScreenshot函数中。我打印出了图像变量，这就是我发现的结果。
I believe the issue is in the takeScreenshot function above. I printed out the image variable and this is what I found.
iOS 12
Optional(<UIImage: 0x6000016fc070> size {575.33333333333337, 350} orientation 0 scale 3.000000)
iOS 13
Optional(<UIImage:0x6000013637b0 anonymous {575.33333333333337, 350}>)
为什么用匿名代替尺寸，为什么缺少方向和尺寸？如果我能回答这个问题，那么我可以解决这个烦人的问题。
Why did size got replaced with anonymous and why are orientation and scale missing? If I can answer this then I can solve this annoying issue.
已解决
I发现了问题。我的解决方案发布在下面。
I found the issue. My solution is posted below.
推荐答案
我解决了这个问题。
我用draw替换了drawHierarchy。
I replaced drawHierarchy with draw.
func takeScreenshot() -> UIImage {
// Begin context
print(UIScreen.main.scale)
print(self.bounds.size)
UIGraphicsBeginImageContextWithOptions(self.bounds.size, false, UIScreen.main.scale)
// Draw view in that context
draw(self.bounds) //drawHierarchy(in: self.bounds, afterScreenUpdates: true)
// And finally, get image
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
print(image)
if (image != nil)
{
return image!
}
return UIImage()
}
我不是完全确定为什么这样做有效，所以如果有人能启发我，那就太好了。
I am not entirely sure why that worked so if anyone could enlighten me that'll be great.
这篇关于Swift-将图像插入PDF不再适用于iOS 13的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
