フローにカスタムフォントを追加する

フローを作成するとき、アプリ全体のデザインに合わせてカスタムフォントを使いたい場合があります。ここでは、カスタムフォントを追加してフローで使用する方法を説明します。

フローのデザインを始める前に、Styles パネルでフォントを設定しておきましょう。こうすることで、変更がグローバルに反映されます。

組み込みフォント

ビルダーでフローを作成すると、Adapty はデフォルトでシステムフォントを使用します。通常、iOS では SF Pro、Android では Roboto になりますが、端末によって異なる場合があります。Arial、Times New Roman、Courier New、Georgia、Helvetica など、よく使われるフォントも選択できます。これらのフォントにはいくつかのスタイルオプションが用意されています。これらのフォントは Adapty SDK には含まれておらず、プレビュー目的でのみ使用されます。すべてのデバイスで完全に動作することを保証することはできません。ただし、私たちのテストでは、ほとんどのデバイスで追加の設定なしに認識されています。iOS でデフォルトで利用可能なフォントを確認することもできます。

カスタムフォントを追加する

アップロードするファイルはエディタのプレビュー専用です — Adapty はユーザーのデバイスにファイルを配信しません。デバイス上でフォントを表示するには、アプリのバンドルにファイルを含めてください。含めない場合、SDK は実行時に SF Pro（iOS）または Roboto（Android）にフォールバックします。

システムのデフォルト以外のフォントを使いたい場合は、カスタムフォントを追加できます。

カスタムフォントを追加するには: 0. フォントが可変フォントの場合は、固有の名前を持つ単一スタイルのファイルに分割してください。ウェイト、ボールド、イタリックのコントロールはカスタムフォントには適用されません。Adapty はカスタムフォントファイルごとに1つのスタイルのみを登録します。テキストのスタイルを変更するには、テキストのスタイリングを参照して、正しいバリエーションのフォントに切り替えてください。

フォントのドロップダウンのいずれかで Upload new font を選択します。

Add custom font ウィンドウで、以下のフィールドを入力します。

Font name in Builder、iOS font name、Android font name はそれぞれ、アプリ内のすべてのカスタムフォントファイルにわたって一意である必要があります。

Font name in Builder: ビルダーでのフォントの表示名を入力します。この名前はビルダー全体のフォントドロップダウンに表示されます。
- iOS font name: フォントのPostScript名を入力します。Font Book → PostScript nameから確認するか、UIFont APIで調べることができます。
- Android font name: res/font/ のファイル名を入力します。小文字、数字、アンダースコアのみ使用できます。
- Font file: フォントファイルをドラッグ＆ドロップするか、Select files をクリックします。サポートされているフォーマット：.ttf、.otf、.woff、.woff2。

Save font をクリックします。

フォントファイルをAdaptyにアップロードすることで、そのフォントをアプリ内で使用する権利を有することを確認したものとみなされます。

カスタムフォントを削除する

カスタムフォントをダッシュボードから削除すると、下書き・公開済みを問わず、すべてのフローでそのフォントへの参照がシステムフォントに自動的に置き換えられます。警告は表示されず、この操作は取り消せません。削除する前に、そのフォントを使用しているライブのフローがないことを確認してください。

フローテンプレートのカスタムフォント

フローテンプレートライブラリには、カスタムフォントを使ったテンプレートが含まれています。テンプレートカードの Custom font チップにカーソルを合わせると、使用しているフォントを確認できます。

Adapty はこれらのフォントをバンドルしていません。チップに表示されているフォント名に合わせて、自分でフォントを用意する必要があります。フォントによっては商用ライセンスが必要な場合があります。

フォントファイルを用意したら、以下のバンドル手順に従ってください。

フォントファイルをアプリのバンドルに追加する

すでにアプリ内でカスタムフォントを使用している場合は、同じ方法でペイウォール用のフォントを追加するだけです。まだ使用していない場合は、フォントファイルをアプリのプロジェクトとバンドルに含める必要があります。詳しくは以下をご覧ください：

iOS の場合：Apple 公式ドキュメント
Android の場合：Android 公式ドキュメント