TPPDF icon indicating copy to clipboard operation
TPPDF copied to clipboard

PDFSectionColumn backgroundColor cover the content on text with line breaks

Open omiz opened this issue 5 years ago • 1 comments

The size of the column is not calculated properly and the background is covering the content.

I tried to check by setting a color with alpha and it seems like the background is drawn twice or it's sliced and the second time it's rendered it's on top.

The other issue that might be related to this is when a padding is added if a background is set then there seems to be an extra space at the bottom. this does not happen if the background is not set.

here is an example code to reproduce the issue

import Foundation
import TPPDF
import CoreGraphics
import UIKit

class ColumnHeightExample: ExampleFactory {
    
    func generateDocument() -> [PDFDocument] {
        
        let document = PDFDocument(format: .a4)
        
        document.appendSectionedText(
            leading: "some text goes here as a leading text",
            trailing: "some text goes here as a trailing text"
        )
        
        return [document]
    }
}

extension PDFDocument {
    
    static var defaultPadding: CGFloat { 5 }
    
    var defaultPadding: CGFloat { TPPDF.PDFDocument.defaultPadding }
    
    var leadingSectionRatio: CGFloat { 0.4 }
    var trailingSectionRatio: CGFloat { 1 - leadingSectionRatio }
    
    func addDefaultSpacing(multipliedBy multiplier: CGFloat = 1, into container: PDFContainer = .contentLeft) {
        
        add(container, space: defaultPadding * multiplier)
    }
    
    func addDefaultFullWidthSeparator() {
        
        let separatorColor = UIColor.lightGray.withAlphaComponent(0.5)
        
        let style = PDFLineStyle(
            type: .full,
            color: separatorColor,
            width: 0.1
        )
        
        addLineSeparator(style: style)
    }
    
    func appendSectionedText(leading title: String, trailing detail: String) {
        
        let attributedTitle = NSAttributedString(
            string: title,
            attributes: [.font : UIFont.systemFont(ofSize: 12.0, weight: .bold)]
        )
        
        let attributedDetail = NSAttributedString(
            string: detail,
            attributes: [.font : UIFont.systemFont(ofSize: 12.0)]
        )
        
        let mainSection = PDFSection(
            columnWidths: [leadingSectionRatio, trailingSectionRatio]
        )
        
        let leadingColumn = mainSection.columns.first
        let tailingColumn = mainSection.columns.last
        
        leadingColumn?.appendPaddedAttributedText(attributedTitle)
        tailingColumn?.appendPaddedAttributedText(attributedDetail)
        
        leadingColumn?.backgroundColor = UIColor(red: 0.91, green: 0.91, blue: 0.91, alpha: 1.00)
        tailingColumn?.backgroundColor = UIColor(red: 0.97, green: 0.97, blue: 0.97, alpha: 1.00)
        
        add(section: mainSection)
    }
}


extension TPPDF.PDFSectionColumn {
    
    static var defaultPadding: CGFloat { TPPDF.PDFDocument.defaultPadding }
    
    var defaultPadding: CGFloat { TPPDF.PDFSectionColumn.defaultPadding }
    
    func appendDefaultSpacing(multipliedBy multiplier: CGFloat = 1, into container: PDFSectionColumnContainer = .left) {
        
        add(container, space: defaultPadding * multiplier)
    }
    
    func appendPaddedAttributedText(_ attributedText: NSAttributedString?, into container: PDFSectionColumnContainer = PDFSectionColumnContainer.left) {
        
        guard let attributedText = attributedText else { return }
        
        appendDefaultSpacing(multipliedBy: 1)
        
        set(indent: defaultPadding, left: true)
        set(indent: defaultPadding, left: false)
        
        add(container, attributedText: attributedText)
        
        appendDefaultSpacing(multipliedBy: 1)
    }
}

The code above would generate this:

Screen Shot 2020-10-06 at 9 34 46 AM

TPPDF version used is 2.3.1 Xcode Version 12.0.1 Apple Swift version 5.3

omiz avatar Oct 06 '20 07:10 omiz

Oh this is weird, AFAIK I did have to add some kind of slicing logic because of different element heights, but this seems like an edge case.

Thanks a lot for the full working reproduction sample

philprime avatar Oct 12 '20 18:10 philprime