![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
今回の記事の目的はProcessingの「textDescent()
」を理解し、自分なりに使ってみること。
この記事を書いた人
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-user-profile-illustrationi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-user-profile-illustrationi-light-blue.png)
- クリエイティブコーディングで制作した作品と、上達のためにやったこと・学習過程を発信
- コンセプトは「クリエイティブコーディング1万時間の歩き方」
- 2024年にProcessingの構文のアウトプットを終え、2025年から作品制作開始(クリエイティブコーディングで作成した作品集)
目次
【Processing】textDescent()について
textDescent()について
- 「text」は文字、「descent」は下に降りることを意味します。つまり、文字が下にどれだけ行くかを計算するという意味
textDescent()
は、文字の下の部分がどれだけ下に伸びているかを測る関数- gやpのように下に伸びる部分がある文字の高さを知るのに役に立つ
- 【注意点】使用するフォントやサイズによって結果が変わるので、毎回確認することが大切です。また、この関数は現在のフォント設定に依存する
【Processing】textDescent()の使い方【画像とコード】
![【Processing】textDescent()の使い方【画像とコード】](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/11/how-to-use-textdescent-in-processing-measuring-the-descent-of-text1.png)
![【Processing】textDescent()の使い方【画像とコード】](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/11/how-to-use-textdescent-in-processing-measuring-the-descent-of-text1.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/11/how-to-use-textdescent-in-processing-measuring-the-descent-of-text2.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/11/how-to-use-textdescent-in-processing-measuring-the-descent-of-text2.png)
// ウィンドウのサイズを設定(幅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);
【Processing】textDescent()を使ってみた感想
テキストを使った表現で細かく位置の調整をするときに使用してみようと思います。
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
![](https://watataku-artist-katsuyaku.com/wp-content/uploads/2024/03/watataku-hukidashi-light-blue.png)
それでは今日もレッツワクワクコーディング。