JavaFX ログインフォーム作成にあたり･･･

Question

ログインフォーム作成において，idまたはパスワードのtextFieldが空（1文字も入力されていない）の時はログインボタンを押せないようにしたいです．idとパスワードが双方1文字以上入力されていればボタンを押せるようにしたいです．
どのようにやれば良いのでしょうか？
新しくクラスを生成する必要はありますか？

プログラムソース(Controller.java)

package testSystem;

import java.net.URL;
import java.util.ResourceBundle;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.control.Button;
import javafx.scene.control.Hyperlink;
import javafx.scene.control.Label;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;

public class LoginController {

    @FXML
    private ResourceBundle resources;

    @FXML
    private URL location;

    @FXML
    private TextField num;

    @FXML
    private PasswordField passwd;

    @FXML
    private Button loginButton;

    @FXML
    private Hyperlink createLink;

    @FXML
    private Label warning;

    @FXML
    void initialize() {
        assert id != null : "fx:id=\"id\" was not injected: check your FXML file 'Login.fxml'.";
        assert passwd != null : "fx:id=\"passwd\" was not injected: check your FXML file 'Login.fxml'.";
        assert loginButton != null : "fx:id=\"loginButton\" was not injected: check your FXML file 'Login.fxml'.";
        assert createLink != null : "fx:id=\"createLink\" was not injected: check your FXML file 'Login.fxml'.";
        assert warning != null : "fx:id=\"warning\" was not injected: check your FXML file 'Login.fxml'.";
    }

    @FXML
    public void OnClick(ActionEvent event) {
    	String idNumber = id.getText();
    	String password = passwd.getText();

    	if(idNumber.equals("test")&&password.equals("test")) {
    		System.out.print("id:"+idNumber+" pass:"+password+" → ");
    		System.out.println("成功");
    		id.setText("");
    		passwd.setText("");
    		warning.setText("OK");//本来はここで画面遷移させる

    	}
    	else {
    		System.out.print("id:"+idNumber+" pass:"+password+" → ");
    		System.out.println("失敗");
    		id.setText("");//TextFieldを空(ｶﾗ)にする
    		passwd.setText("");//PasswdFieldを空にする
    		warning.setText("※正しいアカウント情報を入力してください");
    	}
    }
}

Comments

[wwbQzhMkhhgEmhU]

えーっと、さすがに元となるコードを貼るべきではないでしょうか？
JavaFXというマイナーな技術(比較的資料が少ない)を初学に近そうな方がやっているのでフォローしてますが、ちょっと作業を省略しすぎですよ。ともあれ、
・Key Typedイベントで入力待ち
・ButtonにsetDisable
で、機能の実現はできると思います。考えてみてください。

[P_Beginner]

Controller.java
途中までというかテスト的なものですが，作ったところまで追記しました．

[P_Beginner]

KeyTypedの使い方ですが，調べてもわかりません．
使用例とかありますか？

[Tsukasa7613]

会話中に失礼します。動作の目的が見えないためコードを貼っていただきたいとは思いますが、推測でコメントさせていただきます。
文字が入力されていないとき「ボタンを押せなくする」のではなく、「ボタンを押しても何も処理を行わない(ログインさせない)」という記述では理想の動作は実現できないのでしょうか？
P_Beginner様が初学者ならば、なおさら比較的楽に実装できる方法の模索も大切だと思います。

[wwbQzhMkhhgEmhU]

まず追記されていません。

[P_Beginner]

追記しました

[wwbQzhMkhhgEmhU]

Tsukasa7613さんのおっしゃることももっともですね。最初どっちにするか迷いました。そちらで行くのもありですよ。

とりあえず、KeyTypedですが、使い方はKeyPressedとかと同じです。そちらの使用例ならすぐ見つかると思うので参考にしてください。大雑把ですが、KeyPressedは押されたときと離されたときを区別したいときに使います。区別しないでいいときはKeyTypedでいいかと思います。細かい違いは実際動かしてみたり、別の場所で調べてみてください。

Answer 1

こうした場合JavaFXではイベントハンドラーで何かするよりもっと直接的で宣言的な定義が可能です。
それはプロパティーへのバインドです。

public class LoginController {
  @FXML
  private TextField idField;
  @FXML
  private PasswordField pwField;
  @FXML
  private Button loginButton;

  @FXML
  private void initialize() {
    BooleanBinding idIsEmpty = idField.textProperty().isEmpty();
    BooleanBinding pwIsEmpty = pwField.textProperty().isEmpty();
    loginButton.disableProperty().bind(idIsEmpty.or(pwIsEmpty));
  }
}

この例でidIsEmptyはidFieldのtextプロパティーが空かどうかを表します。注意すべきは「idFieldの状態変化に自動的に追従した真偽値を表している」点です。pwIsEmptyも同様です。この２つをand/orなどで結合することもできます。結果は「そうあってほしい」と期待するとおりの意味になります。これをloginButtonのdisablePropertyへbindすることでお望みのことが実現できます。

上記コードはイベントハンドラーで表現すると概ね以下と同様の意味になります。

public class LoginController {
  @FXML
  private TextField idField;
  @FXML
  private PasswordField pwField;
  @FXML
  private Button loginButton;

