![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
back to 11_YoshidaY
(このページに対する感想・苦情等受け付けます)
(2012.4.25)
Processingは元々プログラムのプロトタイプを作るためのものっぽいので、GUIに関してはあんまり考えてないんだと思うんですが、まぁ世の中偉い人ばっかでGUIを使える方法も色々あるようです。
そこでぽちが今知ってる方法として
import controlP5.*; //ライブラリを読込
ControlP5 cp5; //とりあえず宣言
ControlWindow cwindow; //ウィンドウを１つ作ります宣言
ControlFont cfont; //フォントを１つ用意します宣言
int btn; //ボタン用の変数
void setup() {
size(400, 400);
cfont = new ControlFont(createFont("MS-GOTHIC",20)); //MSゴシックを20のサイズで。
cp5 = new ControlP5(this);
cwindow = cp5.addControlWindow("Another Window", 500, 100, 120, 340)
.hideCoordinates()
.setBackground(255)
.setUpdateMode(ControlWindow.NORMAL);
//addControlWindow("ウィンドウのタイトル", 初期位置X, 初期位置Y, 横サイズ, 縦サイズ)
//hideCoordinates()→これがないとタイトルの後ろになんか数字付きます
//setBackground(Another Windowの背景の色)
createButton("A", 0, 5, 5);
createButton("B", 1, 5, 60);
createButton("C", 2, 5, 115);
createButton("D", 3, 5, 170);
createButton("E", 4, 5, 225);
createButton("F", 5, 5, 280);
//createButton("ボタンの名前", ボタンが持つ数字, X座標, Y座標)
}
void draw() {
background(255);
println("Button = " + btn);
}
Button createButton(String theName, int theValue, int theX, int theY) {
Button b = cp5.addButton(theName,theValue,theX,theY,110,50);
//addButton(~,~,~,~,ボタンの横サイズ,縦サイズ)
b.captionLabel().setControlFont(cfont);
b.setWindow(cwindow);
return b;
}
public void A(int BtnValue) {btn = BtnValue;}
public void B(int BtnValue) {btn = BtnValue;}
public void C(int BtnValue) {btn = BtnValue;}
public void D(int BtnValue) {btn = BtnValue;}
public void E(int BtnValue) {btn = BtnValue;}
public void F(int BtnValue) {btn = BtnValue;}
//createButton("A", 0, 5, 5);で名付けた、""の部分と同じ名前の関数を作ると、そこにボタンの値が入る。
はいこれでだいたい終わり。
注釈ない所は気にしだしたらポカーンってなる所です。
ウィンドウに何か描画したいって人もいると思うんですが、ただいま深夜2:40ですのでそろそろ寝ますー。
また時間ある時に追記しますね。
(2012.4.26)
おはようございます。
昨日書いたのでほぼ全部なんですが、実際にボタンとしてどう使うかを書いてなかったのでそこに関してだけ書いておきます
↑のプログラムでは、ボタンそれぞれに“ある数字”を持たせています。
ボタンによる描画の切り替えをしたい時、ボタンが押された時、その数字が何かを判断することで切り替えをします。
createButton("A", 0, 5, 5);
（ある数字とはこのコードで言う、0の部分です。
このコードで作成されたボタンは、押すと「０だから！」と叫びます。
するとbtnっていう変数がそれを受け取る仕様になってます。
そこで、
if(btn == 0) {
fill(0);
}
ellipse(width/2, height/2, 40, 40);
みたいに書くと、Aボタンを押すと円が黒く塗りつぶされるプログラムになります。
これを増やすと、
stroke(0); strokeWeight(2);
if(btn == 0) {
fill(0); //黒
} else if(btn == 1) {
fill(255); //白
} else if(btn == 2) {
fill(255, 0, 0); //赤
} else if(btn == 3) {
fill(0, 255, 0); //緑
} else if(btn == 4) {
fill(0, 0, 255); //青
} else if(btn == 5) {
noFill(); //塗りつぶしなし
}
ellipse(width/2, height/2, 40, 40);
と書けて、円の中の色が変わるプログラムになります。
あ、↑のはvoid draw() { }の中に入れてくださいね。
ではでは、学校行ってきます。
