Учебник по JavaFX: Привет, мир

Перевод статьи «JavaFX Tutorial: Hello world» автора Vojtech Ruzicka.

Как создать ваше первое приложение JavaFX.

Это второй пост в серии о JavaFX. Вы можете прочитать в первой статье о том, как настроить вашу среду для разработки JavaFx.

Все посты в серии о JavaFX:

1. Учебник по JavaFX: начало работы
2. Учебник по JavaFX: Привет, мир!
3. Учебник по JavaFX: FXML и SceneBuilder
4. Учебник по JavaFX: основные макеты
5. Учебник по JavaFX: расширенные макеты
6. Учебник по JavaFX: CSS стилизация
7. JavaFX Weaver: интеграция JavaFX и Spring Boot приложения

Структура приложения

Каждое приложение состоит из иерархии нескольких основных компонентов: Stages (окна), (сцены) и nodes (узлы). Давайте рассмотрим каждую из них.

Stage

Stage по существу представляет собой окно. Ваше приложение может иметь несколько компонент stage, но как минимум одна должна быть обязательно.

Scene

Scene отображает содержание сцены (stage). Каждая компонента stage может содержать несколько компонент scene, которые можно переключать. Представьте себе театральные подмостки, на которых сменяются несколько сцен во время спектакля.

Node

Каждая компонента stage может содержать различные компоненты, называемые узлами (node). Узлы могут быть элементами управления, такими как кнопки или метки, или даже макетами (layout), которые могут содержать несколько вложенных компонентов. Каждая сцена (scene) может иметь один вложенный узел (node), но это может быть макет (layout), который может содержать несколько компонентов. Вложенность может быть многоуровневой — макеты могут содержать другие макеты и обычные компоненты.

Резюме

Каждое приложение может иметь несколько окон (Stage). Каждая компонента Stage может переключать несколько Scene (сцен). Сцены содержат узлы (node) — макеты и обычные компоненты.

Эту иерархию можно визуализировать следующим образом:



Теперь давайте посмотрим на конкретный пример — реальное приложение.

Класс Application

Время начать программировать. Если вы следовали предыдущей статье, у вас уже готовы все необходимые зависимости.

Каждое приложение JavaFX должно иметь класс main, который расширяет класс:

javafx.application.Application

Кроме того, необходимо переопределить абстрактный метод из класса Application:

public void start(Stage primaryStage) throws Exception

Касс main выглядит примерно так:

import javafx.application.Application;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        // TODO implement me!
    }
}

Метод main

Для запуска JavaFx приложения не обязательно нужен метод main(). Вы можете упаковать исполняемый файл jar, используя JavaFX Packager Tool. Однако гораздо удобнее иметь метод main.

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

Внутри метода main() приложение можно запустить используя метод:

Application.launch()

Легко заметить, что это статический метод в классе Application. Мы не указали основной класс, но JavaFX может определить это автоматически в зависимости от класса, который вызывает этот метод.

Настройка Stage

Теперь мы знаем как запустить наше приложение, используя метод main(). Тем не менее, ничего не произойдет, если мы сделаем это. Нужно окно, которое мы хотим показать. Окно называется stage, помните? На самом деле, у нас уже есть первичная stage, переданная в метод start в качестве входного параметра:

public void start (Stage primaryStage)

Мы можем использовать эту компоненту stage. Единственная проблема в том, что она скрыта по умолчанию. К счастью, мы можем легко показать ее, используя метод primaryStage.show():

@Override
public void start(Stage primaryStage) throws Exception {
    primaryStage.show();
}

Теперь, когда вы запустите приложение, вы должны увидеть следующее окно:



Не очень впечатляет, правда? Во-первых, давайте добавим хорошую подпись к нашему окну.

primaryStage.setTitle("Hello world Application");

Чтобы окно выглядело еще лучше, давайте добавим красивую иконку в верхнюю панель окна:

InputStream iconStream = getClass().getResourceAsStream("/icon.png");
Image image = new Image(iconStream);
primaryStage.getIcons().add(image);

Вы можете добавить несколько иконок, представляющих приложение. Точнее одну и ту же иконку разных размеров. Это позволит использовать иконку походящего размера в зависимости от контекста приложения.

Теперь можно настроить свойства и поведение объекта Stage, например:

• Установить положение с помощью setX() и setY()
• Установить начальный размер с помощью setWidth() и setHeight()
• Ограничить максимальные размеры окна с помощью setMaxHeight() и setMaxWidth() или отключить изменение размера с помощью setResizable(false)
• Установить режим окно всегда сверху, используя setAlwaysOnTop()
• Установить полноэкранный режим, используя setFullScreen()
• И многое другое

Теперь у нас есть окно с таким фантастическим названием, но оно все еще пустое. Вы уже знаете, что нельзя добавлять компоненты непосредственно в Stage (окно). Вам нужна сцена (scene).

Однако для запуска конструктора сцены требуется указать дочерний узел. Давайте сначала создадим простую метку (label). Затем мы создаем сцену (scene) этой меткой (label) в качестве дочернего узла.

Label helloWorldLabel = new Label("Hello world!");
Scene primaryScene = new Scene(helloWorldLabel);

Вы заметили, что Scene допускает только один дочерний компонент. Что если нам нужно больше? Необходимо использовать layout (макет), который является компонентом, который может включать несколько дочерних элементов и размещать их на экране в зависимости от используемого layout (макета). Мы рассмотрим макеты позже в этой серии статей.

Чтобы сделать приложение немного более визуально привлекательным, давайте разместим метку в центре экрана.

helloWorldLabel.setAlignment(Pos.CENTER);

Наконец, нам нужно установить Scene для Stage, которая у нас уже есть:

@Override
public void start(Stage primaryStage) throws Exception {
    primaryStage.setTitle("Hello world Application");
    primaryStage.setWidth(300);
    primaryStage.setHeight(200);

    InputStream iconStream = getClass().getResourceAsStream("/icon.png");
    Image image = new Image(iconStream);
    primaryStage.getIcons().add(image);

    Label helloWorldLabel = new Label("Hello world!");
    helloWorldLabel.setAlignment(Pos.CENTER);
    Scene primaryScene = new Scene(helloWorldLabel);
    primaryStage.setScene(primaryScene);

    primaryStage.show();
}

Теперь наше окно содержит сцену с компонентом метка (label):

Что дальше

На следующем шаге этой серии мы рассмотрим, как реализовать наш графический интерфейс на XML, а не на Java.