Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve materialtextfield validation #1993

Merged
merged 3 commits into from
Apr 5, 2024
Merged

Improve materialtextfield validation #1993

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
56370d6
changed helpLabel code to errorLabel code for error validation and allow
ItoroD Mar 23, 2024
5f018d5
Improve input validation
HenrikJannsen Apr 4, 2024
e345c0f
Remove public API for errorLabel as it is used only by internal valid…
HenrikJannsen Apr 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 32 additions & 20 deletions apps/desktop/desktop/src/main/java/bisq/desktop/components/controls/MaterialTextField.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,8 @@ public class MaterialTextField extends Pane {
@Getter
protected final Label helpLabel = new Label();
@Getter
protected final Label errorLabel = new Label();
@Getter
private final BisqIconButton iconButton = new BisqIconButton();
private ChangeListener<Number> iconButtonHeightListener;

Expand Down Expand Up @@ -90,7 +92,6 @@ public MaterialTextField(@Nullable String description, @Nullable String prompt,

descriptionLabel.setLayoutX(16);
descriptionLabel.setMouseTransparent(true);
// descriptionLabel.setStyle("-fx-font-family: \"IBM Plex Sans Light\";");
if (StringUtils.isNotEmpty(description)) {
descriptionLabel.setText(description);
}
Expand Down Expand Up @@ -118,7 +119,13 @@ public MaterialTextField(@Nullable String description, @Nullable String prompt,
helpLabel.setText(help);
}

getChildren().addAll(bg, line, selectionLine, descriptionLabel, textInputControl, iconButton, helpLabel);
errorLabel.setLayoutX(16);
errorLabel.setMouseTransparent(true);
errorLabel.getStyleClass().add("material-text-field-error");
errorLabel.setManaged(false);
errorLabel.setVisible(false);

getChildren().addAll(bg, line, selectionLine, descriptionLabel, textInputControl, iconButton, helpLabel, errorLabel);

widthProperty().addListener(new WeakReference<ChangeListener<Number>>((observable, oldValue, newValue) ->
onWidthChanged((double) newValue)).get());
Expand All @@ -127,7 +134,6 @@ public MaterialTextField(@Nullable String description, @Nullable String prompt,
onInputTextFieldFocus(newValue)).get());
descriptionLabel.textProperty().addListener(new WeakReference<ChangeListener<String>>((observable, oldValue, newValue) ->
update()).get());

promptTextProperty().addListener(new WeakReference<ChangeListener<String>>((observable, oldValue, newValue) ->
update()).get());
helpProperty().addListener(new WeakReference<ChangeListener<String>>((observable, oldValue, newValue) ->
Expand Down Expand Up @@ -175,36 +181,35 @@ public void setValidators(ValidatorBase... validators) {
validationControl.setValidators(validators);
}

// TODO add custom errorLabel and not reuse helpLabel as it would cause an exception when binding at the helpLabel is used
public boolean validate() {
isValid.set(validationControl.validate());
selectionLine.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, !isValid.get());
descriptionLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, !isValid.get());
getActiveValidator().ifPresentOrElse(validator -> {
helpLabel.setText(validator.getMessage());
helpLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, true);
},
() -> {
helpLabel.setText("");
helpLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, false);
});
return isValid.get();
resetValidation();
boolean valid = validationControl.validate();
isValid.set(valid);
selectionLine.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, !valid);
descriptionLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, !valid);
errorLabel.setVisible(!valid);
errorLabel.setManaged(errorLabel.isVisible());
Optional<ValidatorBase> activeValidator = getActiveValidator();
errorLabel.setText(activeValidator.map(ValidatorBase::getMessage).orElse(""));
update();
return valid;
}

public void resetValidation() {
validationControl.resetValidation();
isValid.set(false);
selectionLine.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, false);
descriptionLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, false);
helpLabel.pseudoClassStateChanged(PSEUDO_CLASS_ERROR, false);
helpLabel.setText("");
errorLabel.setText("");
}

private final BooleanProperty isValid = new SimpleBooleanProperty();

public BooleanProperty isValidProperty() {
return isValid;
}


///////////////////////////////////////////////////////////////////////////////////////////////////
// Description
///////////////////////////////////////////////////////////////////////////////////////////////////
Expand Down Expand Up @@ -406,6 +411,7 @@ protected void onWidthChanged(double width) {
double iconWidth = iconButton.isVisible() ? 25 : 0;
textInputControl.setPrefWidth(width - 2 * textInputControl.getLayoutX() - iconWidth);
helpLabel.setPrefWidth(width - 2 * helpLabel.getLayoutX());
errorLabel.setPrefWidth(width - 2 * errorLabel.getLayoutX());
}
}

Expand All @@ -432,6 +438,7 @@ protected void doLayout() {
selectionLine.setLayoutY(getBgHeight() - 2);
textInputControl.setLayoutY(getFieldLayoutY());
helpLabel.setLayoutY(getBgHeight() + 3.5);
errorLabel.setLayoutY(getBgHeight() + 3.5);
}

private void layoutIconButton() {
Expand Down Expand Up @@ -465,8 +472,9 @@ void update() {
Transitions.animateLayoutY(descriptionLabel, 16.5, Transitions.DEFAULT_DURATION / 6d, null);
}
}
helpLabel.setVisible(StringUtils.isNotEmpty(helpProperty().get()));
helpLabel.setManaged(StringUtils.isNotEmpty(helpProperty().get()));

