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

(New translation)
 
m
Line 61: Line 61:
 
引数 '100' および '200' は、それぞれテキストの ''x'' 位置および ''y'' 位置です。LÖVE 0.6.0 以前では、テキストを描画するために <code>[[love.graphics.draw (日本語)|love.graphics.draw]]</code> にて代用されていました。
 
引数 '100' および '200' は、それぞれテキストの ''x'' 位置および ''y'' 位置です。LÖVE 0.6.0 以前では、テキストを描画するために <code>[[love.graphics.draw (日本語)|love.graphics.draw]]</code> にて代用されていました。
  
しかし、 LÖVE では <code>[[love.graphics.print (日本語)|love.graphics.print]]</code> 関数を使用することで単語の包装と揃え方を指定したテキストを描画することができます:
+
しかし、 LÖVE では <code>[[love.graphics.print (日本語)|love.graphics.print]]</code> 関数を使用することで単語の折り返しと揃え方を指定したテキストを描画することができます:
 
<source lang="lua">
 
<source lang="lua">
 
love.graphics.printf("A really long sentence which will probably be broken into many pieces by my love.", 500, 100, 250, 'right')
 
love.graphics.printf("A really long sentence which will probably be broken into many pieces by my love.", 500, 100, 250, 'right')

Revision as of 14:01, 15 May 2017

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' する必要はありません。



そのほかの言語