javafx中特殊边框的制作(插入一节)

       在许多界面中我们会发现,为了使页面更美观,更简洁,更有层次,我们往往会用到一些特殊边框,这一节,我主要介绍一种特殊边框的用javafx制作,首先先亮出一张图片来展示一下我们经常会遇到的边框格式:

接下来,我们就要用javafx来作出这种边框的形式,首先我们建立一个javafx fxml应用程序的项目,项目名字叫做biankuang00;建立一个主函数Main.java,主函数如下:

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package note01;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

/**
 *
 * @author Administrator
 */
public class Main extends Application {
    
    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("biankuang00.fxml"));
        
        Scene scene = new Scene(root);
        
        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }
    
}

然后我们建立一个空白的fxml的文件，文件名字是biankuang00.fxml，最主要的编辑的让lable的底色为白色，并且调整lable的跟Vbox直接的距离，然后给Vbox的边框加上颜色，具体的操作可以在fxml文件中xiang对文件进行编辑之后的程序展现如下：

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

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


<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <HBox prefHeight="203.0" prefWidth="600.0" VBox.vgrow="ALWAYS">
         <children>
            <VBox prefHeight="200.0" prefWidth="100.0" style="-fx-border-color: #36149d;" HBox.hgrow="ALWAYS">
               <children>
                  <Label style="-fx-background-color: #ffffff;" text="  我的边框我做主  ">
                     <VBox.margin>
                        <Insets left="30.0" top="-8.0" />
                     </VBox.margin>
                  </Label>
               </children>
               <HBox.margin>
                  <Insets bottom="5.0" left="5.0" top="10.0" />
               </HBox.margin>
            </VBox>
            <VBox prefHeight="200.0" prefWidth="100.0" HBox.hgrow="ALWAYS" />
         </children>
      </HBox>
      <VBox prefHeight="200.0" prefWidth="100.0" VBox.vgrow="ALWAYS" />
   </children>
</VBox>

biankuang00.fxml文件自动生成的控制器是biankuang00Controller.java，程序显示如下：

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package note01;

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.Initializable;

/**
 * FXML Controller class
 *
 * @author Administrator
 */
public class Biankuang00Controller implements Initializable {

    /**
     * Initializes the controller class.
     */
    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }    
    
}

运行之后程序的显示效果如下：

在大家按照我这样的步骤得到结果后，会发现这个边框会随着整个屏幕的放大而放大，这样效果是怎么出来的呢，大家现在可以大致地看看我在fxml中的一些设置以及一些控件的使用，在接下来，我还会具体介绍这个效果的制作·······