javafx 开发知识点与要点

整理javafx开发知识点

一、开发工具

java 端：idea
界面可视化：JavaFX Scene Builder 2.0

二、开发步骤

1、创建fx工程
2、设计fxml文件的界面
3、创建关联：包括
fx:controller=“com.tan.fx.Sqlformat”
fx:id=“inputTextArea”
控件事件，如onAction=“#fontCombox”
4、事件开发

三、开发要点

1、在JavaFX Scene Builder中开发需要考虑各个控件的归属

如果结构混乱，后面调起来特别麻烦。
包括
①布局控件，如
使用VBox 垂直排列
使用HBox水平排列
使用BorderPane布局顶部，底部，左，右或中心区域中的子节点。
使用GridPane布局网格窗格排列

这些是排版组件，可以先设计好用哪种，然后考虑哪些控件放在哪里，命名也尽量分好层次，最好能一看名字就知道在哪个组件下面，然后处于第几层

2、组件控件大小

做好顺序就要考虑大小，通常是想做固定大小还是动态大小
然后如果是动态，是否跟父组件一样等等，如下图

3、事件选择

考虑控件的触发事件，是鼠标点击，还是选择，不同的控件的事件不一样，有些事件还需要在代码里面自己监听，如选择框的选择事件，特殊事件在JavaFX Scene Builder 是没有的，需要自己手写。
比如

controller.getChoiceBox().getSelectionModel().selectedItemProperty().addListener(new ChoiceChangeListener(controller));

public class ChoiceChangeListener implements ChangeListener<String> {

    private Sqlformat controller;
    public ChoiceChangeListener(Sqlformat controller) {
        this.controller = controller;
    }

    @Override
    public void changed(ObservableValue<? extends String> observable, String oldValue, String newValue) {

        if (controller.getOutputTextArea().getText().isEmpty() || controller.getOutputTextArea().getText().trim().length() == 0) {
            return;
        }

        String value = observable.getValue();
        if (value.equals(Sqlformat.FieldSeparation)) {
            Sqlformat.choiceBoxChange(controller, value);
        }else if(value.equals(Sqlformat.NotSeparation)){

        }
    }
}

4、动态窗口

动态窗口希望拉伸的时候组件跟着拉伸
需要考虑用动态布局组件，比如使用VBox 和HBox实现上下拉伸
需要注意的是，如果子控件尺寸变大，但是父组件没有变大的话，里面的子组件会相互积压，所以要做好动态拉伸需要将父子组件同步改变尺寸

动态窗口可以监听窗口事件

 /**
  * 高度改变的事件
  * 动态改变窗口高度
  */
 scene.getWindow().heightProperty().addListener(new WinHeightChangeListener(controller));

public class WinHeightChangeListener implements ChangeListener<Number> {

    private Sqlformat controller;
    public WinHeightChangeListener(Sqlformat controller) {
        this.controller = controller;
    }

    @Override
    public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
        System.out.println("当前高度：" + newValue.doubleValue());
        TextArea outputTextArea = controller.getOutputTextArea();
        TextArea inputTextArea = controller.getInputTextArea();
		// TODO 自定义跟着窗口动态调整大小的组件
     	
    }
}

四、常用的组件

1、颜色选择器 colorPicker

/**
     * 颜色转换
     *
     * @param color
     * @return
     */
    private static String toHexString(Color color) {
        int r = ((int) Math.round(color.getRed() * 255)) << 24;
        int g = ((int) Math.round(color.getGreen() * 255)) << 16;
        int b = ((int) Math.round(color.getBlue() * 255)) << 8;
        int a = ((int) Math.round(color.getOpacity() * 255));
        return String.format("#%08X", (r + g + b + a));
    }
    
    /**
     * 颜色选择器使用
     * 结合TextArea 改变字体颜色
     *
     * @param actionEvent
     */
    public void colorPicker(ActionEvent actionEvent) {
        String value = Sqlformat.toHexString(colorPicker.getValue());
        String style = "-fx-text-fill: " + value.toString();
        inputTextArea.setStyle(style);
        outputTextArea.setStyle(style);

    }

2、选择组件 ChoiceBox 和 ComboBox

ChoiceBox 勾选
ComboBox 点选

①初始化

        // 初始化字体
        comboBox.setItems(FXCollections.observableArrayList("10", "11", "12", "13", "14", "15", "16", "20"));
        comboBox.getSelectionModel().select(2);

        choiceBox.setItems(FXCollections.observableArrayList("fff", "FieldSeparation", "BracketSeparation"));
        choiceBox.getSelectionModel().select(1);

②遍历与使用

public void choiceBox(MouseEvent mouseEvent) {
        ObservableList items = choiceBox.getItems();
        for (Object observable : items) {
            String selectedItem = (String) observable;
        }
    }

    /**
     * 字体大小
     *
     * @param actionEvent
     */
    public void fontCombox(ActionEvent actionEvent) {
        String selectedItem = (String) comboBox.getSelectionModel().getSelectedItem();
    }

3、图片组件 ImageView

设置窗口图标 与图片 ImageView

// 设置图标
String path = "file:" + System.getProperty("user.dir");
primaryStage.getIcons().add(new Image(path + "/tan1.bmp"));

// 设置图片ImageView
String path = "file:" + System.getProperty("user.dir");
imageView.setImage(new Image(path + "/my.jpg"));

4、字体设置

Font font = new Font("Consolas", 12);
outputTextArea.setFont(font);

5、粘贴板读取与设置 (复制粘贴)

// 读取
 String string = Clipboard.getSystemClipboard().getString();
// 设置
final ClipboardContent content = new ClipboardContent();
content.putString(outputTextArea.getText());
Clipboard.getSystemClipboard().setContent(content);

6、获取光标

// 控件得到光标，获取焦点，获取光标 
outputTextArea.requestFocus();

7、实现全选

// 全选
outputTextArea.selectAll();

8、实现全选

在启动里面获取controller
这个通常是需要自己写监听的时候，需要把controller做业务

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        URL location = getClass().getResource("sqlformat.fxml");
        FXMLLoader fxmlLoader = new FXMLLoader();
        fxmlLoader.setLocation(location);
        fxmlLoader.setBuilderFactory(new JavaFXBuilderFactory());
        Parent root = fxmlLoader.load();
        //如果使用 Parent root = FXMLLoader.load(...) 静态读取方法，无法获取到Controller的实例对象
        try {
            // 设置图标
            String path = "file:" + System.getProperty("user.dir");
            System.out.println("user.dir======" + path);
            primaryStage.getIcons().add(new Image(path + "/tan1.bmp"));

        } catch (Exception e) {

        }
        primaryStage.setTitle("格式化工具CYZZ");
        Scene scene = new Scene(root);
        //加载css样式
        //scene.getStylesheets().add(getClass().getResource("style1.css").toExternalForm());
        primaryStage.setScene(scene);
        Sqlformat controller = fxmlLoader.getController();   //获取Controller的实例对象

        primaryStage.show();
        
        /**
         * 高度改变的事件
         * 动态改变窗口高度
         */
        scene.getWindow().heightProperty().addListener(new WinHeightChangeListener(controller));
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}