Phông chữ được cài đặt tùy chỉnh không được hiển thị chính xác trong UILabel

Tôi đang cố gắng sử dụng phông chữ Helvetica Neue Condensed mà tôi nhận được từ Gói Adobe Font Collection Pro. Thật không may, nó dường như vẽ không chính xác khi tôi sử dụng nó trong vòng a UILabel.

Chiều cao dòng dường như được tính toán chính xác (tôi nghĩ vậy), nhưng khi phông chữ được hiển thị, nó được căn chỉnh ở phía trên cùng của hộp giới hạn. Tôi đã gọi [myLabel sizeToFit]và chỉ điều chỉnh chiều rộng để tạo ra ảnh chụp màn hình này:

Tôi đã gặp vấn đề tương tự với cả phiên bản in đậm và thông thường của phông chữ. Tôi đã có thể lấy một phiên bản Helvetica Neue Bold từ OSX và đặt nó trên thiết bị của mình và nó hiển thị tốt (nền màu xanh lá cây trong hình trên).

Điều gì có thể xảy ra với tệp phông chữ hoặc mã của tôi khiến nó vẽ theo cách này?

Tôi đã đăng một giải pháp liên quan đến việc vá tệp phông chữ ttf ở đây :

Đây là giải pháp phù hợp với phông chữ tùy chỉnh của tôi có cùng vấn đề trong UILabel, UIButton, v.v. Vấn đề với phông chữ hóa ra là do thuộc tính ascender của nó quá nhỏ so với giá trị của phông chữ hệ thống. Ascender là một khoảng trắng dọc phía trên các ký tự của phông chữ. Để sửa phông chữ của bạn, bạn sẽ phải tải xuống các tiện ích dòng lệnh của Apple Font Tool Suite . Sau đó lấy phông chữ của bạn và làm như sau:

~$ ftxdumperfuser -t hhea -A d Bold.ttf

Điều này sẽ tạo ra Bold.hhea.xml. Mở nó bằng một trình soạn thảo văn bản và tăng giá trị của ascenderthuộc tính. Bạn sẽ phải thử nghiệm một chút để tìm ra giá trị chính xác phù hợp nhất với mình. Trong trường hợp của tôi, tôi đã thay đổi nó từ 750 thành 1200. Sau đó, chạy lại tiện ích bằng dòng lệnh sau để hợp nhất các thay đổi của bạn trở lại tệp ttf:

~$ ftxdumperfuser -t hhea -A f Bold.ttf

Sau đó, chỉ cần sử dụng phông chữ ttf kết quả trong ứng dụng của bạn.

Vì vậy, đây là một phiên bản sửa đổi của câu trả lời của kolyuchiy .

Tôi đã mở phông chữ của mình bằng Glyphs , và sau đó xuất nó mà không sửa đổi bất cứ điều gì. Bằng cách nào đó, thật kỳ diệu, vấn đề căn chỉnh theo chiều dọc đã biến mất!

Điều tốt hơn là phông chữ mới hoạt động độc đáo với các phương pháp như sizeWithFont:, vì vậy nó không có các vấn đề như Joshua đề cập .

Tôi đã xem qua bảng HHEA với lệnh mà kolyuchiy đã đề cập, và nhận thấy rằng Glyphs đã sửa đổi không chỉ ascendermà còn lineGapvà numberOfHMetricscho tôi.

Đây là dữ liệu thô trước đây:

versionMajor="1"
versionMinor="0"
ascender="780"
descender="-220"
lineGap="200"
advanceWidthMax="1371"
minLeftSideBearing="-73"
minRightSideBearing="-52"
xMaxExtent="1343"
caretSlopeRise="1"
caretSlopeRun="0"
caretOffset="0"
metricDataFormat="0"
numberOfHMetrics="751"

và sau:

versionMajor="1"
versionMinor="0"
ascender="980"
descender="-220"
lineGap="0"
advanceWidthMax="1371"
minLeftSideBearing="-73"
minRightSideBearing="-52"
xMaxExtent="1343"
caretSlopeRise="1"
caretSlopeRun="0"
caretOffset="0"
metricDataFormat="0"
numberOfHMetrics="748"

Vì vậy, đạo đức của câu chuyện - không chỉ tăng mức độ cao hơn, mà còn sửa đổi các giá trị liên quan khác.

Tôi không phải là chuyên gia về kiểu chữ nên tôi thực sự không thể giải thích lý do tại sao và làm thế nào. Nếu bất cứ ai có thể cung cấp một lời giải thích tốt hơn, nó sẽ được đánh giá rất cao! :)

