このコードを使用すると、独自のOpenGLアプリケーションで高性能テキストをレンダリングできます。フォントレンダリングライブラリは、使いやすさでパフォーマンスを念頭に置いて設計されています。 2010年に書いて、時々更新しました。このライブラリで読み取られるフォントファイルは、BMフォントジェネレーター用に開発された形式に続きます:http://angelcode.com/products/bmfont/。フォントファイルには、テクスチャファイルが添付されています。ライブラリは、標準のRGBAテクスチャ、シングルチャネルSDF、さらにはマルチチャネルSDFをサポートしています。

乞うご期待。
フォントライブラリは次のファイルに分割されます。
DrawString関数呼び出しは、次のことを行います。String→Parses Stringを受信します→クワッドのリストを作成→それを頂点バッファー配列に変換 - >すべてのテクスチャの三角形を描画します。解析中、描画する文字列は、現在のフォントで描画できない文字がチェックされます。これらのcharは疑問符として描画されます。文字列内の各文字について、クワッドが作成され、最後のクアッドリストに追加されます。このクワッドには、ビットマップフォント内の1つの文字の画面(2D、直交!)の位置とサイズに関する情報が含まれています。クワッドの位置は、文字列の開始位置と前の文字の位置に依存します。 1つの文字の間隔と次のキャラクターの間の特定の関係は、Kerningと呼ばれます。フォント構成ファイルには、その特定のフォントのすべてのカーニング情報が含まれているテーブルが含まれています。たとえば、「a」が「m」に従う場合は、1ピクセルである必要がありますが、「o」が「m」に続くと、1ピクセルまたはゼロピクセルがマイナスします。これらの情報は、速いアクセスのために2次元配列に内部に保存されます。この描画を十分に速くするために、キャラクターやキャラクター関係に関するすべての情報(Kerningなど)、およびテクスチャはプログラムの開始にロードされます。テキストは、頂点バッファーを各レンダリングループイテレーションで作成する必要がないように保存できます。
ライブラリがどのように機能し、どのようにプロジェクトで使用できるかを確認する最も簡単な方法は、このレポで提供された実装の例をチェックすることです。ただし、詳細情報が必要な場合は、この章の残りをお読みください。
上記の10個のファイルをプロジェクトフォルダーにコピーする必要があります。
コードでは、レンダリングコンテキストを開く前に、グローバルフォントライブラリオブジェクトを作成します。
// load openGL fonts
m_fontLibrary = new CFontLibrary(<PathToFontFolder>);
if (!m_fontLibrary-> ParseAllFontsInFolder ())
return; // no fonts found!これにより、入力パラメーターとして指定したフォルダーに保存されているすべてのフォントがロードされます。レンダリングコンテキストが作成された後、テクスチャはロードする必要があります。
// init font library from the current rendering context!
theApp.m_fontLibrary-> InitGLFonts ();これは、たとえばそのレンダリングコンテキストの1回のinit関数で実行できます。このライブラリで2つ以上のコンテキスト間でテクスチャを共有できないことに注意してください(当時は効率的な方法がなかったため、一部のNVIDIAカードのみができるので、実装しませんでした)。したがって、新しいレンダリングコンテキストごとにこれを呼び出す必要があります。これが完了したら、フォントライブラリを使用する準備ができているため、fontlibraryオブジェクトからdrawstring()メソッドを呼び出すことができます。
(注:この章ではオーバーホールが必要です。その唯一の正しい、いくつかの関数パラメーターは欠落していますが、とにかく自明です)。
void DrawString ( const std::string& textToDraw, int x, int y, float color[ 4 ], const std::string& font, float scale = 1 . 0f );パラメーターについては、以下に表に説明します。
| パラメーター | 説明 |
|---|---|
| const std :: string&texttodraw | std :: stringとして描画する文字列は、認識されていない文字が「?」として描画されます。どの文字が有効であるかは、使用されるフォントによって異なり、フォントビットマップを作成するときに定義できます。 |
| int x | 画面座標内の文字列の開始のXポジション。 0-幅 |
| int y | 画面座標内の文字列の開始のy位置。 0-高さ |
| フロートカラー[4] | テクスチャの変調に使用される色情報を含むフロートアレイ。色情報は、次の標準順序で0.0〜1.0(包括的)の値です。{r、g、b、alpha}明らかに.. |
| const std :: string&font | このパラメーターは、使用するフォントタイプを定義します。フォルダーにあるフォントタイプのみを使用でき、読み込み時にそこにいました。そのフォントのファイル名を拡張機能なしに渡すことができます。または、より多くのコードの読みやすさと安全性のために、ファイル:fontlibrary.hから定義を使用できます。注:太字または斜体を印刷する場合は、それを行うためにセットアップされているフォントを使用する必要があります。 |
| フロートスケール | RGBAテクスチャの場合、デフォルト:1.0Fを使用することを強くお勧めします。スケールアップまたはダウンすることはできますが、これがぼやけていることは明らかです。ただし、SDFとMSDFを使用すると、アーティファクトを見る前にさらに上下にスケールアップできるはずです。 |
自動ラインブレークなど、追加の機能を備えた機能が増えていることに注意してください。フォントライブラリヘッダーファイルを参照してください。また、描画する文字列は10922文字の後に切り取られることに注意してください。どんな奇妙な理由でより多くの文字が必要な場合は、追加の描画呼び出しを使用して、文字列をパーツに分割します。
この章は、フォントライブラリに独自のフォントを追加することに関係しています。
ここでは、SDF以外のフォントに焦点を当てていることに注意してください。 SDFフォントの手順は非常に似ていますが、BM-Font-Genでは十分ではありません。そのツールは引き続き使用できますが、ImageMagickなどのツールを使用して後処理ステップを実行する必要があります。以下のチュートリアル。
新しいフォントを統合するには3つのステップのみが必要です。1。bm-font-generator 2を使用してフォントコンフィグとフォントビットマップを作成します。2つの結果のファイルをフォントフォルダーにコピーします。
次のセクションでは、BMフォントジェネレーターの使用について詳しく説明しますが、最初にいくつかのメモが記載されています。生成する各フォントファイルには、固定サイズのフォントのみが含まれています。また、ファイルによって太字であろうとイタリックであろうと、既に定義されています。アウトライン、フォントの滑らかさなどと同じカウントが含まれています。この問題は、次のセクションでより明確になります。
Font-Configと実際のフォントビットマップを生成するために、AngelCodeの「ビットマップフォントジェネレーター」を使用します。これは、ウェブサイトから入手できます:http://angelcode.com/products/bmfont/インストール後、プログラムを開いてください。次の図のように見えるはずです。

