java - JavaFX 使 ListView 在触摸屏上可滚动

Question

我们正在为具有触摸屏的 Linux All In One Pc 开发 JavaFX 应用程序。

.jar 文件可以正常工作，并且所有内容都可以直接点击，因为 JavaFx 将 ClickEvents 转换为 TouchEvents。唯一的问题是 ListView 不能开箱即用地滚动......

如果我把它放在 ScrollPane 中，那么我可以滚动，但 ScrollPane 内的 ListView 不会滚动，只有 ScrollPane 部分滚动。

关于我如何管理这个有很多可能的修复：

1. 使 ListView 像 ScrollPane 一样可滚动并删除滚动窗格。

2. 告诉滚动窗格显示 ListItems 而不是只滚动窗格而是滚动列表。

3. 更改 ListView VerticalScrollBar 以使其更大，并使 Inc. 和 Dec Button 更大，以便用户可以单击那里。

我试图做所有事情，但没有成功。

这是一些代码：

列表所在的控制器：

public class AllergenController {
    private final Rectangle2D RESOLUTION = Screen.getPrimary().getBounds();
    private ObservableList<String> items = FXCollections.observableArrayList();

    @FXML
    private ListView<String> listView;

    @FXML
    private Button btnClose;
    
    private ScrollPane pane;
    
    private double lastYposition = 0;
        
    
    public void initialize() {
        
//      listView.setStyle("-fx-min-width: 20; -fx-background-colo: #074cba;");
        
//      listView.getStylesheets().addAll(this.getClass().getResource("application.css").toExternalForm());
        
        
        
//      pane.setFitToWidth(true);
        
//       listView.setOnMousePressed(new EventHandler<MouseEvent>() {
//           @Override
//           public void handle(MouseEvent event) {
//               lastYposition = event.getSceneY();
//           }
//       });
//
//       listView.setOnMouseDragged(new EventHandler<MouseEvent>() {
//           @Override
//           public void handle(MouseEvent event) {
//               double newYposition = event.getSceneY();
//               double diff = newYposition - lastYposition;
//               lastYposition = newYposition;
//               CustomScrollEvent cse = new CustomScrollEvent();
//               cse.fireVerticalScroll((int)diff, this, (EventTarget) event.getSource());
//           }
//       });  
//      
        
//      ScrollListener scrollListener = new ScrollListener(listView);
//      scrollListener.enable();
        
        
        listView.setItems(items);
        listView.setSelectionModel(new NoSelectionModel<String>());
        listView.setPrefSize(RESOLUTION.getWidth(), RESOLUTION.getHeight());
//      pane.setPrefSize(RESOLUTION.getWidth(), RESOLUTION.getHeight());
        listView.setStyle("-fx-font-size: 3em; -fx-alignment: center;");
        
        // Allergene
        items.add("Allergenliste: ");
        items.add("1 - Gluten und Erzeugnisse");
        items.add("2 - Krebstiere und Erzeugnisse");
        items.add("3 - Eier von Gefl\u00fcgel und Erzeugnisse");
        items.add("4 - Fisch und Erzeugnisse (Ausser Fischgelatine)");
        items.add("5 - Erdn\u00fcsse und Erzeugnisse");
        items.add("6 - Sojabohnen und Erzeugnisse");
        items.add("7 - Milch (Laktose) und Erzeugnisse");
        items.add("8 - Schalenfr\u00fcchte und Erzeugnisse");
        items.add("9 - Sellerie und Erzeugnisse");
        items.add("10 - Senf und Erzeugnisse");
        items.add("11 - Sesamsamen und Erzeugnisse");
        items.add("12 - Schwefeldioxid und Erzeugnisse");
        items.add("13 - Lupinen und Erzeugnisse");
        items.add("14 - Weichtiere und Erzeugnisse (Schnecken, Muscheln, Tintenfische etc.)");
        items.add("V - Vegetarisch");
        items.add("VV - Vegan");
        items.add("SF - Schweinefleisch");

        // Zusatzstoffe nach E-Nummern sortiert!
        items.add("\n");
        items.add("Zusatzstoffliste nach E-Nummern sortiert: ");
        items.add("E 100 - Kurkumin");
        items.add("E 101 - Riboflavin (Riboflavin-5'-Phosphat)");
        items.add("E 102 - Tartrazin");
        items.add("E 104 - Chinolingelb");
        items.add("E 110 - Gelborange S");
        items.add("E 120 - Echtes Karmin");
        items.add("E 122 - Azorubin");
        items.add("E 123 - Amaranth");
        items.add("E 124 - Cochenillerot");
        items.add("E 127 - Erythrosin");
        items.add("E 129 - Allurarot AC");
        items.add("E 131 - Patentblau V");
        items.add("E 132 - Indigotin I");
        items.add("E 133 - Brilliantblau FCF");
        items.add("E 140 - Chlorophylle, Chlorophylline");
        items.add("E 141 - Kupferkomplexe der Chlorophylle");
        items.add("E 142 - Gr\u00fcn S");
        items.add("E 150a-d - Zuckerkul\u00f6r");
        items.add("E 151 - Brilliantschwarz BN");
        items.add("E 153 - Pflanzenkohle");
        items.add("E 155 - Braun HT");
        items.add("E 160a-f - Carotin und Carotinoide(a)");
        items.add("E 160b - Annatto (Bixin,Norbixin)");
        items.add("E 160c - Paprikaextrakt");
        items.add("E 160d - Lycopin");
        items.add("E 160e - Beta-apo-8'-Carotinal");
        items.add("E 161b - Lutein");
        items.add("E 161g - Canthaxanthin");
        items.add("E 162 - Beetenrot, Betanin");
        items.add("E 163 - Anthocyane");
...

  }
}

