From d9b31ffd18a1af36f9dc9abc5769f2d3e550d1a6 Mon Sep 17 00:00:00 2001
From: Glavo <zjx001202@gmail.com>
Date: Sat, 7 Feb 2026 18:02:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20TwoLineListItem=20?=
 =?UTF-8?q?=E4=B8=AD=E6=A0=87=E7=AD=BE=E7=9A=84=E5=B1=95=E7=A4=BA=E6=96=B9?=
 =?UTF-8?q?=E5=BC=8F=20(#5465)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hmcl/ui/construct/TwoLineListItem.java    | 28 +++++++++++++++----
 HMCL/src/main/resources/assets/css/root.css   | 15 ++++++----
 2 files changed, 33 insertions(+), 10 deletions(-)

diff --git a/HMCL/src/main/java/org/jackhuang/hmcl/ui/construct/TwoLineListItem.java b/HMCL/src/main/java/org/jackhuang/hmcl/ui/construct/TwoLineListItem.java
index 27d22392d..18e3e52f2 100644
--- a/HMCL/src/main/java/org/jackhuang/hmcl/ui/construct/TwoLineListItem.java
+++ b/HMCL/src/main/java/org/jackhuang/hmcl/ui/construct/TwoLineListItem.java
@@ -22,9 +22,14 @@ import javafx.beans.property.StringProperty;
 import javafx.beans.property.StringPropertyBase;
 import javafx.collections.FXCollections;
 import javafx.collections.ObservableList;
+import javafx.css.PseudoClass;
+import javafx.geometry.Pos;
 import javafx.scene.control.Label;
+import javafx.scene.control.ScrollPane;
 import javafx.scene.layout.HBox;
+import javafx.scene.layout.Priority;
 import javafx.scene.layout.VBox;
+import org.jackhuang.hmcl.ui.FXUtils;
 
 public class TwoLineListItem extends VBox {
     private static final String DEFAULT_STYLE_CLASS = "two-line-list-item";
@@ -44,6 +49,7 @@ public class TwoLineListItem extends VBox {
 
         this.firstLine = new HBox(lblTitle);
         firstLine.getStyleClass().add("first-line");
+        firstLine.setAlignment(Pos.CENTER_LEFT);
 
         this.getChildren().setAll(firstLine);
     }
@@ -157,23 +163,35 @@ public class TwoLineListItem extends VBox {
 
             var tagsBox = new HBox(8);
             tagsBox.getStyleClass().add("tags");
+            tagsBox.setAlignment(Pos.CENTER_LEFT);
             Bindings.bindContent(tagsBox.getChildren(), tags);
 
-            firstLine.getChildren().setAll(lblTitle, tagsBox);
+            var scrollPane = new ScrollPane(tagsBox);
+            HBox.setHgrow(scrollPane, Priority.ALWAYS);
+            scrollPane.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
+            scrollPane.setVbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
+            FXUtils.onChangeAndOperate(tagsBox.heightProperty(), height -> FXUtils.setLimitHeight(scrollPane, height.doubleValue()));
+            firstLine.getChildren().setAll(lblTitle, scrollPane);
         }
         return tags;
     }
 
-    public void addTag(String tag) {
+    public void addTag(String tag, PseudoClass pseudoClass) {
         var tagLabel = new Label(tag);
         tagLabel.getStyleClass().add("tag");
+        if (pseudoClass != null)
+            tagLabel.pseudoClassStateChanged(pseudoClass, true);
         getTags().add(tagLabel);
     }
 
+    public void addTag(String tag) {
+        addTag(tag, null);
+    }
+
+    private static final PseudoClass WARNING_PSEUDO_CLASS = PseudoClass.getPseudoClass("warning");
+
     public void addTagWarning(String tag) {
-        var tagLabel = new Label(tag);
-        tagLabel.getStyleClass().add("tag-warning");
-        getTags().add(tagLabel);
+        addTag(tag, WARNING_PSEUDO_CLASS);
     }
 
     @Override
diff --git a/HMCL/src/main/resources/assets/css/root.css b/HMCL/src/main/resources/assets/css/root.css
index 655dff4b6..b082eb18e 100644
--- a/HMCL/src/main/resources/assets/css/root.css
+++ b/HMCL/src/main/resources/assets/css/root.css
@@ -324,20 +324,25 @@
     -fx-fill: -monet-on-surface-variant;
 }
 
-.two-line-list-item > .first-line > .tags > .tag {
+.two-line-list-item > .first-line .scroll-bar {
+    -fx-opacity: 0;
+    -fx-max-height: 0;
+    -fx-min-height: 0;
+    -fx-pref-height: 0;
+}
+
+.two-line-list-item > .first-line .tag {
     -fx-text-fill: -monet-on-secondary-container;
     -fx-background-color: -monet-secondary-container;
+    -fx-background-radius: 2;
     -fx-padding: 2;
     -fx-font-weight: normal;
     -fx-font-size: 12px;
 }
 
-.two-line-list-item > .first-line > .tags > .tag-warning {
+.two-line-list-item > .first-line .tag:warning {
     -fx-text-fill: -monet-on-error-container;
     -fx-background-color: -fixed-warning-tag-background;
-    -fx-padding: 2;
-    -fx-font-weight: normal;
-    -fx-font-size: 12px;
 }
 
 .two-line-item-second-large {