ともさんのHP >プロブラミング >JavaFX >JavaFX Button

【JavaFX】Buttonコントロールを使ったサンプルプログラム

JavaFXのコントロール、Buttonを利用するシンプルなサンプルプログラムです。
JavaFXButtonサンプルプログラム

広告


Buttonの機能

「ボタンをクリックすると特定の処理を行う」コントロールです。
最もよく使うUIコントロールの一つだと思います。
ボタン楽天 を押したら〇×する」ためには、あらかじめそのためのイベントを用意しておく必要があります。

サンプルプログラムの説明

JavaFX楽天 で新Stageを作り、Buttonを2つ、TextFied一つを配置します。
一つ目のボタンにはマウスでクリックするとボタン自身の表示を変更するイベントを付けています。
また、マウスがボタンに入ると、テキストフィールドに「マウスが入りました」。出るとテキストフィールドに「マウスが出ました」をテキストフィールド上に表示します。
ボタン上を動くと、マウスカーソルの座標をテキストフィールド上に表示します。
2つ目のボタンには、クリックすると1つ目のボタンを無効にする、もう一度クリックすると有効になるイベントをつけています。

ボタンの初期化と配置

サンプルでは複数のメソッドで使うので、Classの中で宣言して、

 Button b1 ;
 Button b2 ;

そのあと初期化しています。
初期化時に文字を入れれば、ボタンの表示になります。

 b1 = new Button( " ボタン " );
 b2 = new Button( " 使用可 " );


ボタンの色、大きさ、表示を変える

ボタンのサイズは、

 b1.setPrefWidth(80);
 b1.setPrefHeight(20);

のようにx,y個別に設定したり、

 b2.setPrefSize(100, 30);

で、一度に設定することもできます。
色は下のようにRGBの数値を入れるか色名で設定します。

 b1.setStyle("-fx-background-color: #c1c0ff;");
 b2.setStyle("-fx-background-color: LIGHTGRAY;");

Java 楽天 FX色名の一覧は こちら を参照ください。

ボタンの配置

ボタンの配置は、配置するPaneで決まります。このサンプルプログラムではVBoxというコントロールを縦に配置するPaneに置いているので、 ボタンもテキストフィールドも縦一列に配置されています。
コントロール同士の隙間などもPaneの側で設定します。

ボタン表示の取得と設定

ボタンの表示は初期化の時に設定しますが、あとから設定(差し替え)することもできます。
サンプルプログラムには入っていませんが、こんな感じでセットしたり取得します。

b1.setText("クリック");
b1.getText();

サンプルではマウスクリック時のイベントで呼び出されるメソッドの中で下記のように使っています。
直接ボタンを指定せず、イベントを発生させたコントロール「e.getSource()」からボタンを割り出しています。

((Button)e.getSource()).setText("クリック");
 String s = ((Button)e.getSource()).getText();


イベント

ボタンに設定するイベントは、マウスクリックが最も一般的だと思います。これを付けなければ、ボタンを押しても何も起こりません。 下はボタン「b1」がクリックされたら、メソッド「mouse1Click( event )」を呼び出します。

 EventHandler<MouseEvent> mouse1Click = ( event ) -> this.mouse1Click( event );
 b1.addEventHandler( MouseEvent.MOUSE_CLICKED , mouse1Click );

サンプルではこのほかに、マウスがコントロールに入ったとき、出たとき、コントロール上で動いた時のイベントを設定しています。

イベントを発生させたコントロールを知る

ボタンがたくさんあって、それらが同じイベントを共有する場合など、どのコントロールがイベントを発生させたかを知るには、 メソッドに持ち込んだEvent eに対して、e.getSource()でObjectを得ることができます。
下は呼び出したオブジェクトをButtonにキャストして、ボタンに表示されている文字を得ています。

 String s = ((Button)e.getSource()).getText();

また、コントロール上のマウスカーソルの座標を得ることもできます。

private void mouse1Move( MouseEvent e ){
 t.setText( "マウスの位置 "+e.getX() +" "+ e.getY() );
return;
}


サンプルプログラムのコード

