Various improvements

MFXComboBoxSkin, MFXFilterComboBoxSkin: improved popup behavior, fixed popup misbehavior in MFXTableView.

MFXFilterComboBox, MFXFilterComboBoxSkin: added new pseudo class that allows to keep focus css style (must be specified in css ofc) when the editor is focused and the combo box looses its focus.

MFXLabel, MFXLabelSkin: added new pseudo class that allows to keep focus css style (must be specified in css ofc) when the editor is focused and the label looses its focus.

MFXTableViewSkin: maxPopupWidth is a bound value by default now and it works better this way.

mfx-combobox-style1.css, mfx-combobox-style2.css: specify control style when the editor is focused.

Signed-off-by: PAlex404 <alessandro.parisi406@gmail.com>

materialfx/src/main/java/io/github/palexdev/materialfx/controls/MFXFilterComboBox.java

@@ -2,7 +2,10 @@ package io.github.palexdev.materialfx.controls;
 
 import io.github.palexdev.materialfx.MFXResourcesLoader;
 import io.github.palexdev.materialfx.skins.MFXFilterComboBoxSkin;
+import javafx.beans.property.BooleanProperty;
+import javafx.beans.property.SimpleBooleanProperty;
 import javafx.collections.ObservableList;
+import javafx.css.PseudoClass;
 import javafx.scene.control.Skin;
 
 /**
@@ -20,6 +23,9 @@ public class MFXFilterComboBox<T> extends MFXComboBox<T> {
     private final String STYLE_CLASS = "mfx-filter-combo-box";
     private final String STYLESHEET = MFXResourcesLoader.load("css/mfx-filter-combobox.css");
 
+    private static final PseudoClass EDITOR_FOCUSED_PSEUDO_CLASS = PseudoClass.getPseudoClass("editor");
+    private final BooleanProperty editorFocused = new SimpleBooleanProperty();
+
     /**
      * When the popup is shown and the text field is added to the scene the text field is not focused,
      * to change this behavior and force it to be focused you can set this boolean to true.
@@ -45,6 +51,7 @@ public class MFXFilterComboBox<T> extends MFXComboBox<T> {
     //================================================================================
     private void initialize() {
         getStyleClass().add(STYLE_CLASS);
+        editorFocused.addListener(invalidated -> pseudoClassStateChanged(EDITOR_FOCUSED_PSEUDO_CLASS, editorFocused.get()));
     }
 
     public boolean isForceFieldFocusOnShow() {
@@ -55,6 +62,14 @@ public class MFXFilterComboBox<T> extends MFXComboBox<T> {
         this.forceFieldFocusOnShow = forceFieldFocusOnShow;
     }
 
+    public boolean isEditorFocused() {
+        return editorFocused.get();
+    }
+
+    public BooleanProperty editorFocusedProperty() {
+        return editorFocused;
+    }
+
     //================================================================================
     // Override Methods
     //================================================================================

materialfx/src/main/java/io/github/palexdev/materialfx/controls/MFXLabel.java

@@ -20,10 +20,7 @@ package io.github.palexdev.materialfx.controls;
 
 import io.github.palexdev.materialfx.MFXResourcesLoader;
 import io.github.palexdev.materialfx.skins.MFXLabelSkin;
-import javafx.beans.property.ObjectProperty;
-import javafx.beans.property.SimpleObjectProperty;
-import javafx.beans.property.SimpleStringProperty;
-import javafx.beans.property.StringProperty;
+import javafx.beans.property.*;
 import javafx.css.*;
 import javafx.geometry.Pos;
 import javafx.scene.Node;
@@ -64,6 +61,9 @@ public class MFXLabel extends Control {
 
     private final ObjectProperty<Pos> alignment = new SimpleObjectProperty<>(Pos.CENTER);
 
+    private static final PseudoClass EDITOR_FOCUSED_PSEUDO_CLASS = PseudoClass.getPseudoClass("editor");
+    private final BooleanProperty editorFocused = new SimpleBooleanProperty();
+
     //================================================================================
     // Constructors
     //================================================================================
@@ -83,6 +83,8 @@ public class MFXLabel extends Control {
     private void initialize() {
         getStyleClass().add(STYLE_CLASS);
 
+        editorFocused.addListener(invalidated ->pseudoClassStateChanged(EDITOR_FOCUSED_PSEUDO_CLASS, editorFocused.get()));
+
         /* Makes possible to choose the control style without depending on the constructor,
          *  it seems to work well but to be honest it would be way better if JavaFX would give us
          * the possibility to change the user agent stylesheet at runtime (I mean by re-calling getUserAgentStylesheet)
@@ -173,6 +175,10 @@ public class MFXLabel extends Control {
         return trailingIcon;
     }
 
+    public void setTrailingIcon(Node trailingIcon) {
+        this.trailingIcon.set(trailingIcon);
+    }
+
     public Pos getAlignment() {
         return alignment.get();
     }
@@ -188,11 +194,15 @@ public class MFXLabel extends Control {
         this.alignment.set(alignment);
     }
 
-    public void setTrailingIcon(Node trailingIcon) {
-        this.trailingIcon.set(trailingIcon);
+    public boolean isEditorFocused() {
+        return editorFocused.get();
     }
 
-    //================================================================================
+    public BooleanProperty editorFocusedProperty() {
+        return editorFocused;
+    }
+
+//================================================================================
     // Styleable Properties
     //================================================================================
 

materialfx/src/main/java/io/github/palexdev/materialfx/skins/MFXComboBoxSkin.java

@@ -180,10 +180,6 @@ public class MFXComboBoxSkin<T> extends SkinBase<MFXComboBox<T>> {
 
         // FOCUS
         comboBox.focusedProperty().addListener((observable, oldValue, newValue) -> {
-            if (!newValue && popup.isShowing()) {
-                popup.hide();
-            }
-
             if (comboBox.isAnimateLines()) {
                 buildAndPlayLinesAnimation(newValue);
                 return;
@@ -296,6 +292,8 @@ public class MFXComboBoxSkin<T> extends SkinBase<MFXComboBox<T>> {
         icon.getIcon().addEventFilter(MouseEvent.MOUSE_PRESSED, event -> {
             if (popup.isShowing()) {
                 popup.hide();
+                forceRipple();
+                getSkinnable().requestFocus();
                 event.consume();
             }
         });

materialfx/src/main/java/io/github/palexdev/materialfx/skins/MFXFilterComboBoxSkin.java

@@ -192,10 +192,6 @@ public class MFXFilterComboBoxSkin<T> extends SkinBase<MFXFilterComboBox<T>> {
                 return;
             }
 
-            if (!newValue && popup.isShowing()) {
-                popup.hide();
-            }
-
             if (comboBox.isAnimateLines()) {
                 buildAndPlayLinesAnimation(newValue);
                 return;
@@ -323,11 +319,11 @@ public class MFXFilterComboBoxSkin<T> extends SkinBase<MFXFilterComboBox<T>> {
         });
         icon.getIcon().addEventFilter(MouseEvent.MOUSE_PRESSED, event -> {
             if (popup.isShowing()) {
-                reset();
-            } else {
-                show();
+                popup.hide();
+                forceRipple();
+                getSkinnable().requestFocus();
+                event.consume();
             }
-            event.consume();
         });
     }
 
@@ -422,6 +418,7 @@ public class MFXFilterComboBoxSkin<T> extends SkinBase<MFXFilterComboBox<T>> {
 
         valueLabel.setVisible(false);
         searchField = new MFXTextField("");
+        comboBox.editorFocusedProperty().bind(searchField.focusedProperty());
         searchField.setPromptText("Search...");
         searchField.setId("search-field");
         searchField.getStylesheets().setAll(comboBox.getUserAgentStylesheet());

materialfx/src/main/java/io/github/palexdev/materialfx/skins/MFXLabelSkin.java

@@ -223,6 +223,7 @@ public class MFXLabelSkin extends SkinBase<MFXLabel> {
 
         textNode.setVisible(false);
         MFXTextField textField = new MFXTextField(textNode.getText());
+        label.editorFocusedProperty().bind(textField.focusedProperty());
         textField.setId("editor-node");
         textField.setManaged(false);
         textField.setUnfocusedLineColor(Color.TRANSPARENT);

materialfx/src/main/java/io/github/palexdev/materialfx/skins/MFXTableViewSkin.java

@@ -168,7 +168,6 @@ public class MFXTableViewSkin<T> extends SkinBase<MFXTableView<T>> {
 
         rowsPerPageCombo = new MFXComboBox<>();
         rowsPerPageCombo.setComboStyle(Styles.ComboBoxStyles.STYLE2);
-        rowsPerPageCombo.setMaxPopupWidth(100);
         rowsPerPageCombo.setMaxPopupHeight(100);
         HBox.setMargin(rowsPerPageCombo, new Insets(0, -5, 0, 0));
         tableView.maxRowsProperty().bind(rowsPerPageCombo.selectedValueProperty());

materialfx/src/main/resources/io/github/palexdev/materialfx/css/mfx-combobox-style1.css

@@ -42,6 +42,10 @@
     -mfx-color: rgb(76, 0, 225);
 }
 
+.mfx-combo-box:editor .mfx-icon-wrapper .mfx-font-icon {
+    -mfx-color: rgb(76, 0, 225);
+}
+
 .mfx-list-view {
     -fx-background-color: white;
     -fx-border-color: #A4B1B6;

materialfx/src/main/resources/io/github/palexdev/materialfx/css/mfx-combobox-style2.css

@@ -26,7 +26,8 @@
     -fx-border-width: 1.2;
 }
 
-.mfx-combo-box:focused {
+.mfx-combo-box:focused,
+.mfx-combo-box:editor {
     -fx-border-color: rgb(76, 0, 225);
 }
 
@@ -48,6 +49,10 @@
     -mfx-color: rgb(76, 0, 225);
 }
 
+.mfx-combo-box:editor .mfx-icon-wrapper .mfx-font-icon {
+    -mfx-color: rgb(76, 0, 225);
+}
+
 .mfx-list-view {
     -fx-background-color: white;
     -fx-border-color: #A4B1B6;