◆PROCESSING 逆引きリファレンス
カテゴリー：GUI
GButtonのラベルを装飾するには（G4P）
【概要】
PROCESSINGにGUI用のライブラリであるG4Pを追加する事で、（種類は多くないですが）簡単にGUI部品を表示する事ができるようになります。
G4Pのインストールについては「GUIを扱う準備をする（G4P）」記事を参照してください。
より詳しく知りたい方は、下記公式サイト様などを参照して下さい。
G4Pで扱えるボタンには
- 普通のボタン（GButton）
- 画像ボタン（GImageButton）
- トグルボタン（GImageToggleButton）
の3種類があります。
この中で「ラベル」が扱えるのは普通のボタン（GButton）のみです。ラベルは、デフォルトでは、文字領域の左右中央、上下中央に配置されます。
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
文字領域の中で、ラベルの表示位置を変更するには、GButtonの親クラス（GTextIconBase）が持つsetTextAlign メソッドを使います。
またボタン作成時に与えたラベルを変更するには、setText メソッドを使います。
ラベルを強調文字にするにはGButtonの親クラス（GTextBase）が持つsetTextBold メソッドを、斜体（イタリック）にするには setTextItalic メソッドを使います。
【詳細】
ラベル配置
配置命令
void setTextAlign( GAlign horz, GAlign vert ) ;
vert ： 垂直位置 GAlign.TOP、MIDDLE、BOTTOM の何れか
setTextAlignメソッドで、文字領域におけるラベルの配置を変更可能です。
デフォルトの位置は GAlign.CENTER、GAling.MIDDLE です。デフォルトのままで良い場合は、デフォルトで良い方のパラメータに null を与えます。
以下は水平位置がCENTER指定で、垂直位置をTOP、MIDDLE、BOTTOM と変化させた様子です。
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
以下は垂直位置がMIDDLE指定で、水平位置をLEFT、CENTER、RIGHTと変化させた様子です。
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
ラベルの水平位置は、文字が回り込んだ際の「寄せ」にも影響を与えます。
以下は水平位置がLEFT、CENTER、RIGHTの時、長い文字列を回り込ませた例です。表示の違いがわかると思います。
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
ラベル変更
ラベル設定void setText ( String text ) ;
ボタン作成後に、ボタンに表示するラベルを変更します。引数に空文字または null を与えると、ラベルを消去してアイコンだけにすることも可能です。
強調
強調void setTextBold ( ) ;
void setTextBold ( int start, int end ) ;
start ： 開始位置
end ： 終了位置
ボタンに表示するラベルを強調表示（Bold）にします。
開始位置は0オリジンです。先頭の文字から強調表示したい場合は0を与えます。一方、end は1オリジンです。先頭の文字から２文字だけ強調表示したい場合は2を与えます。
引数を省略すると、ラベル全体を強調表示にします。
斜体
斜体void setTextItalic ( ) ;
void setTextItalic ( int start, int end ) ;
start ： 開始位置
end ： 終了位置
ボタンに表示するラベルを斜体表示（Italic）にします。使い方は強調表示命令と同じです。
強調表示と斜体表示を両方かけたい場合は、それぞれの命令を発行します。例えば下記は
|
1 2 3 4 5 |
// btnDog は GButton のインスタンス変数 // 先頭（0）から6番目まで（onetwo）を強調表示 btnDog.setTextBold(0,6); // 続いて4文字目(3)から6番目（two）を斜体表示 btnDog.setTextItalic(3,6); |
とした結果です。
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
プレーン
通常表示void setTextPlain( ) ;
ラベルにかけられた強調や斜体効果を取り消します。文字位置を指定して取り消す事はできません。
【その他】
なし
【関連記事】
サンプルプログラム
ラベルの位置を変更する例：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
import g4p_controls.*; import java.awt.Font; /** * PROCESSING G4P GButton表示サンプル * @author MSLABO * @version 1.10 */ GButton btnDog; //犬ボタン PFont pFont; //表示文字 PImage imgDog; void setup(){ size( 300, 200 ); //表示用フォントを読み込む pFont = loadFont("IPAGothic-48.vlw" ); textFont( pFont, 24 ); textAlign( LEFT, TOP); //ICONを読み込む imgDog = loadImage( "dog.png" ); //G4Pグラフィックボタンを作成 //G4P.setGlobalAlpha(10); btnDog = new GButton( this, 20, 20, 260, 160, "onetwothree" ); btnDog.setIcon( imgDog, 1 , GAlign.WEST, null, null ); //ラベルの配置を変更する //水平位置は右寄せ(RIGHT)、垂直位置は中央（MIDDLE） btnDog.setTextAlign( GAlign.RIGHT, GAlign.MIDDLE ); //ボタンに日本語を使うため、日本語対応フォントをセットする Font font = new Font( "IPAゴシック", Font.PLAIN, 24 ); btnDog.setFont( font ); } void draw(){ background( 240 ); } |
setTextAlign 命令で、ボタンのラベル位置を変更しています。文字が右寄せになっているのがわかると思います。
＜出力サンプル＞
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
強調表示と斜体表示の例：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
import g4p_controls.*; import java.awt.Font; /** * PROCESSING G4P GButton表示サンプル * @author MSLABO * @version 1.11 */ GButton btnDog; //犬ボタン PFont pFont; //表示文字 PImage imgDog; void setup(){ size( 300, 200 ); //表示用フォントを読み込む pFont = loadFont("IPAGothic-48.vlw" ); textFont( pFont, 24 ); textAlign( LEFT, TOP); //ICONを読み込む imgDog = loadImage( "dog.png" ); //G4Pグラフィックボタンを作成 //G4P.setGlobalAlpha(10); btnDog = new GButton( this, 20, 20, 260, 160, "onetwothree" ); btnDog.setIcon( imgDog, 1 , GAlign.WEST, null, null ); //ラベルの配置を変更する //水平位置は中央寄せ(CENTER)、垂直位置は中央（MIDDLE） btnDog.setTextAlign( GAlign.CENTER, GAlign.MIDDLE ); // 先頭（0）から6番目まで（onetwo）を強調表示 btnDog.setTextBold(0,6); // 続いて4文字目(3)から6番目（two）を斜体表示 btnDog.setTextItalic(3,6); //ボタンに日本語を使うため、日本語対応フォントをセットする Font font = new Font( "IPAゴシック", Font.PLAIN, 24 ); btnDog.setFont( font ); } void draw(){ background( 240 ); } |
ボタンのラベルに強調表示と斜体表示を行っています。ラベルに日本語（漢字）を利用する場合、フォントによっては強調や斜体効果が目立たないものがあります。
＜出力サンプル＞
（画像URL：illust-AC 様：アルパッカさん、文字：IPA 独立行政法人 情報処理推進機構 様：IPAフォント）
本ページで利用しているアイコン画像は、下記サイト様より拝借しております。各画像の著作権は、それぞれのサイト様および作者にあります。