iOS 6 tôn trọng thuộc tính lineGap của phông chữ, trong khi iOS 7 bỏ qua nó. Vì vậy, chỉ những phông chữ tùy chỉnh có khoảng cách dòng bằng 0 mới hoạt động chính xác trên cả hai hệ điều hành.

Giải pháp là làm cho lineGap 0 và làm cho nó lớn hơn tương ứng. Theo câu trả lời ở trên, một giải pháp là nhập và xuất từ ​​Glyphs. Tuy nhiên, lưu ý rằng phiên bản ứng dụng trong tương lai có thể sửa "lỗi" này.

Một giải pháp mạnh mẽ hơn là tự chỉnh sửa phông chữ cho mỗi bài đăng này . Đặc biệt,

1. Cài đặt Công cụ Phông chữ OS X.
2. Đưa các chỉ số phông chữ vào một tệp: ftxdumperfuser -t hhea -A d YOUR_FONT.ttf
3. Mở tệp kết xuất trong trình chỉnh sửa.
4. Chỉnh sửa thuộc ascendertính bằng cách thêm giá trị của thuộc lineGaptính vào đó. Ví dụ: nếu lineGaplà 200 và ascender750, hãy tạo ascender950.
5. Đặt lineGapthành 0.
6. Hợp nhất các thay đổi vào phông chữ: ftxdumperfuser -t hhea -A f YOUR_FONT.ttf

Khi bạn làm điều này, bạn có thể phải điều chỉnh giao diện người dùng của mình cho phù hợp.

Chúng tôi đã gặp vấn đề tương tự với một trong các phông chữ tùy chỉnh của chúng tôi. Chúng tôi cũng đã "khắc phục" sự cố bằng cách chỉnh sửa thuộc tính font ascender. Tuy nhiên, chúng tôi nhận thấy rằng điều này đã tạo ra các vấn đề khác và các vấn đề về bố cục. Ví dụ: thiết lập động chiều cao ô dựa trên chiều cao nhãn sẽ bị nổ khi sử dụng phông chữ được chỉnh sửa ascender của chúng tôi.

Cuối cùng, những gì chúng tôi đã làm là thay đổi thuộc tính UIButton contentEdgetInsets.

yourButton.contentEdgeInsets = UIEdgeInsetsMake(-10, 0, 0, 0);

Không chắc chắn phương pháp nào tốt hơn, nhưng chỉ muốn chia sẻ một cách khác để khắc phục sự cố.

1. Tải xuống và cài đặt Công cụ Phông chữ của Apple tại đây: https://developer.apple.com/downloads/index.action?q=font (liên kết tải xuống ở dưới cùng)
2. Mở thiết bị đầu cuối và cd theo cách của bạn đến vị trí phông chữ của bạn
3. Chạy lệnh này: ftxdumperfuser -t hhea -A d MY_FONT_NAME.ttf
4. Bây giờ bạn có một tệp xml với một số thuộc tính của phông chữ, hãy chỉnh sửa nó trong trình soạn thảo văn bản của bạn
5. Tìm kiếm thuộc tính "lineGap" và thêm 200 vào giá trị của nó
6. Lưu tệp xml
7. Chạy lệnh này: ftxdumperfuser -t hhea -A f MY_FONT_NAME.ttf
8. Xóa tệp xml
9. Hãy thử phông chữ đã định cấu hình trên iOS 6 và xem nó có đẹp hơn không.
10. Nếu cần, bạn có thể quay lại bước 3 và thêm / trừ vào thuộc tính "lineGap". (Tôi đã thêm 250 vào cấu hình của mình)

Đối với những người đang chạy OS X El Capitan và đến với chủ đề này, bạn có thể nhận thấy rằng Bộ công cụ Phông chữ của Apple không còn tương thích (ít nhất là hiện tại).

Nhưng bạn vẫn có thể thực hiện các thay đổi được mô tả bởi kolyuchiy và Joseph Lin bằng phần mềm chỉnh sửa phông chữ miễn phí FontForge .

Mở phông chữ bằng FontForge và chọn Phần tử trong menu trên cùng, sau đó đi tới Thông tin phông chữ> OS / 2> Số liệu. Ở đó bạn muốn chỉnh sửa các giá trị HHEad Line Gap và HHead Ascent Offset.

Khi bạn đã thực hiện các chỉnh sửa cần thiết, bạn chỉ có thể xuất phông chữ trong Tệp> Tạo Phông chữ và chọn định dạng phông chữ phù hợp