helpLabel.setVisible(isValid.get() && StringUtils.isNotEmpty(getHelpText()));
helpLabel.setManaged(helpLabel.isVisible());

descriptionLabel.getStyleClass().remove("material-text-field-description-read-only");
textInputControl.getStyleClass().remove("material-text-field-read-only");
Expand Down Expand Up @@ -501,8 +509,10 @@ void update() {
descriptionLabel.getStyleClass().add("material-text-field-description-read-only");
textInputControl.getStyleClass().add("material-text-field-read-only");
}

setOpacity(textInputControl.isDisabled() ? 0.35 : 1);
UIThread.runOnNextRenderFrame(this::layoutIconButton);
layout();
}

protected void removeBgStyles() {
Expand All @@ -529,6 +539,8 @@ protected double getFieldLayoutY() {
protected double computeMinHeight(double width) {
if (helpLabel.isManaged()) {
return helpLabel.getLayoutY() + helpLabel.getHeight();
} else if (errorLabel.isManaged()) {
return errorLabel.getLayoutY() + errorLabel.getHeight();
} else {
return getBgHeight();
}
Expand Down
16 changes: 15 additions & 1 deletion ...top/desktop/src/main/java/bisq/desktop/components/controls/validator/NumberValidator.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@

package bisq.desktop.components.controls.validator;

import bisq.common.util.StringUtils;
import javafx.scene.control.TextInputControl;
import javafx.util.StringConverter;
import javafx.util.converter.NumberStringConverter;
Expand All @@ -33,15 +34,22 @@ public class NumberValidator extends ValidatorBase {
private Optional<Number> maxValue = Optional.empty();
@Getter
private Optional<Number> numberValue = Optional.empty();
private final boolean allowEmptyString;

public NumberValidator(String message) {
super(message);
this.allowEmptyString = false;
}

public NumberValidator(String message, Number minValue, Number maxValue) {
this(message, minValue, maxValue, true);
}

public NumberValidator(String message, Number minValue, Number maxValue, boolean allowEmptyString) {
super(message);
this.minValue = Optional.of(minValue);
this.maxValue = Optional.of(maxValue);
this.allowEmptyString = allowEmptyString;
}

public void setMinValue(Number minValue) {
Expand All @@ -54,9 +62,15 @@ public void setMaxValue(Number maxValue) {

@Override
protected void eval() {
hasErrors.set(false);
var textField = (TextInputControl) srcControl.get();
try {
Number value = NUMBER_STRING_CONVERTER.fromString(textField.getText());
String text = textField.getText();
if (allowEmptyString && StringUtils.isEmpty(text)) {
return;
}

Number value = NUMBER_STRING_CONVERTER.fromString(text);
numberValue = Optional.of(value);

if (minValue.isPresent()) {
Expand Down
4 changes: 2 additions & 2 deletions .../java/bisq/desktop/main/content/authorized_role/security_manager/SecurityManagerView.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,10 +61,10 @@
public class SecurityManagerView extends View<VBox, SecurityManagerModel, SecurityManagerController> {
private static final ValidatorBase DIFFICULTY_ADJUSTMENT_FACTOR_VALIDATOR =
new NumberValidator(Res.get("authorizedRole.securityManager.difficultyAdjustment.invalid", NetworkLoad.MAX_DIFFICULTY_ADJUSTMENT),
0, NetworkLoad.MAX_DIFFICULTY_ADJUSTMENT);
0, NetworkLoad.MAX_DIFFICULTY_ADJUSTMENT, false);
private static final ValidatorBase MIN_REPUTATION_SCORE_VALIDATOR =
new NumberValidator(Res.get("authorizedRole.securityManager.minRequiredReputationScore.invalid", ReputationScore.MAX_VALUE),
0, ReputationScore.MAX_VALUE);
0, ReputationScore.MAX_VALUE, false);

private final Button difficultyAdjustmentButton, minRequiredReputationScoreButton, sendAlertButton;
private final MaterialTextArea message;
Expand Down
19 changes: 10 additions & 9 deletions apps/desktop/desktop/src/main/resources/css/text.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -590,10 +590,6 @@
-fx-background-color: -bisq2-green;
}

.material-text-field-selection-line:error {
-fx-background-color: -bisq2-red;
}

.material-text-field-bg {
-fx-background-color: rgba(255, 255, 255, 0.05);
-fx-background-radius: 4 4 0 0;
Expand All @@ -619,10 +615,6 @@
-fx-text-fill: -bisq2-green;
}

.material-text-field-description-selected:error {
-fx-text-fill: -bisq2-red;
}

.material-text-field-description-deselected {
-fx-text-fill: -fx-mid-text-color;
}
Expand All @@ -641,7 +633,16 @@
-fx-font-family: "IBM Plex Sans Light";
}

.material-text-field-help:error {
.material-text-field-selection-line:error,
.material-text-field-description-deselected:error,
.material-text-field-description-read-only:error,
.material-text-field-description-selected:error,
.material-text-field-description-small:error,
.material-text-field-description-big:error {
-fx-text-fill: -bisq2-red;
}

.material-text-field-error {
-fx-font-size: 0.95em;
-fx-text-fill: -bisq2-red;
-fx-font-family: "IBM Plex Sans Light";
Expand Down
Loading