最初のステップとして、フォントセッティングを開き、オプション→フォント設定をクリックするか、[F]を押して、次の図に示すように新しいウィンドウを開きます。

これらのセットアップを作成したら、フォント設定ウィンドウを閉じて、次のステップに進みます。
プログラムのメインウィンドウに戻って、含めるキャラクターセットを選択できるようになりました。フルセットを選択するか、セットの特定の文字のみを選択できます。例として、次の図を参照してください。

基本的なルールとして、使用する可能性のある文字のみを選択します。これにより、処理時間とすべてのメモリだけでなく、1つの文字だけでなく、さらに多くのメモリ(Kerning、BitMapサイズ、コードの配列サイズなど)が節約されます。すべての文字を選択したら、フォントに含める必要があります。次のセクションに進みます。
今度は、フォントをビットマップとしてエクスポートし、そのための構成ファイルを作成する時が来ました。ヒットのいずれかの[T]またはクリックオプション→[エクスポート]オプションのエクスポートオプションを開きます。新しいウィンドウがポップアップするはずで、次の図のように見えます。

これらの設定が完了したら、ウィンドウを閉じて次のステップに進みます。
テクスチャが大きすぎたり小さすぎたりしないことを確認するには、メインウィンドウまたはクリックオプション→[視覚化]で[V]を押します。ウィンドウのタイトルが「プレビュー1/1」以外のことを言っている場合、テクスチャはすべてのキャラクターに対して小さすぎ、プログラムは複数のビットマップを生成します。その場合、エクスポートオプションを開き、テクスチャサイズを増やします。注:二乗したり、2人の電力を塗ったりする必要はありません。これは、OpenGLバージョン1のみでした。ただし、一部のテクスチャ関連関数がまだ最適化される可能性があるため、私はそれをそのようにするためにそれを作成することをお勧めします。 fontlibraryは意図的に複数の「ページ」またはテクスチャを処理しません。これは、1回のドローストリングコール中にテクスチャをバインド/バインドすることを意味するため、遅いためです。したがって、ちょうど1つのページを作成します。一方、キャラクターがビットマップの一部のみを埋めるだけで、可能であればテクスチャサイズを縮小しますが、これは他の方法ほど重要ではありません。テクスチャスペースの使用に満足したら、次のステップに進みます。
すべての設定が作成されたので、フォントをエクスポートする時が来ました。 [オプションをクリック]→[bitmap-fontを保存]をクリックします。ここで指定するファイル名は、フォントライブラリのフォントの名前に影響するため、賢明に選択してください。便利さと読みやすさの理由から、次の命名規則をお勧めします。
<イタリック? > <bold> <_ outlined?size?>
ここにいくつかの例があります:
[保存]を押してプロセスを完了します。今やるべきことは、そのフォントの2つのファイルをソフトウェアのフォントフォルダーにコピーすることだけです。別のツールでTGAをPNGに変換することができます。FNTファイルのファイル拡張子を正しく変更することを忘れないでください。
これは3ステップのプロセスです。
まず、上記のようにBMFontジェネレーターを使用します。ただし、以前に使用したものが異なる可能性のある次の設定を使用します。
最後に、ImageMagick(https://imagemagick.org/index.php)または同様のツールを使用して、テクスチャファイルをSDFに変換する必要があります。 ImageMagickがインストールされたら、コマンドラインから以下を実行します(例はWindows Power Shell用ですが、UNIXには非常に似ています):
magick convert --% Arial400_0.tga -filter Jinc ( +clone -negate -morphology Distance Euclidean -level 50%,-50% ) -morphology Distance Euclidean -compose Plus -composite -level 45%,55% -resize 25% Arial400_0.png
次に、FNTファイルを編集する必要があります。 Chars定義の前に、FNTヘッダーに次のことを追加します。
fieldType=sdf
これにより、このフォントが使用されているときに、Font Libが単一チャネルSDFシェーダーを使用するように指示されます。
マルチチャンネルSDFSの場合、BMフォントジェネレーターを使用できません。代わりに次のものを使用します。https://soimy.github.io/msdf-bmfont-xml/このツールを使用して、TTFファイルから開始する必要がありますが、通常のFNTとPNGファイルを受け取ります。インストールしたら、コマンドラインから以下を実行します。
msdf-bmfont -o multisdf.png cour.ttf
コマンドラインを通じてフォントサイズやその他のパラメーターも提供できることに注意してください。
これはオプションです。FontLibrary.hに追加する新しいフォントごとに定義することは、コーディングを簡単にする必要があります。
// font type defines, string must match the filename without extension in your fonts folder!
# define GLFONT_COURIER42_MSDF " Courier42_msdf "
# define GLFONT_ARIAL20 " Arial20 "
# define GLFONT_DINNEXTLTPROMED_SDF " DINNextLTProMED_SDF "..ここに独自の定義を追加してください!