web-dev-qa-db-ja.com

JavaFX PasswordFieldのマスクを解除する方法、またはTextFieldを適切にマスクする方法は?

私のUIには、 PasswordField のようなものがあります(一番下にあるものをurm!):

Login dialog with JavaFX PasswordField

写真に表示されているチェックボックスをチェックして、すべての「秘密の」パスワード文字を表示できるようにしたい。多くの最新のパスワード要求UIから得られるオプションと大差ありません。 しかし、JavaFX APIでそれを可能にするものが見つかりませんか?

私の心配が当てはまる場合は、最後に押されたキーを0.5秒間だけ、または次のキーが押されるまで表示するTextFieldを使用します。その後、彼は以前のすべてのユーザー入力をマスクします。これにより、最新のUIで時々見られるクールなアニメーション効果が得られます。ただし、OSに依存する方法はありますか(OSに依存すると思いますか??)パスワードエコー文字を使用する必要がありますか?

そのOS依存の文字を取得できない場合は、画像に表示されている文字(Windows 8マシンのJavaFX)を使用できれば幸いです。この見知らぬ人のためのUTF-8コードポイントは何ですか?

14

>しかし、JavaFX APIでそれを可能にするものが見つかりませんか?

PasswordFieldコンポーネントは、デフォルトではマスクされたテキストを表示しません。ただし、PasswordFieldTextFieldと一緒に使用し、これらのコンポーネントをそれぞれ使用してマスクされたテキストとマスクされていないテキストを切り替えることができます。以下のデモ例のように、マスクされていないテキストがTextFieldで示されている場合。

>最後に押されたキーを0.5秒間だけ、または次のキーが押されるまで表示するTextFieldを使用したい、その後、彼は以前のすべてのユーザー入力をマスクするものとします。

PasswordFieldなので、それ自体はTextFieldの拡張バージョンです。言及したプロパティを使用して、いつでも独自のカスタムパスワードテキストボックスを作成できます。

>OSに依存する(OSに依存すると思いますか??)パスワードを取得する方法はありますか?使用すべきエコー文字?

率直に言って、あなたがここで言っていることをつかみませんでした。 PasswordField.textPrperty()に変更リスナーを追加してテキストの変更を追跡し、アニメーションやタイマーなどを実行できます。PasswordFieldSkinを拡張してCSS-fx-skinで使用することにより、デフォルトの箇条書きマスクを上書きできます。その ソースはこちら の弾丸の定義を参照してください:

public class PasswordFieldSkin extends TextFieldSkin {
    public static final char BULLET = '\u2022';

    public PasswordFieldSkin(PasswordField passwordField) {
        super(passwordField, new PasswordFieldBehavior(passwordField));
    }

    @Override protected String maskText(String txt) {
        TextField textField = getSkinnable();

        int n = textField.getLength();
        StringBuilder passwordBuilder = new StringBuilder(n);
        for (int i=0; i<n; i++) {
            passwordBuilder.append(BULLET);
        }

        return passwordBuilder.toString();
    }
}

最後に、バインディングを使用してパスワード文字を表示するデモアプリを開始します。

@Override
public void start(Stage primaryStage) {

    // text field to show password as unmasked
    final TextField textField = new TextField();
    // Set initial state
    textField.setManaged(false);
    textField.setVisible(false);

    // Actual password field
    final PasswordField passwordField = new PasswordField();

    CheckBox checkBox = new CheckBox("Show/Hide password");

    // Bind properties. Toggle textField and passwordField
    // visibility and managability properties mutually when checkbox's state is changed.
    // Because we want to display only one component (textField or passwordField)
    // on the scene at a time.
    textField.managedProperty().bind(checkBox.selectedProperty());
    textField.visibleProperty().bind(checkBox.selectedProperty());

    passwordField.managedProperty().bind(checkBox.selectedProperty().not());
    passwordField.visibleProperty().bind(checkBox.selectedProperty().not());

    // Bind the textField and passwordField text values bidirectionally.
    textField.textProperty().bindBidirectional(passwordField.textProperty());

    VBox root = new VBox(10);
    root.getChildren().addAll(passwordField, textField, checkBox);
    Scene scene = new Scene(root, 300, 250);
    primaryStage.setTitle("Demo");
    primaryStage.setScene(scene);
    primaryStage.show();
}
30
Uluk Biy

3つの要素を作成する必要があります。

  • TextField:パスワード表示フィールド
  • PasswodField:パスワードが表示されないフィールド
  • チェックボックス:トグル可視性フィールド

パスワードフィールドを同じ位置(x、y)に配置します。

<PasswordField fx:id="pass_hidden" layoutX="X" layoutY="Y" />
<TextField fx:id="pass_text" layoutX="X" layoutY="Y"/>
<CheckBox fx:id="pass_toggle" onAction="#togglevisiblePassword" .... />

注:XYの値を置き換えます。

コントローラを追加します。

@FXML
private TextField pass_text;
@FXML
private CheckBox pass_toggle;
@FXML
private Button btn_start_stop;

/**
 * Controls the visibility of the Password field
 * @param event
 */
@FXML
public void togglevisiblePassword(ActionEvent event) {
    if (pass_toggle.isSelected()) {
        pass_text.setText(pass_hidden.getText());
        pass_text.setVisible(true);
        pass_hidden.setVisible(false);
        return;
    }
    pass_hidden.setText(pass_text.getText());
    pass_hidden.setVisible(true);
    pass_text.setVisible(false);
}

//Run
@Override
public void initialize(URL location, ResourceBundle resources) {
    this.togglevisiblePassword(null);
}

パスワードの値を知りたい場合は、パスワードを返すメソッドを作成できます。

private String passwordValue() {
    return pass_toggle.isSelected()?
       pass_text.getText(): pass_hidden.getText();
}
3
fitorec

私はこれが古いことを知っていますが、私は答えを探していました、そしてこれは私の解決策です:

@FXML
private JFXButton showpassword;
private String password;

showpassword.addEventFilter(MouseEvent.MOUSE_PRESSED, e -> {
            password = passwordField.getText();
            passwordField.clear();
            passwordField.setPromptText(password);
        });
        showpassword.addEventFilter(MouseEvent.MOUSE_RELEASED, e -> {
            passwordField.setText(password);
            passwordField.setPromptText("Password");
        });

「WIN10Eye-パスワードのマスクを解除する」のようなグラフィックのボタンを使用する

2
zuby33
 void viewpass(ActionEvent event) {




  if (checkpass.isSelected()){
 pass.setPromptText(pass.getText());
 pass.setText(""); 
  pass.setDisable(true);

  }else {
 pass .setText(pass.getPromptText());
 pass.setPromptText("");
 pass.setDisable(false);
 }






}