3.2.2 Створення інтерфейсу додатка
Інтерфейс буде розроблятися для таких можливостей:
Веб-браузер;
Медіа програвач;
Побудова графіків;
Редагування користувачів;
Стилювання.
В клас JavafxApp потрібно додати наступний код:
private StackPane view;
private MediaPlayer mediaPlayer;
…
public void gotoMain() {
BorderPane root = new BorderPane();
Scene scene = new Scene(root, mainW, mainH, Color.LIGHTBLUE);
scene.getStylesheets().add(JavafxApp.class.getResource("styles.css").toExternalForm());
stage.setScene(scene);
stage.sizeToScene();
stage.centerOnScreen();
view = new StackPane();
root.setCenter(view);
HBox taskbar = new HBox(10);
taskbar.setPadding(new Insets(10, 30, 20, 30));
taskbar.setPrefHeight(150);
taskbar.setAlignment(Pos.CENTER);
root.setBottom(taskbar);
for (int i = 0; i < 5; i++) {
ImageView node = new ImageView(new Image(getClass().getResource("media/images/icon-" + i + ".png").toString()));
node.setFitWidth(100);
node.setPreserveRatio(true);
taskbar.getChildren().add(node);
}
}
private void changeView(Node node) {
view.getChildren().clear();
mediaPlayer.stop();
view.getChildren().add(node);
}
В методі gotoMain встановлюються нові розміри сцени, вікно позиціонується у центр екрану та в циклі завантажуються малюнки, які будуть слугувати кнопками. Отже потрібно створити ієрархію папок media/images та помістити малюнки туди, давши кожному назву icon-N, де N — порядковий номер.
За допомогою Insets розміщується taskbar. Insets - це клас набору відступів, його конструктор: public Insets(double top, double right, double bottom, double left). view — це контейнер, в якому будуть виконуватися всі заплановані функції додатку.
Замість виведення повідомлення про успішну авторизацію потрібно поставити перехід в головне меню (JavafxApp.getInstance().gotoMain();) і запустити додаток (рис. 3.8).
Рис. 3.8. Вигляд головного меню додатка
Але через те, що в майбутньому знадобиться прикрашати додаток, буде більш зручно використовувати окрему функцію, яка поки що буде тільки завантажувати зображення. Для цього потрібно створити окремий пакет utils, а в ньому абстрактний клас ButtonCreator:
public abstract class ButtonCreator {
public static Node createButton(String iconPath, final Runnable action) {
final ImageView node = new ImageView(new Image(iconPath));
node.setFitWidth(100);
node.setPreserveRatio(true);
return node;
}
node.setOnMouseClicked(new EventHandler<MouseEvent>() {
public void handle(MouseEvent event) {
action.run();
}
});
}
У другому параметрі виклику методу, в Runnable action буде передаватися реакція на подію натискання на клавішу.
Тепер цикл завантаження зображень виглядає наступним чином:
for (int i = 0; i < 7; i++) {
taskbar.getChildren().add(ButtonCreator.createButton(getClass().getResource("media/images/icon-" + i + ".png").toString(), null));
}