上の動画のソースコードは下記の通り。

package tomojavalib.fx;

import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.*;
import javafx.scene.text.Font;
import javafx.stage.Stage;

public class ButtonTest2 extends Application {
 Button b1 ;
 Button b2 ;
 TextField t;

public static void main(String[] args) {
 Application.launch(args);
}

 @Override
public void start(Stage stage) throws Exception {
 //StageにPaneを置く
 VBox pane = new VBox();
 //ボタンの初期化
 b1 = new Button( " ボタン " );
 b2 = new Button( " 使用可 " );
 //Paneにボタンを追加
 pane.getChildren().add( b1 );
 pane.getChildren().add( b2 );
 //大きさ設定
 b1.setPrefWidth(80);
 b1.setPrefHeight(20);
 b2.setPrefSize(100, 30);
 //色などの設定
 b1.setStyle("-fx-background-color: #c1c0ff;");
 b2.setStyle("-fx-background-color: LIGHTGRAY;");
 //フォント
 b1.setFont( new Font(12) );
 b2.setFont( new Font(14) );
 //イベント設定
 //マウスがクリックされたとき
 EventHandler<MouseEvent> mouse1Click = ( event ) -> this.mouse1Click( event );
 b1.addEventHandler( MouseEvent.MOUSE_CLICKED , mouse1Click );

 EventHandler<MouseEvent> mouse2Click = ( event ) -> this.mouse2Click( event );
 b2.addEventHandler( MouseEvent.MOUSE_CLICKED , mouse2Click );

 //マウスが入ったとき
 EventHandler<MouseEvent> mouse1enter = ( event ) -> this.mouse1Enter( event );
 b1.addEventHandler( MouseEvent.MOUSE_ENTERED , mouse1enter);

 //マウスが出たとき
 EventHandler<MouseEvent> mouse1exit = ( event ) -> this.mouse1Exit( event );
 b1.addEventHandler( MouseEvent.MOUSE_EXITED , mouse1exit);

 //マウスが動いた時
 EventHandler<MouseEvent> mouse1move = ( event ) -> this.mouse1Move( event );
 b1.addEventHandler( MouseEvent.MOUSE_MOVED , mouse1move);

 t = new TextField( "" );
 pane.getChildren().add( t );

 Scene scene = new Scene(pane, 320, 240);
 stage.setScene(scene);
 stage.show();
}

private void mouse1Click( MouseEvent e ){
 String s = ((Button)e.getSource()).getText();
 if(s.equals(" ボタン1 ")){
 ((Button)e.getSource()).setText("クリック");
 }else{
 ((Button)e.getSource()).setText(" ボタン1 ");
 }
return;
}

private void mouse2Click( MouseEvent e ){
 String s = ((Button)e.getSource()).getText();
 if(s.equals(" 使用可 ")){
 ((Button)e.getSource()).setText("使用不可");
 b1.setDisable(true);
 }else{
 ((Button)e.getSource()).setText(" 使用可 ");
 b1.setDisable(false);
 }
return;
}

private void mouse1Enter( MouseEvent e ){
 t.setText("マウスが入りました");
return;
}

private void mouse1Exit( MouseEvent e ){
 t.setText("マウスが出ました");
return;
}

private void mouse1Move( MouseEvent e ){
 t.setText( "マウスの位置 "+e.getX() +" "+ e.getY() );
return;
}
}

最終更新日: 2017-07-12 08:19:31

ともさんのHP >プロブラミング >JavaFX >JavaFX Button

広告
新着ページ

渋柿で柿渋作り  
新旧文化式とドレメ式原型製図を比較  
水棚の作り方  
DXFファイルの違い  
デジタル顕微カメラ  
萩の栽培、手入れ、増やしかた  
セミの飼いかた  
ダンゴムシの飼い方  
玉縁ボタンホールの縫い方  
柿渋  
ミシンでボタンを付ける  

他のサイト

3D-CAD
洋裁CAD

いいねなど

 RSS 

Author: Tomoyuki Ito

このサイトの文章・写真の無断転載を禁じます