Блог

[

Я хочу создать идеальный пользовательский интерфейс. Мой дизайнер дал мне несколько требований к определенному шрифту. Я пытаюсь их реализовать, но столкнулся с некоторыми проблемами с ParagraphStyle. Все начальные линии текста должны располагаться на сетке. При установке максимальной высоты строки для моего заголовка на 24 (сетка 2x) все в порядке. Однако для моего основного текста требуется высота строки 16. При этом отсекается верхняя часть первой строки.

Я попытался установить высоту метки, это просто добавляет конфликты компоновки. Я попытался установить ограничение firstBaseline на сетку, удаленную от его собственной вершины. Безрезультатно. Я также переопределил метод рисования UILabel, чтобы добавить дополнительное заполнение сверху. Однако это отменяет использование ограничения fristBaseline в моем коде любым дополнением, которое я добавил. Очень грязный и только последнее средство.

 import Foundation

public class UILabelBody: UILabel  {


    override public var text: String? {
        didSet {
            let attributedString = NSMutableAttributedString(string: self.text!)
            let paragraphStyle = NSMutableParagraphStyle()
            paragraphStyle.maximumLineHeight = 16

            attributedString.addAttributes([
                NSAttributedString.Key.kern: 0.4,
                NSAttributedString.Key.paragraphStyle : paragraphStyle],
                                           range: NSMakeRange(0, attributedString.length))
            self.attributedText = attributedString
        }
    }

    public init() {
        super.init(frame: CGRect.zero)
        self.translatesAutoresizingMaskIntoConstraints = false
        setup()
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    private func setup() {
        self.font = UIFont(name: "Oxygen", size: 16)
        self.textColor = UIColor(hexString: "1F1F1F")
    }
}
  

Вот класс, для которого я установил ограничения:
настройка частной функции () {

     self.addSubview(contentBox)
    self.addSubview(imageView)
    self.addSubview(title)
    self.addSubview(body)


    imageView.backgroundColor = UIColor.yellow.withAlphaComponent(0.8)
    contentBox.backgroundColor = UIColor.red.withAlphaComponent(0.1)
    title.backgroundColor = UIColor.orange.withAlphaComponent(0.2)

    let padding = Layout.grid(1.5)

    let highPriority = UILayoutPriority(1000)
    let lowPrioririty = UILayoutPriority(100)

    let titleFirstBaseline = title.firstBaselineAnchor.constraint(equalTo: contentBox.topAnchor, constant: Layout.grid(2.5))
    let bodyFirstBaseLine =  body.firstBaselineAnchor.constraint(equalTo: title.lastBaselineAnchor, constant: Layout.grid(2))
    let selfHeight = self.heightAnchor.constraint(equalToConstant: Layout.grid(28))
    let selfWidth = self.widthAnchor.constraint(equalToConstant: Layout.grid(30))
    selfWidth.priority = highPriority
    selfHeight.priority = lowPrioririty

    titleFirstBaseline.priority = highPriority
    bodyFirstBaseLine.priority = highPriority


    NSLayoutConstraint.activate([


            selfWidth,
            selfHeight,

            contentBox.topAnchor.constraint(equalTo: self.topAnchor, constant: padding),
            contentBox.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: padding),
            contentBox.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -padding),
            contentBox.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: -padding),

            imageView.leadingAnchor.constraint(equalTo: contentBox.leadingAnchor),
            imageView.topAnchor.constraint(equalTo: contentBox.topAnchor),
            imageView.widthAnchor.constraint(equalToConstant: Layout.grid(4)),
            imageView.heightAnchor.constraint(equalToConstant: Layout.grid(4)),

            title.leadingAnchor.constraint(equalTo: imageView.trailingAnchor, constant: padding),
            titleFirstBaseline,
            title.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -padding),

            bodyFirstBaseLine,
            body.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: padding),
            body.bottomAnchor.constraint(equalTo: self.contentBox.bottomAnchor),
            body.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -padding),
    ])
}
  

Проведя несколько часов в камере пыток, я, наконец, понял это! Проблема заключалась в самом шрифте. Это был файл .otf, а не .ttf. Из-за этого swift не понял внутреннюю высоту строки шрифта и просто обрезал ее. После переключения на .ttf проблема была решена