Difference between revisions of "Tutorial:Fonts and Text (日本語)"

m
m (標準フォントを使用してフォント・オブジェクトを作成する)
 
Line 4: Line 4:
 
* グリフを内包する画像 (ImageFont)
 
* グリフを内包する画像 (ImageFont)
  
== 標準フォントを使用してフォント・オブジェクトを作成する ==
+
== 標準フォントでフォント・オブジェクトを作成する ==
標準フォントは誰でも利用可能であり下記のコード移用して作成することができます:
+
標準フォント (組み込みフォント) は下記のコードで作成します。外部ファイルの指定は不要です:
 
<source lang="lua">
 
<source lang="lua">
 
font = love.graphics.newFont(14) -- 数値はフォントの大きさを意味します。
 
font = love.graphics.newFont(14) -- 数値はフォントの大きさを意味します。

Latest revision as of 09:48, 15 July 2019

LÖVE でフォントを用いるのは、さほど難しいことではありませんが、気をつけることは使用前に設定を行うことです。フォント・オブジェクトからテキストを直接表示する方法は存在せず、現在のフォントに基づき常に love.graphics.print 関数を用いてテキストは表示されます。 LÖVE で利用可能なフォントは三種類あります:

  • 標準フォント (Bitstream Vera Sans)
  • FreeType 2 にて対応している任意のフォント・ファイル
  • グリフを内包する画像 (ImageFont)

標準フォントでフォント・オブジェクトを作成する

標準フォント (組み込みフォント) は下記のコードで作成します。外部ファイルの指定は不要です:

font = love.graphics.newFont(14) -- 数値はフォントの大きさを意味します。

フォント・ファイルを使用してフォント・オブジェクトを作成する

フォント・ファイルはインターネットからダウンロード (または自作) するものであり、このファイルはフォント情報から構成されています。標準フォントと同様、フォ、ントの大きさとファイルのパスを指定します:

font = love.graphics.newFont("AwesomeFont.ttf", 15)

ダウンロードしたフォントには著作権があり、その一部には改変禁止や商用利用禁止などの使用許諾条件または利用制限があることに留意してください。

画像を使用してフォント・オブジェクトを作成する

特別な画像の形式に全て依存するため、画像フォントについて解説するのは少し難しいです。これ用例画像を参照すれば特定色により各々が分離され、一列に沿ったグリフから構成されていることが理解できるでしょう。この色はグリフを分離するために使用され全ての文字および一覧の最初から検出される必要があります(全ての方向は左から)。この画像に基づくフォントの作成方法は下記の通りです。

font = love.graphics.newImageFont("imagefont.png",
    " abcdefghijklmnopqrstuvwxyz" ..
    "ABCDEFGHIJKLMNOPQRSTUVWXYZ0" ..
    "123456789.,!?-+/():;%&`'*#=[]\"")

警告: 画像の始点および終点に関しての分離色を確認してください。不正な場合は最後の文字 (この場合は " ) は動作しません。

フォント・オブジェクトの使用

いまフォント・オブジェクトを作成したので、使用前に下記のコードにより現在のフォントを設定します。:

-- font = 以前に作成したフォント・オブジェクトです。
love.graphics.setFont(font)

一回呼び出すことでも TTF フォントを直接的に使用することができます。

love.graphics.setNewFont(filename, size)

または、この場合は標準フォントになります。

love.graphics.setNewFont(size)

テキストの整形と描画

まさに今は新規のフォント・オブジェクトがあるので、なにかに対して使用したいとします。テキストを描画するには単に love.graphics.print 関数を呼び出します:

love.graphics.print("This is some awesome text", 100, 100)

同様に数値も簡単に描画することができます:

num = 15
love.graphics.print(num, 100, 150)

標準のテキスト表示関数は改行 ( '\n' 文字) を扱うことができ、テキストを左寄せで描画します:

love.graphics.print("This is the first line\nThis is the second one.\n(and a third)\n\nfifth", 100, 200)

引数 '100' および '200' は、それぞれテキストの x 位置および y 位置です。LÖVE 0.6.0 以前では、テキストを描画するために love.graphics.draw にて代用されていました。

しかし、 LÖVE では love.graphics.print 関数を使用することで単語の折り返しと揃え方を指定したテキストを描画することができます:

love.graphics.printf("A really long sentence which will probably be broken into many pieces by my love.", 500, 100, 250, 'right')

ここでは、引数 '500' および '100' は x および y 位置である場合は、 '250' はテキストの最大幅であり、 'right' はテキストの揃え方です。

この方法では単語自動行送り制限および x 位置が 0 をウィンドウ幅を渡す場合は、比較的に簡単に中央揃えのテキストを全て描画します:

love.graphics.printf("This text will be centered no matter what.\n(and you LOVE it)", 0, 400, 800, 'center')

揃え方の値を省略した場合は、常に標準でテキストは左揃えになります:

love.graphics.printf("Aligned to the left, yes very much so.", 100, 500, 150)

これはテキストを描画する方法です。特定の関数、および使用方法に関する詳細はドキュメンテーションを参照してください。

注意: 全てのフォント (画像フォントも同様) は全て現在の色により影響されるため、配色状態を 'modulate' する必要はありません。



そのほかの言語