最近のアクセス:
カスタムフォントの使用

さまざまなアプリケーションにおいて、カスタムフォントの使用が必要になることがよくあります。この記事では、Theme オブジェクトを通じてカスタムフォントを使用する方法を説明します。

Fonts ノード

Theme オブジェクトには Fonts ノードがあり、そこにアプリケーションに関連するカスタム テキスト フォント (動作は Web フォントと同じ) を組み込むことができます。これはトランスフォーメーションと同様に機能し、次のことができます。
  • 新しいフォントを追加するには、右クリックして [ Add Font ] オプションを選択します。
  • [ Font Family ] プロパティでフォントを参照します (そのフォントを使用できるテーマクラスの [ Font ] プロパティグループにある)。
     
プロパティ  説明
Name 文字列 テーマクラスで参照されるフォントの名前
File フォントのファイル名  ナレッジベースにインポートされた TTF ファイルの名前

: ほかのプロパティ ( [ Style ] 、 [ Stretch ] 、 [ Weight ] 、 [ Unicode ] ) は CSS スタイルタグに基づいているため、ネイティブ モバイル ジェネレーターには適用されません。ネイティブ モバイル ジェネレーターでは、テーマクラスのプロパティを使用してこのカスタマイズを行うことができます。

使用例

[ START! ] というボタンがある単純なパネルを考えます。目的は、フォントを変更してその見た目をカスタマイズすることです。
イメージ:32712.png
これを実現するには、次の手順を実行します。
1) 必要なフォントを入手し、プラットフォームと互換性のある拡張子かどうかを確認します。
2) Theme オブジェクトを開き、Fonts ノードを見つけます。右クリックして、 [ Add Font ] オプションを選択します。
イメージ:35722.png
3) この操作でダイアログが表示され、ここでフォントのソースファイル (この例では、Gameplay という TTF ファイル) をインポートします。
イメージ:35723.png
4) フォントをインポートしたら、ダイアログでそれを選択して [ OK ] ボタンをクリックします。この操作で、新しいフォントが Fonts ノードの下に表示されます。
イメージ:32714.png
5) 変更するフォントのテーマクラス (この例では Button クラス) を探し、 [ Font Family ] プロパティを見つけます。このプロパティで、新たに追加されたフォントをコンボボックスから選択します。
イメージ:35724.png
6) これで完了です。アプリケーションを実行するだけで、コントロールのテキストが新しいフォントで表示されます。

  • Apple のみ: iOS または tvOS アプリで *.otf フォントが機能しない場合、テーマにファイルをインポートする前に、拡張子を *.ttf に変更します。たとえば、ファイル名「fontText.otf」を「fontText.ttf」に変更します。
  • フォントの [ Name ] プロパティは、フォントのソースファイルの名前と同じにする必要があります
    例:
    イメージ:32715.png

iOS におけるトラブルシューティング

フォント名の不一致

まれなケースとして、iOS に登録されているフォントの名前が TTF フォントファイル内に指定されている名前と異なる場合があります。このような場合、明白な症状が見られ、対応するテーマクラスで指定されている適切なフォントが画面上のコントロールに反映されません。
このケースでは、テーマの Fonts ノードのフォントの名前は、TTF ファイル内の名前ではなく、iOS に登録されている名前と一致する必要があります。
正しい名前を調べるには、次の手順に従います。
  1. 上記のようにフォントを追加し、そのフォントを何らかのクラスで使用してから、そのクラスをコントロールで使用し、アプリケーションをビルドします (Mac に転送されていることを確認してください)。
  2. 生成されたアプリケーションプロジェクトを Xcode で開き、そこからシミュレーターで実行します。
  3. アプリケーションがシミュレーターにロードされたら、Xcode に戻り、アプリケーションを一時停止します (一時停止ボタンはコードエディターの下にあります)。
  4. その後、Xcode コンソールで、次のコマンドを使用してフォントファミリー名を指定することにより、登録済みフォントをリストできます (ここでは、例として「Futura」を使用しています)。
    イメージ:47249.png
  5. ファミリー名が分からない場合は、次のコマンドを使用して、利用可能なすべてのフォントファミリーをリストできます。
    イメージ:47250.png

UI 用に最適化されたフォント

柔軟性に優れた iOS クライアントでは、カスタムフォントが使用されている場合に、選択されたフォントバリエーションが UI 用に最適化されていなければ、常にそのフォントを UI 用に最適化しようとします。フォントバリエーションが広範囲に使われている場合は、この動作によってパフォーマンスに大きな影響が生じます。
一方で、このようにフォントを UI 用に最適化するのではなく、最適化されていないフォントを使用したほうがよい場合もあります。
そのようなケースはどのように判別すればよいでしょうか。UI に正しいフォントバリエーションが表示されない場合 (たとえば、GothamRounded-Book フォントを使用したにもかかわらず、アプリ内のテキストは GothamRounded-Bold を使用して表示される場合)、Xcode から直接アプリケーションをシミュレーターで実行し、Xcode コンソールで「UI optimized font changed from '%@' to '%@'」というメッセージを確認します。
この動作を回避するには、値を YES とした GXDisableUIOptimizedFontEnforcement キーを Info.plist に追加します。
なお、メッセージ内の %@ プレースホルダーはフォント名に対応しており、アプリケーションを実行したときにインスタンス化されます。
このような UI 最適化を (パフォーマンスに影響を与える可能性を考慮して) 無効にするには、ブール型の GXDisableUIOptimizedFontEnforcement キーをアプリケーションの Info.plist に追加し、値を YES に設定します。
このキーは、GeneXus 17 Upgrade 1 以降で利用できます。

適用範囲

オブジェクト: Theme オブジェクト
ジェネレーター: Android、Apple、Angular

使用可能バージョン

この機能は、GeneXus 15 Upgrade 1 以降で利用できます。



サブページ
Created: 18/10/28 22:59 by Admin Last update: 21/05/20 01:24 by Admin
カテゴリ
Powered by GXwiki 3.0