如何使用 JavaFX 建立流面板?


一旦為你的應用程式建立了所有所需節點,就可以使用佈局對它們進行排列。其中佈局是計算給定空間中物件位置的過程。JavaFX 在 javafx.scene.layout 包中提供了各種佈局。

流面板

在此佈局中,節點在面板的環繞寬度/高度範圍內一個緊挨一個地按流排列。可以透過例項化 javafx.scene.layout.FlowPane 類在應用程式中建立流面板。

在例項化 FlowPane 類時,預設情況下,將建立一個水平流面板,你可以使用 setOrientation() 方法更改其方向。你可以使用 setPrefWrapLength() 方法在高度(垂直流面板)或寬度(水平流面板)範圍內包裝面板中的節點。

要向此面板新增節點,你可以將它們作為建構函式的引數傳遞,或者將它們新增到面板的可觀察列表中,如下所示 −

getChildren().addAll();

示例

import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.chart.AreaChart;
import javafx.scene.chart.BarChart;
import javafx.scene.chart.BubbleChart;
import javafx.scene.chart.CategoryAxis;
import javafx.stage.Stage;
import javafx.scene.chart.NumberAxis;
import javafx.scene.chart.PieChart;
import javafx.scene.chart.XYChart;
import javafx.scene.layout.FlowPane;
public class FlowPaneExample extends Application {
   public void start(Stage stage) {
      //Defining the X and Y axes
      CategoryAxis xAxis = new CategoryAxis();
      NumberAxis yAxis = new NumberAxis();
      xAxis.setLabel("Months");
      yAxis.setLabel("Rainfall (mm)");
      //Creating the Area chart
      AreaChart areaChart = new AreaChart(xAxis, yAxis);
      XYChart.Series series = new XYChart.Series();
      series.getData().add(new XYChart.Data("July", 169.9));
      series.getData().add(new XYChart.Data("Aug", 178.7));
      series.getData().add(new XYChart.Data("Sep", 158.3));
      series.getData().add(new XYChart.Data("Oct", 97.2));
      series.getData().add(new XYChart.Data("Nov", 22.4));
      series.getData().add(new XYChart.Data("Dec", 5.9));
      series.setName("Rainfall In Hyderabad");
      //Setting data to the area chart
      areaChart.getData().addAll(series);
      areaChart.setPrefSize(290, 200);
      //Defining the axes
      CategoryAxis xAxis1 = new CategoryAxis();
      xAxis.setLabel("Year");
      NumberAxis yAxis1 = new NumberAxis();
      yAxis.setLabel("Population (In millions)");
      //Creating the Bar chart
      BarChart barchart = new BarChart(xAxis1, yAxis1);
      //Prepare XYChart.Series objects by setting data
      XYChart.Series<String, Number> series1 = new XYChart.Series<>();
      series1.setName("Asia");
      series1.getData().add(new XYChart.Data<>("2012", 900));
      series1.getData().add(new XYChart.Data<>("2013", 1000));
      series1.getData().add(new XYChart.Data<>("2014", 1170));
      series1.getData().add(new XYChart.Data<>("2015", 1250));
      series1.getData().add(new XYChart.Data<>("2016", 1530));
      series1.setName("Population of Asia");
      //Setting the data to bar chart
      barchart.getData().addAll(series1);
      barchart.setPrefSize(290, 200);
      //Creating a Pie chart
      PieChart pieChart = new PieChart();
      ObservableList<PieChart.Data> data = FXCollections.observableArrayList(
         new PieChart.Data("Work", 10),
         new PieChart.Data("Chores", 2),
         new PieChart.Data("Sleep", 8),
         new PieChart.Data("Others", 4));
      pieChart.setData(data);
      //Setting the other properties
      pieChart.setTitle("Activities");
      pieChart.setLabelLineLength(10);
      pieChart.setPrefSize(290, 250);
      NumberAxis xAxis2 = new NumberAxis(0, 100, 10);
      NumberAxis yAxis2 = new NumberAxis(20, 100, 10);
      //Creating labels to the axes
      xAxis.setLabel("Age");
      yAxis.setLabel("Weight");
      BubbleChart bubbleChart = new BubbleChart(xAxis2, yAxis2);
      XYChart.Series series2 = new XYChart.Series();
      series2.getData().add(new XYChart.Data(10, 30, 4));
      series2.getData().add(new XYChart.Data(25, 40, 5));
      series2.getData().add(new XYChart.Data(40, 50, 6));
      series2.getData().add(new XYChart.Data(55, 60, 8));
      series2.getData().add(new XYChart.Data(70, 70, 9));
      bubbleChart.getData().add(series2);
      series2.setName("work");
      bubbleChart.setPrefSize(290, 250);
      //Creating a flow pane
      FlowPane pane = new FlowPane();
      pane.getChildren().addAll(areaChart, barchart, pieChart, bubbleChart);
      //Setting the Scene
      Scene scene = new Scene(pane, 600, 450);
      stage.setTitle("Flow Pane");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

輸出

更新於: 19-5-2020

244 次瀏覽

開啟你的 職業生涯

完成課程,獲得證書

入門
廣告