Blurry UILabel

[moshegutman]

When using a UILabel and the alignment frame isn't placed on an integer value, the text can appear blurry.

I solved this by adjusting the return CGRect inside the Alignment constructor. I added a call to .integral

public init(vertical: Vertical, horizontal: Horizontal) {
        self.aligner = { (size: CGSize, rect: CGRect) -> CGRect in
            let (x, width) = horizontal.align(length: size.width, availableLength: rect.width, offset: rect.origin.x)
            let (y, height) = vertical.align(length: size.height, availableLength: rect.height, offset: rect.origin.y)
            return CGRect(x: x, y: y, width: width, height: height).integral
        }
    }

Not sure if this should be classified as a bug

[moshegutman]

A reference to a similar issue on StackOverflow: https://stackoverflow.com/questions/8065892/blurry-uilabel-when-added-programmatically

[staguer]

I think this qualifies as a bug, thanks for reporting, @moshegutman . I noticed that we have roundedUpToFractionalPoint in CGFloatExtension.swift, that would make smaller adjustments to the rectangles. Another issue to consider is whether two adjacent rectangles that are adjusted to fall on pixel boundaries do indeed remain adjacent after the adjustment to make sure that a background color doesn't start showing through underneath.

[moshegutman]

Following your advice, I went with this:

public init(vertical: Vertical, horizontal: Horizontal) {
        self.aligner = { (size: CGSize, rect: CGRect) -> CGRect in
            let (x, width) = horizontal.align(length: size.width, availableLength: rect.width, offset: rect.origin.x)
            let (y, height) = vertical.align(length: size.height, availableLength: rect.height, offset: rect.origin.y)
            return CGRect(x: x.roundedToFractionalPoint, y: y.roundedToFractionalPoint, width: width.roundedToFractionalPoint, height: height.roundedToFractionalPoint)
        }
    }