  @FXML
  private void initialize() {
    // 初期状態を設定
    loginButton.setDisable(idField.getText().isEmpty() && pwField.getText().isEmpty());
    // idFieldのtextプロパティーが変化したらloginButtonの状態を更新
    idField.textProperty().addListener((ov, nv, ob) ->
      loginButton.setDisable(nv.isEmpty() && pwField.getText().isEmpty()));
    // pwFieldのtextプロパティーが変化したらloginButtonの状態を更新
    pwField.textProperty().addListener((ov, nv, ob) ->
      loginButton.setDisable(nv.isEmpty() && idField.getText().isEmpty()));
  }
}

JavaFXのNodeの属性はほぼ例外なくJavaFXプロパティーとして表現されておりJavaFXはObservableなもの、つまり監視可能なオブジェクトとしての機能を持っています。このためchangeListenerなどで監視できるわけですがバインディングを用いるとよくある状態変化を簡潔に宣言的に表現できるのでコードの意味が把握しやすくバグも減らせると思います。

Comments

[wwbQzhMkhhgEmhU]

回答ありがとうございます。通知が迷惑メールに入っていたので気づくのが遅くなりました。
またJavaFXにバインディングがあるとは思っておらず、ミスリーディングしてたのを軌道修正して頂き感謝です。

何かと資料が少ないと感じてならないJavaFXですが、別建てでバインディングのチュートリアルがあったので、載せておきます。
https://docs.oracle.com/javase/jp/8/javafx/properties-binding-tutorial/index.html
どうもバインディングはJava 8のときに追加されたようです。今まで見てた資料では、なんかswingの方がマシと思っていましたが、バインディングまで出来るなら少し評価上がりそうです。良かったら

・JavaFXの今後の展望に関する個人的な見解(SEから外されてしまったりしてるので)
・初心者にオススメなサイト(できれば機能が網羅されているもの)

などを教えて頂けたらと思います。

[KSwordOfHaste]

自分はアマチュアなのでプロの方のような知見がないし、あまり気にしてないというのが正直なところです。ただJava8で一旦JDKへ取り込まれたJavaFXがJava11で外されたことから素人目にOracle/プロの方がJavaを主としてサーバーサイド技術としてのみ見ておりクライアントサイドの技術はおまけ（あるいは過去の遺産？）という認識であるような気はします。そのためまだまだ機能不足が多い感のあるJavaFXが活発にエンハンスされるかどうか疑問です。
・FXMLの機能不足
・stylesheetでのfx:xxxという属性名が不評だがいまさらどうしようもない?
・Java自身の問題でもあるがプロパティーの記述のボイラープレートコードが鬱陶しい
　（多分よいアノテーションプロセッサがあればずいぶんJavaFXで書くのが楽しくなる気がしますがそういうものを自分は知りません。）

純粋に技術的側面から言えばswingの設計にあった古臭い点のいくつかは進んだ設計になっていてよいとは感じます。そのため自分はスタンドアロンGUIアプリをJavaで作るならswingでなくJavaFXを使います。ただ他のGUI構築に比べてJavaFXを積極的に使うというほどでもないので微妙なところ・・・

[KSwordOfHaste]

残念ながら初心者にオススメなサイトを自分は知りません。JavaFXを活発に学んでいたのはJava8が出たばかりの時期でしたけど一番参考になったのはOracleのチュートリアルとリファレンスだったという認識です。当たり前だと思いますがswing/JavaFXいずれにせよ先に
・Javaそのものの知識
・オブジェクト指向設計の経験
・GUIの基本的考え方(イベントループ方式など)
・リファレンスを見て仕様をつかむこと
・ある程度のデバッグ技術
を身に着けているかどうかでGUIプログラミングの学習時間がかなり違ってくると思います。いわゆるプログラミングの初心者の方がJava/オブジェクト指向設計にまだ慣れてない段階でGUIを学ぼうとするのは知るべきことや前提知識が多すぎて混乱しやすいのではないでしょうか？

いわゆるプログラミングの初心者の方にとって参考書的なもので段階を踏んで学ぶのがの良い方法なのではないかと思います(ご自分の実力にあった参考書を選ぶのがコツですが)。逆にJava/オブジェクト指向設計に経験があり、JavaFXのみ知らないという方なら例えば参考書を使ってもスラスラ読めるでしょうし、参考書なしにチュートリアルとリファレンスでなんとかするのも可能だと思います。

[wwbQzhMkhhgEmhU]

ありがとうございます。

■JavaFXの今後の展望に関する個人的な見解について
そうですね。JavaFXをswingの後継として説明していいかな、という気になりました。
今どきクライアント側のGUIは滅多なことで作りませんが、作ったとしてWPF(.NET)が多い気がします。ただ、過去の遺物のエンハンスは頼まれればやることもあり(MFCとかVB6でも(こういうのは主に組込系ですが))、その際にプラットフォームの指定は変えられません。なのでJavaという指定であった場合、awt/swing/JavaFXをどう見るかは設計選択する上で重要だったりはします。そういう意味で、JavaFXをswingの後継として見れる、のは自分の中では大きいことだと思います。ありがとうございました。

■初心者にオススメなサイト
そうですか、ちょっと難しそうですね。コーディングして動かして目で見て分かる、という意味でGUIを最初にやる人はそれなりにいそうな気もしますが、難しいですよね。今どきだとJavaScriptあたりにして、Electronから入る、というのもありな気もします。Electron自体を業務で使えるかどうかは微妙ですが。。。