web-dev-qa-db-ja.com

カスタムインストールされたフォントがUILabelに正しく表示されない

Adobe Font Collection Pro Packageから入手したHelvetica Neue Condensedフォントを使用しようとしています。残念ながら、UILabel内で使用すると、正しく描画されないようです。

行の高さは正しく計算されているように見えます（私は思う）が、フォントが表示されると、境界ボックスの最上部に配置されます。私は呼びました [myLabel sizeToFit]そして、この画面キャプチャを生成するために幅のみを調整しました。

Screen capture of incorrect font rendering

フォントの太字版と通常版の両方で同じ問題が発生しました。 Helvetica Neue BoldのバージョンをOSXから取得してデバイスに配置すると、正常に表示されます（上の写真の緑の背景）。

このように描画するフォントファイルまたはコードのどこに問題があるのでしょうか。

iosios4fontsuilabeluifont
79
MikeQ

Ttfフォントファイルへのパッチ適用を含むソリューションを投稿しました here ：

UILabel、UIButtonなどで同じ問題が発生したカスタムフォントで機能するソリューションを次に示します。フォントの問題は、そのアセンダープロパティがシステムフォントの値と比較して小さすぎるという事実であることが判明しました。アセンダーは、フォントの文字の上にある垂直方向の空白です。フォントを修正するには、 Apple Font Tool Suite コマンドラインユーティリティをダウンロードする必要があります。次に、フォントを取得して次の操作を行います。

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

これにより、Bold.hhea.xml。テキストエディタで開き、ascender属性の値を増やします。自分に最適な値を見つけるには、少し実験する必要があります。私の場合、750から1200に変更しました。次に、次のコマンドラインでユーティリティを再度実行して、変更をttfファイルにマージします。

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

次に、作成したttfフォントをアプリで使用します。

121
kolyuchiy

したがって、これはkolyuchiyの回答の修正版です。

Glyphs でフォントを開き、何も変更せずにエクスポートしました。どういうわけか、魔法のように、垂直方向の配置の問題はなくなりました！

さらに良いのは、新しいフォントがsizeWithFont:ので、Joshuaで言及されている問題はありません。

Kolyuchiyが言及したコマンドでHHEAテーブルを見てみると、Glyphsがascenderだけでなく、lineGapとnumberOfHMetricsも変更していることに気付きました。

前の生データは次のとおりです。

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"

以降：

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"

したがって、物語の教訓は、アセンダーを増やすだけでなく、他の関連する価値も同様に変更することです。

私はタイポグラフィの専門家ではないので、その理由と方法を実際に説明することはできません。誰かがより良い説明を提供できるなら、それは大歓迎です！ :)

64
Joseph Lin

iOS 6はフォントのlineGapプロパティを尊重しますが、iOS 7はそれを無視します。したがって、行間隔が0のカスタムフォントのみが両方のオペレーティングシステムで正しく機能します。

解決策は、lineGapを0にし、それに応じてアセンダーを大きくすることです。上記の answer に従って、1つの解決策はGlyphsからインポートおよびエクスポートすることです。ただし、アプリの将来のバージョンでこの「バグ」が修正される可能性があることに注意してください。

より堅牢なソリューションは、この post に従って自分でフォントを編集することです。具体的には、

  1. OS Xフォントツールをインストールします。
  2. フォントメトリックをファイルにダンプします：ftxdumperfuser -t hhea -A d YOUR_FONT.ttf
  3. ダンプされたファイルをエディターで開きます。
  4. ascenderプロパティの値を追加して、lineGapプロパティを編集します。たとえば、lineGapが200で、ascenderが750の場合、ascenderを950にします。
  5. lineGapを0に設定します。
  6. 変更をフォントにマージします：ftxdumperfuser -t hhea -A f YOUR_FONT.ttf

これを行ったら、それに応じてUIを調整する必要があります。

31
phatmann

OS X El Capitanを実行していて、このスレッドにアクセスしている場合、Apple Font Tool Suiteはもはや互換性がありません（少なくとも今のところ）。

ただし、kolyuchiyおよびJoseph Linで記述された変更を引き続き実行できます無料のフォント編集ソフトウェア FontForge 。

FontForgeでフォントを開き、トップメニューで[要素]を選択し、[フォント情報]> [OS/2]> [メトリック]に移動します。そこで、HHEad Line GapとHHead Ascent Offsetの値を編集します。

必要な編集が完了したら、[ファイル]> [フォントの生成]でフォントをエクスポートし、適切なフォント形式を選択するだけです。

4
Naiko
  1. Appleのフォントツールをここからダウンロードしてインストールします。 https://developer.Apple.com/downloads/index.action?q=font （ダウンロードリンクは下部にあります）
  2. ターミナルを開き、フォントのある場所に移動します
  3. 次のコマンドを実行します：ftxdumperfuser -t hhea -A d MY_FONT_NAME.ttf
  4. これで、フォントのプロパティの一部を含むxmlファイルが作成されました。テキストエディターで編集します
  5. 「lineGap」プロパティを検索し、その値に200を追加します
  6. Xmlファイルを保存します
  7. 次のコマンドを実行します。ftxdumperfuser-t hhea -A f MY_FONT_NAME.ttf
  8. Xmlファイルを削除します
  9. IOS 6で設定されたフォントを試して、見栄えが良いかどうかを確認します。
  10. 必要に応じて、手順3に戻り、「lineGap」プロパティに追加/減算できます。 （構成に250を追加することになりました）
4
nurxyz

このおかげで answer Glyphsの問題を修正しましたが、少し異なります。

Glyphsでフォントを開き（Glyphs miniでも動作します）、そこにこのセクションを見つけました（Glyphs miniから、そこに移動するには右上のiボタンを押します）。

enter image description here

このアライメントゾーンのすべて（またはそれらの一部）を削除するだけで、この問題は修正されます。私にとって完璧に働いた。

3
DevilPinky

カスタムフォントの1つでも同じ問題が発生しました。また、フォントアセンダープロパティを編集することで問題を「修正」しました。ただし、これにより他の問題やレイアウトの問題が発生することがわかりました。たとえば、ラベルの高さに基づいてセルの高さを動的に設定すると、アセンダーで編集したフォントを使用するときに爆発します。

最終的に行ったのは、UIButton contentEdgetInsetsプロパティを変更することでした。

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

どの方法が優れているかはわかりませんが、問題を解決する別の方法を共有したかっただけです。

3
Joshua Dance

Core Text を試しましたか？ Core Textを介してカスタムフォントのレンダリングに成功しましたが、あなたの状況に合うかどうかはわかりません。

1
RyanR

ラベルテキストから属性付きテキストを作成することは、私にとって修正でした。拡張機能は次のとおりです。

_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
    }
}
_

カスタムフォントの場合、必要な結果が得られました。

_self.myLabel.setLineSpacing(lineSpacing: 1.2, lineHeightMultiple: 1.2)
_

これは、行の高さと間隔のプロパティを含むネイティブのNSMutableParagraphStyle()を使用することで機能します（ラベルをプログラミングしていない場合は、ストーリーボードの_@IBOutlet_プロパティとしてもアクセスできます）。

0
App Dev Guy

これらのコマンドラインユーティリティで問題が発生した場合は、windowでfontcreatorを試してください。設定メニューからフォントアセンダーを変更します。

0
Gaurav