Java Fx обеспечивает профессиональную и простую реализацию графического интерфейса пользователя на языке JAVA, начиная от программ школьного уровня и заканчивая многими профессиональными приложениями. Недавно я использовал JavaFX для игры веб-краулера на основе Java, над которой я работаю, чтобы создать ее пользовательский интерфейс. Благодаря этому руководству вы получите базовые знания для создания рабочего пользовательского интерфейса.
- Основная концепция
- Компоненты пользовательского интерфейса
- Макеты
Основная концепция
JavaFX принял близко к сердцу фразу Шекспира «Все миры — сцена». Каждое окно, которое вы видите в JavaFX, называется основным этапом. Все компоненты и другие окна связаны внутри этой стадии. Компоненты окна представлены в сцене. Поскольку на сцене может происходить несколько сцен, то же самое происходит и в JavaFX. Вы перемещаетесь между сценами с помощью событий. Эти события могут быть такими же простыми, как нажатие кнопки пользователем для перехода в другой раздел пользовательского интерфейса. Компоненты пользовательского интерфейса, такие как кнопки и текстовая область или макеты, называются узлами.
Этап → Сцена → Узлы [макеты, пользовательский интерфейс (кнопки, текстовые поля, текстовая область), геометрические объекты]
Чтобы создать приложение JavaFX, мы сначала расширяем класс приложения, чтобы использовать его функции. Затем мы переопределяем функцию start(). Здесь будет большая часть нашего кода. Теперь, когда все классы Java запускаются main. Мы используем функцию запуска (args) в основном для вызова нашей функции запуска. Это базовая структура для остальных наших проектов JavaFX.
Давайте сначала создадим базовое окно, подобное этому:
Сначала мы создаем Stage (главное окно) для всей программы. мы можем использовать переменную primaryStage, но понятнее назвать ее как функцию, то есть окно.
Затем мы устанавливаем заголовок нового пустого окна, используя .setTitle («»); функция.
Теперь мы можем сразу отображать основное окно с помощью самого window.show(), но в нем нет компонентов.
Затем мы создаем макет и сцену, чтобы создать функционирующее пустое окно.
Затем мы инициализируем новый объект HBox (горизонтальное поле) с помощью HBox hbox1 = new HBox(); здесь я уже инициализировал множество переменных глобально. Это форма макета для всех компонентов сцены. Различные типы макетов подробно описаны ниже.
Затем мы инициализируем новую сцену и устанавливаем нашу компоновку на сцену.
Сцена сцена = новая сцена (hbox1, 500 500). Это также описывает ширину и высоту конкретной сцены.
В конце мы устанавливаем наше окно (primaryStage) в новую сцену и отображаем его, используя
окно.setScene (сцена);
окно.показать();
Компоненты пользовательского интерфейса
Компоненты пользовательского интерфейса, такие как метки, кнопки и текстовые поля, являются важными строительными блоками приложения.
Ярлыки — это текстовые россыпи, которые обычно направляют или предупреждают пользователя с помощью текста.
Метка l1 = новая метка («Это сообщение»);
Текстовые поля — это поля ввода, в которые пользователь может вводить текст и. Этот ввод записывается и обрабатывается программой.
TextField txt = новое TextField();
Кнопки — работают как переключатели событий, поскольку они обычно вызывают смену сцены и используются для записи или передачи данных.
Кнопка btn = новая кнопка(); → Инициализируйте объект Button с именем btn.
btn.setText("Перейти к следующей странице"); → Установите текст на кнопке.
Макеты
После создания узлов/компонентов пользовательского интерфейса часто важно упорядочить их в формате, обеспечивающем красивый и хорошо спроектированный пользовательский интерфейс. Вот несколько макетов и способы их реализации.
Макеты — HBox, VBox, панель границ, панель сетки.
HBox(Horizontal Box) — здесь все узлы (компоненты) расположены в один горизонтальный ряд.
HBox Hlayout = новый HBox(); → Инициализировать объект макета HBox.
Hlayout.getChildren().addAll(label1,button1,button2); → добавьте узлы в контейнер макета. используйте только .add(), если во всем макете есть только один узел.
Это создает базовый макет со всеми узлами внутри. Но все компоненты приклеены очень близко и все размещены в углу. Чтобы бороться с этим, мы используем еще несколько функций в макете.
Hlayout.setSpacing(20); → Устанавливает расстояние между каждым узлом на 20 пикселей.
Hlayout.setMargin(метка1, новые вставки(30,30,30,30)); → Устанавливает поле конкретного узла в макете на 30 пикселей со всех сторон.
Hlayout.setAlignment(Pos.CENTER) → Устанавливает общий макет в соответствии с указанным Pos (имеет несколько вариантов).
VBox(Vertical Box) — здесь все узлы расположены в один вертикальный ряд.
VBox Vlayout = новый VBox(); → Инициализировать объект макета VBox.
Остальные методы точно такие же, как у HBox().
BorderPane – этот макет содержит 5 основных областей, в которых можно размещать узлы, группы узлов или даже другие макеты.
BorderPane bp = новый BorderPane(); → Инициализируйте объект компоновки Border Pane.
бп.setTop(hbox1); → Установите макет HBox в верхней части макета панели границ.
bp.setLeft(vbox1); → Установите макет VBox в верхней части макета панели границ.
GridPane — в этом макете все узлы добавляются в гибкую сетку строк и столбцов.
GridPane gp = новый GridPane(); → Инициализируйте объект макета GridPane.
gp.setVgap(10); → Установите вертикальный зазор между каждым столбцом.
gp.setHgap(10); → Установите горизонтальный зазор между каждым рядом.
gp.add(метка, 0,0); → Добавьте узел (метку) в позицию сетки, где позиция строки = 0 и позиция столбца = 0.
gp.add(кнопка,4,5); → Добавьте узел (кнопку) в позицию сетки, где позиция строки = 4 и позиция столбца = 5.
В следующих частях этого руководства я расскажу более подробно, например, о функциях изменения событий, окнах подтверждения «окна внутри окон» и многом другом. Используя примеры и пытаясь воссоздать более важные функции.