忽略注释代码，这是我以前尝试过的一些尝试。

然后我创建了一个 Css 类并在 ListView 中分配了 StyleSheet 但这并没有改变任何东西：

/* JavaFX CSS - Leave this comment until you have at least create one rule which uses -fx-Property */


.mylistview .scroll-bar:vertical {
     -fx-scale-x: 0;
    -fx-min-width: 20px;
    -fx-background-colo: #074cba;
}

.mylistview .increment-button .virtual-flow .scroll-bar:vertical .increment-button , .mylistview .decrement-button {
    -fx-min-width: 20px;
    -fx-min-height: 50px;
}

这是来自过敏原的 FXML 代码：

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.String?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.ListView?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>

<BorderPane style="-fx-background-color: #fff;" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="KMS.AllergenController">
   <top>
      <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" spacing="10.0" BorderPane.alignment="CENTER">
         <children>
            <Text strokeType="OUTSIDE" strokeWidth="0.0" text="Kantinen Management System by" textAlignment="CENTER">
               <font>
                  <Font size="24.0" />
               </font>
            </Text>
            <ImageView fitHeight="50.0" fitWidth="90.0" pickOnBounds="true" preserveRatio="true">
               <image>
                  <Image url="@../images/ThiesenSWChanged.png" />
               </image>
            </ImageView>
         </children>
         <padding>
            <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
         </padding>
      </HBox>
   </top>
   <center>
      <ScrollPane fx:id="pane" hbarPolicy="NEVER" vbarPolicy="NEVER">
         <content>
            <ListView fx:id="listView" focusTraversable="false" style="-fx-background-color: #fff;" stylesheets="@../src/KMS/application.css">
               <styleClass>
                  <String fx:value="scroll-bar" />
                  <String fx:value="decrement-button" />
                  <String fx:value="increment-button" />
               </styleClass>
            </ListView>
         </content>
      </ScrollPane>
   </center>
</BorderPane>

我希望有人可以帮助我：/就像我说的可以通过 3 种方式之一（1. 2. 3.）来完成。

谢谢~褪色。

标签： javacsslistviewjavafxscenebuilder