21-11-2016

Создание Button в JavaFX Scene Builder 2.0

Пару дней назад, искал  решение одной задачи, а задача состояла в том что нужно создать интерфейс  на Java,  нарисовать кнопку и повесить на нее событие. Если бы  это был JavaScript  то это пустяк но с Java  я почти не знаком. И что делать и кому молиться  не известно. Я пошел за советом к всезнающему  Гуглу.  И тут понеслось,  море инфы и не понятно какую использовать. Мой взор упал на JavaFX, а если быть точнее то на JavaFX Scene Builder 2.0. Очень крутая штука, для  написания кода  я использую  Eclipse nano.  Естественно все было установлено отдельно но заставить их работать вместе не составит особого труда.  И такс вернемся к нашим баранам.  Кнопка она же button  находиться в Scene Builder, а путь к ней такой: Insert->Controls->Button. Сам не люблю читать когда много воды, но тут не получится написать в двух словах. Начнем все по порядку.

Что бы создать новый проект JavaFX, (на примере будем рассматривать Eclipse nano ) нужно нажать File->New->Other->JavaFX->Classes->JavaFX Main Class. Этот класс будет у нас главным  так как в нем мы наследуем класс Application, и плюс ко всему  здесь же находится метод start.

После того как  создали новый класс Main мы должны импортировать нужные нам библиотеки для работы.

import java.io.IOException;

import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Scene;

import javafx.scene.layout.AnchorPane;

import javafx.stage.Stage;

  

Пример мое кода без библиотек, так как я их  написал выше не вижу смысла дважды писать:

 public class main extends Application {

private Stage primaryStage;

/*Подключаем макет программы*/

public void start(Stage primaryStage) throws Exception {

this.primaryStage = primaryStage;

this.primaryStage.setTitle("Моя программа");

show_my_programm();

}

  public void show_my_programm(){

  try {

 FXMLLoader loader = new FXMLLoader();

 loader.setLocation(main.class.getResource("button.fxml"));

         AnchorPane button = (AnchorPane) loader.load();

/*Отображаем сцену макета*/

Scene scene = new Scene(button);

primaryStage.setScene(scene);

primaryStage.show();

  } catch (IOException e) {

          e.printStackTrace();

      }

}

  public static void main(String[] args) {

launch(args);

}

}

 

   Разберем код:

 private Stage primaryStage -  назначаем поле (свойство).

this.primaryStage.setTitle("Моя программа") -  имя окна программы.

show_my_programm() - вызываем метод для работы.

public void show_my_programm() - данный методы нужно писать  в try catch иначе будет выводиться ошибка.

FXMLLoader loader = new FXMLLoader() - инициализируем объект класса  FXMLLoader для работы с *.fxml(макетами интерфейса).

loader.setLocation(main.class.getResource("button.fxml")) - main это имя  нашего главного класса, button.fxml - имя макета,  так как макет лежит в одной папке с классами то и путь указан соответственно.

Scene scene = new Scene(button) - инициализируем сцену.

Вызываем сцену:

primaryStage.setScene(scene);

primaryStage.show();

        

        Для взаимодействия  с нашим макетом button.fxml нужно создать controller который будет все обрабатывать.

К нашей кнопки мы привяжем метод который будет срабатывать по клику.

Создаем класс Controller с таким содержанием:


import javafx.event.EventHandler;

import javafx.fxml.FXML;

import javafx.scene.control.Button;

 

public class Controller {

public void onClickMethod(){

Button button = new Button();

   System.out.println("Hello World");

}

}

Тут все просто до безобразия так  что расписывать не стану.

Теперь приступим к разработке  нашего макета на *.fxml

Нажимаем правой кнопкой мыши на нашу папку package New->Other->JavaFX->New FXML Document.  Что бы данный  документ открывался в Scene Builder, то нужно нажать  правой кнопки мышки и  выбрать открывать в другой программе и выбрать  Scene Builder.  И у вас  появится данное окно. 

Нам нужно добавить в Hierarchy   AnchorPane, что бы это сделать, нужно в левом углу  Containers выбрать AnchorPane  и перетянуть в Hierarchy. 

Для AnchorPane  нужно задать высоту и ширину. В правом  верхнем углу находится Layout, PrefWidth - ширина,  PrefHeight - высота. Зададим ширину 600, а высоту 300, и у вас будет что то наподобие. 

Что бы добавить  кнопку, нужно в левом верхнем углу нажать Controls и выбрать Button, а точнее перетащить  ее в  AnchorPane

  Кнопку, нужно привязать к методу onClickMethod. Для этого дважды нажмите на кнопку и в правом верхнем углу выберите Code. Где в fx:id укажите имя уникальное кнопки, а в On Action укажите имя метода то есть onClickMethod.

 

Теперь в нашем макете нужно прописать  путь к контроллеру. Для этого  нажмите по макету правой кнопкой мышки и выберет открыть в FXML Editor ну или в другом редакторе xml. И вы увидите код нашего макета. 

В <AnchorPane нужно прописать fx:controller="Controller" - имя нашего файла(класса) контроллера. Путь указан подобным образом ибо  контроллер и макет в одной папке. 

После всех манипуляций компилируем код, нажимаем на кнопку и видим, что вывелось сообщение “Hello World”.