UI/UX: Add 'TagBar' in Alert Log Monitoring menu (at Search keyword region)

Author: Dokyeongyun

src/main/java/root/javafx/Controller/AlertLogMonitoringMenuController.java

@@ -18,12 +18,16 @@
 import javafx.event.EventHandler;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
+import javafx.geometry.Insets;
 import javafx.scene.control.Alert.AlertType;
 import javafx.scene.control.DatePicker;
+import javafx.scene.control.ScrollPane;
+import javafx.scene.control.ScrollPane.ScrollBarPolicy;
 import javafx.scene.control.TextField;
 import javafx.scene.input.KeyCode;
 import javafx.scene.input.KeyEvent;
 import javafx.scene.layout.AnchorPane;
+import javafx.scene.layout.HBox;
 import javafx.scene.layout.StackPane;
 import lombok.extern.slf4j.Slf4j;
 import root.common.server.implement.JschServer;
@@ -43,6 +47,7 @@
 import root.javafx.CustomView.AlertLogListViewCell;
 import root.javafx.CustomView.AlertLogMonitoringSummaryAP;
 import root.javafx.CustomView.NumberTextFormatter;
+import root.javafx.CustomView.TagBar;
 import root.javafx.CustomView.dateCell.DisableAfterTodayDateCell;
 import root.utils.AlertUtils;
 
@@ -70,7 +75,10 @@ public class AlertLogMonitoringMenuController implements Initializable {
 
 	@FXML
 	StackPane alertLogSummarySP;
-
+	
+	@FXML
+	HBox searchKeywordHBox;
+	
 	@FXML
 	TextField navigatorTF;
 
@@ -83,6 +91,8 @@ public class AlertLogMonitoringMenuController implements Initializable {
 	@FXML
 	AnchorPane summaryNodataAP;
 
+	TagBar tagBar = new TagBar();
+	
 	Map<String, AlertLog> alertLogMonitoringResultMap;
 
 	public AlertLogMonitoringMenuController() {
@@ -182,7 +192,22 @@ public void handle(KeyEvent e) {
 				}
 			}
 		});
-
+		
+		// Search Keyword Tagbar
+		ScrollPane tagBarWrapper = new ScrollPane(tagBar);
+		tagBarWrapper.setStyle("-fx-border-width: 0.2px; -fx-border-color: gray;");
+		tagBarWrapper.getStyleClass().add("gray-scrollbar");
+		tagBarWrapper.setMaxWidth(375);
+		tagBarWrapper.setMinHeight(45);
+		tagBarWrapper.setFitToHeight(true);
+		tagBarWrapper.prefHeightProperty().bind(searchKeywordHBox.heightProperty());
+		tagBarWrapper.setHbarPolicy(ScrollBarPolicy.AS_NEEDED);
+        HBox.setMargin(tagBarWrapper, new Insets(0, 0, 0, 25));
+        searchKeywordHBox.getChildren().add(tagBarWrapper);
+
+        tagBar.setMaxWidth(355);
+        tagBarWrapper.vvalueProperty().bind(tagBar.heightProperty());
+        
 		// Set view visible
 		mainNodataAP.setVisible(true);
 		alertLogLV.setVisible(false);

src/main/resources/fxml/AlertLogMonitoringMenu.fxml

@@ -3,7 +3,6 @@
 <?import com.jfoenix.controls.JFXButton?>
 <?import com.jfoenix.controls.JFXComboBox?>
 <?import com.jfoenix.controls.JFXListView?>
-<?import com.jfoenix.controls.JFXTextArea?>
 <?import com.jfoenix.controls.JFXToggleButton?>
 <?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
 <?import java.lang.String?>
@@ -167,7 +166,7 @@
                                              </items>
                                           </SplitPane>
                                           <Separator layoutX="5.0" layoutY="505.6000061035156" AnchorPane.bottomAnchor="120.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" />
-                                          <SplitPane dividerPositions="0.5" layoutX="5.0" layoutY="508.6000061035156" maxHeight="110.0" minHeight="110.0" prefHeight="110.0" style="-fx-background-radius: 5px; -fx-background-color: white;" styleClass="divider-exist" AnchorPane.bottomAnchor="5.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
+                                          <SplitPane dividerPositions="0.5" layoutX="5.0" layoutY="508.6000061035156" maxHeight="115.0" minHeight="115.0" prefHeight="115.0" style="-fx-background-radius: 5px; -fx-background-color: white;" styleClass="divider-exist" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
                                              <items>
                                                 <AnchorPane>
                                                    <children>
@@ -209,20 +208,11 @@
                                                                   <String fx:value="basic-font" />
                                                                </styleClass>
                                                             </Label>
-                                                            <JFXTextArea maxWidth="375.0" style="-fx-border-width: 0.2px; -fx-border-color: black;">
-                                                               <HBox.margin>
-                                                                  <Insets left="25.0" />
-                                                               </HBox.margin>
-                                                               <styleClass>
-                                                                  <String fx:value="gray-scrollbar" />
-                                                                  <String fx:value="basic-font" />
-                                                               </styleClass>
-                                                            </JFXTextArea>
                                                          </children>
                                                       </HBox>
                                                    </children>
                                                    <padding>
-                                                      <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
+                                                      <Insets bottom="10.0" left="10.0" right="10.0" />
                                                    </padding>
                                                 </AnchorPane>
                                                 <AnchorPane>
@@ -282,7 +272,7 @@
                                                       </HBox>
                                                    </children>
                                                    <padding>
-                                                      <Insets bottom="10.0" left="20.0" right="10.0" top="10.0" />
+                                                      <Insets bottom="10.0" left="20.0" right="10.0" />
                                                    </padding>
                                                 </AnchorPane>
                                              </items>