JavaFX——功能实现（不定期更新）

BsonJ

已于 2023-03-19 16:01:36 修改

阅读量698

点赞数

分类专栏： Java 文章标签： java GUI

于 2023-03-17 21:19:40 首次发布

本文链接：https://blog.csdn.net/qq_30917141/article/details/129627342

版权

Java 专栏收录该内容

4 篇文章 1 订阅

订阅专栏

功能1：“加载”（loading）面板

有两种方式实现加载效果：一种是通过stage实现，这种方式的效果不是很理想：1、stage是全局的，在APPLICATION_MODAL模式下，对原界面的所有操作都是无效的；2、在非APPLICATION_MODAL模式下拖动原界面会发现实际是两个窗口。第二种是通过StackPane，在进行耗时操作时添加loading面板，操作结束后移除。好处是可以进行全局和局部的效果，只对局部组件进行操作限制，不影响用户操作其它组件。

<!-- ui目录中的loading.fxml -->
<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.geometry.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.paint.*?>
<?import javafx.scene.image.*?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<BorderPane id="AnchorPane" prefHeight="300.0" prefWidth="300.0" style="-fx-background-color: rgba(0,0,0,0.7); -fx-opacity: 0.5; -fx-fill: #409eff;" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <center>
      <GridPane alignment="CENTER" prefHeight="120.0" prefWidth="120.0" BorderPane.alignment="CENTER">
        <columnConstraints>
            <ColumnConstraints fillWidth="false" hgrow="SOMETIMES" maxWidth="67.0" minWidth="120.0" prefWidth="90.0" />
        </columnConstraints>
        <rowConstraints>
          <RowConstraints maxHeight="70.0" minHeight="10.0" prefHeight="70.0" vgrow="SOMETIMES" />
          <RowConstraints maxHeight="70.0" minHeight="10.0" prefHeight="70.0" vgrow="SOMETIMES" />
        </rowConstraints>
         <children>
            <ImageView fitHeight="60.0" fitWidth="60.0" pickOnBounds="true" preserveRatio="true" GridPane.halignment="CENTER">
               <image>
                  <Image url="@img/load.gif" />
               </image>
               <GridPane.margin>
                  <Insets bottom="2.0" />
               </GridPane.margin>
            </ImageView>
            <Label alignment="CENTER" prefHeight="25.0" prefWidth="120.0" style="-fx-fill: #409eff;" text="载入中。。。" textAlignment="CENTER" textFill="#009eff" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="TOP">
               <font>
                  <Font size="20.0" />
               </font>
               <GridPane.margin>
                  <Insets top="2.0" />
               </GridPane.margin>
            </Label>
         </children>
      </GridPane>
   </center>
</BorderPane>

调用面板的代码实现：

public static void loadPane(javafx.scene.layout.StackPane stackPane) {
    try {    // 添加loading面板到容器组件，自动居中
        stackPane.getChildren().add(javafx.fxml.FXMLLoader.load(PopupFrame.class.getResource("ui/loading.fxml")));
    } catch (Exception e) {
        e.printStackTrace();
    }
}

// stackPane.getChildren().remove(1);    // 移除loading面板，返回到原界面

功能2：预览图或自定义弹出式面板（窗口）

效果类似于写代码软件下部的弹出式窗口，点击别处时会自动消失。通过JavaFX中 Popup （关于它的使用资料基本没有~想哭）实现。下面是点击“新闻”按钮前点击后，当用户点击Popup外的任何地方会自动消失。

亲们根据自身的需要设计 preview.fxml 就好了。

/** 弹出式窗口
 * @param owner 主界面
 * @param caller 使触发按钮恢复原状态
 * @param y 显示的位置
 */
public static void preview(javafx.stage.Stage owner, javafx.scene.control.ToggleButton caller, double y) {
    try {
        javafx.stage.Popup popup = new javafx.stage.Popup();
        javafx.scene.layout.BorderPane bp = javafx.fxml.FXMLLoader.load(PopupFrame.class.getResource("ui/preview.fxml"));
        popup.getContent().add(bp);
        // 显示的尺寸
        bp.setMinSize(owner.getWidth()-6, 250);
        bp.setMaxHeight(250);
        // 显示的位置坐标
        popup.show(owner, owner.getX()+2, y-212);
        popup.setAutoHide(true);
        popup.setConsumeAutoHidingEvents(true); // 调用完隐藏事件后，就消耗掉事件，不再往里面的组件传递
        popup.setOnHiding((event) -> {
            caller.setSelected(false);
        });
    } catch (IOException e) {
        e.printStackTrace();
    }
}