Nhờ câu trả lời này, tôi đã khắc phục được sự cố của mình với Glyphs, nhưng hơi khác một chút.

Tôi đã mở phông chữ của mình bằng Glyphs (cũng hoạt động với Glyphs mini) và tìm thấy phần này ở đó (cái này từ Glyphs mini, để đến đó, hãy nhấn nút i ở góc trên cùng bên phải):

Chỉ cần xóa tất cả các vùng căn chỉnh này (hoặc một số vùng trong số chúng) và nó sẽ khắc phục sự cố này. Làm việc hoàn hảo cho tôi.

Tạo văn bản được gán từ văn bản nhãn của bạn là giải pháp cho tôi. Đây là một phần mở rộng:

extension UILabel {
    /// You can call with or without param values; without will use default 2.0
    func setLineSpacing(lineSpacing: CGFloat = 2.0, lineHeightMultiple: CGFloat = 2.0) {
        guard let labelText = self.text else { return }
        let paragraphStyle = NSMutableParagraphStyle()
        paragraphStyle.lineSpacing = lineSpacing
        paragraphStyle.lineHeightMultiple = lineHeightMultiple
        let attributedString:NSMutableAttributedString
        if let labelattributedText = self.attributedText {
            attributedString = NSMutableAttributedString(attributedString: labelattributedText)
        } else {
            attributedString = NSMutableAttributedString(string: labelText)
        }
        // (Swift 4.2 and above) Line spacing attribute
        attributedString.addAttribute(NSAttributedString.Key.paragraphStyle, value:paragraphStyle, range:NSMakeRange(0, attributedString.length))
        self.attributedText = attributedString
    }
}

Đối với phông chữ tùy chỉnh của tôi, tôi đã nhận được kết quả tôi cần từ:

self.myLabel.setLineSpacing(lineSpacing: 1.2, lineHeightMultiple: 1.2)

Điều này hoạt động bằng cách sử dụng bản gốc được cung cấp NSMutableParagraphStyle()có chứa các thuộc tính độ cao và khoảng cách dòng (cũng có thể truy cập được dưới dạng @IBOutletthuộc tính trong Bảng phân cảnh nếu bạn không lập trình nhãn của mình).

Bạn đã thử Core Text chưa? Tôi đã có một số thành công khi hiển thị phông chữ tùy chỉnh thông qua Core Text, nhưng tôi không biết liệu nó có phù hợp với tình huống của bạn hay không.

Tôi đã sử dụng https://github.com/fonttools/fonttools - rất dễ sử dụng và miễn phí. Trong trường hợp của tôi, việc thay đổi 'ascender' = 1000 và 'lineGap' = 0 trong bảng 'hhea' đã thực hiện một mẹo nhỏ.

Dựa trên bài viết từ Trevor Harmon https://medium.com/@thetrevorharmon/how-to-use-apples-font-tools-to-tweak-a-font-a386600255ae

Nếu bạn gặp sự cố với các tiện ích dòng lệnh này, hãy thử fontcreator trên window. và thay đổi trình xác nhận phông chữ từ menu cài đặt của nó.

Đối với bất kỳ ai đang gặp khó khăn khi sử dụng ftxdumperfuser( câu trả lời kolyuchiy ) trên Mac OS Mojave vì lỗi không tìm thấy lệnh:

• Tải xuống gói công cụ phông chữ từ Apple. Tìm thấy chúng tại https://developer.apple.com/download/more/?q=font , đã chọn một cái cho XCode 11.
• Gắn kết tệp dmg
• Nhập hình ảnh đĩa cd / Volumes / macOS \ Font \ Tools
• Giải nén gói vào thư mục bạn chọn: pkgutil --expand-full macOS \ Font \ Tools.pkg ~ / font-tools
• Các công cụ CLI hiện có sẵn trong ~ / font-tools / FontCommandLineTools.pkg / Payload, bạn có thể thêm thư mục vào đường dẫn của mình ( export PATH="$PATH:$HOME/font-tools/FontCommandLineTools.pkg/Payload") hoặc sao chép utils vào thư mục bin của mình.

Tôi đã gặp sự cố tương tự với phông chữ "FontAwesome" mang tính biểu tượng trong trò chơi Sprite Kit của mình. Đặt thuộc tính SKLabelVerticalAlignmentMode của SKLabelNode thành .Center đã làm việc cho tôi.

myLabel.verticalAlignmentMode = SKLabelVerticalAlignmentMode.Center

Chỉ muốn chia sẻ trong trường hợp ai đó sẽ gặp khó khăn với cùng một vấn đề.