textAlign

(別名: text_align)

def setup
  background(220)
  strokeWeight(0.5)
  line(50, 0, 50, 100)
  textSize(16)
  textAlign(RIGHT)
  text('ABCD', 50, 30)
  textAlign(CENTER)
  text('EFGH', 50, 50)
  textAlign(LEFT)
  text('IJKL', 50, 70)
end
def setup
  background(220)

  textSize(16)
  strokeWeight(0.5)

  line(0, 12, width, 12)
  textAlign(CENTER, TOP)
  text('TOP', 0, 12, width)

  line(0, 37, width, 37)
  textAlign(CENTER, CENTER)
  text('CENTER', 0, 37, width)

  line(0, 62, width, 62)
  textAlign(CENTER, BASELINE)
  text('BASELINE', 0, 62, width)

  line(0, 97, width, 97)
  textAlign(CENTER, BOTTOM)
  text('BOTTOM', 0, 97, width)
end

p5.jsリファレンス(参考情報)

[p5.js] textAlign

概要

textメソッドで描画する際の文字列などの配置を設定または取得します。

書式

textAlign(horizontal [, vertical])
h = textAlign

引数

引数名内容備考オプションデフォルト値
horizontal水平方向の配置LEFT : 左寄せ
CENTER : 中央
RIGHT : 右寄せ
vertical垂直方向の配置TOP : 上寄せ
CENTER : 中央
BOTTOM : 下寄せ
BASELINE(標準)

戻値

h : 現在設定されている配置

備考

・戻値 rは下記のキーを持つハッシュです。
  {
   :horizontal
   :vertical
  }

・初期設定は下記のようになっています。
  :hirizontal => LEFT
  :vertical => BASELINE

・p5.jsのバージョンによって差異があるように見受けられますが、
 現状、verticalに BASELINE(定義内容は 'alphabetic')を指定すると
 TOPと同じ挙動になります。

・textAlignの設定は push ~ pop (または push do ~ end)の影響を受けます。

関連