【Processing】textDescent()の使い方【文字の下の部分がどれだけ下に伸びているかを測る】

2024年11月19日2025年12月17日

URLをコピーしました！

ワタタク

今回の記事の目的はProcessingの「textDescent()」を理解し、自分なりに使ってみること。

この記事を書いた人

クリエイティブコーダー Watataku のプロフィール写真 — ワタタク(Watataku)

上達の研究家 / アーティスト

「才能」ではなく「発見」で描く。文系・36歳からの上達ハック。

ゼロから独学でクリエイティブコーディングに挑戦し、以下の実績を達成
- 開始1年8ヶ月目までに公募6つに挑戦し、3つ入選（勝率50%）
  - KITTE大阪の18メートルあるAxCROSS大型スクリーン
  - 虎ノ門ヒルズステーションタワーB2F TOKYO NODE エントランスサイネージで展示
  - UN:O（東京大手町）にある会員限定のサテライトオフィスにて2作品常設展示
- 開始1年9ヶ月目に、虎ノ門ヒルズ49階、地上250mのインフィニティプールへ作品提供・展示
【上達の秘密】
- 起源の物語：未経験から虎ノ門ヒルズ展示までの全記録（Genesis）
- 思考の技術：「上達」をシステム化する、モレスキン6冊の運用設計図
  - ※虎ノ門ヒルズでの実績を出した「思考」と「経験」を、再現可能な形に体系化

記事内のProcessingのバージョンは4.3。

【Processing】textDescent()について

textDescent()について

「text」は文字、「descent」は下に降りることを意味します。つまり、文字が下にどれだけ行くかを計算するという意味
textDescent()は、文字の下の部分がどれだけ下に伸びているかを測る関数
- gやpのように下に伸びる部分がある文字の高さを知るのに役に立つ
【注意点】使用するフォントやサイズによって結果が変わるので、毎回確認することが大切です。また、この関数は現在のフォント設定に依存する

【Processing】textDescent()の使い方【画像とコード】

// ウィンドウのサイズを設定（幅400ピクセル、高さ200ピクセル）
size(400, 200);

// フォントオブジェクトを作成し、「Arial」というフォントのサイズ32を設定
PFont font;
font = createFont("Arial", 32);

// 作成したフォントを使用するように設定
textFont(font);

// テキストのサイズを32に設定
textSize(32);

// textDescent()を使用して、文字の下の部分がどれだけ下に伸びているかを計算し、結果を変数descentに格納
float descent = textDescent();

// 計算結果をコンソールに表示
println("文字の下の部分の高さは: " + descent);

// 塗りつぶす色を黒に設定
fill(0);

// 「guitar」という文字列を、y座標をdescentで調整して表示
text("guitar", 10, 40 + descent);

Copy

// ウィンドウのサイズを設定（幅400ピクセル、高さ200ピクセル）
size(400, 200);

// フォントオブジェクトを作成し、「Arial」というフォントのサイズ32を設定
PFont font;
font = createFont("Arial", 32);

// 作成したフォントを使用するように設定
textFont(font);

// テキストのサイズを32に設定
textSize(32);

// textDescent()を使用して、文字の下の部分がどれだけ下に伸びているかを計算し、結果を変数descentに格納
float descent = textDescent();

// 計算結果をコンソールに表示
println("文字の下の部分の高さは: " + descent);

// 塗りつぶす色を黒に設定
fill(0);

// 「guitar」という文字列を、y座標をdescentで調整して表示
text("guitar", 10, 40 + descent);