Главная
Блог разработчиков phpBB
 
+ 17 предустановленных модов
+ SEO-оптимизация форума
+ авторизация через соц. сети
+ защита от спама

JavaFX, HelloWorld CSS FXML. Окончание

Anna | 4.06.2014 | нет комментариев

HelloWorld из примера, предложенного Oracle в «Getting Started with JavaFX», на ПК с Windows. Преображение окна ввода логина и пароля с поддержкой CSS, создание формы на FXML, а также применение CSS в FXML’овой форме. Вновь командная строка и тонкости, о которых нам не рассказали в туториале.

В первом разделе Getting Started with JavaFX описывается создание простейшено приложения JavaFX, которое получилось завести с поддержкой командной строки тут. Во втором разделе предлагается сделать окно ввода логина и пароля. Оно сделано из первого приложения здесь. В итоге код несколько подрос в размерах.

HelloWorld.java

package helloworld;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.scene.layout.GridPane;
import javafx.geometry.*;
import javafx.scene.text.*;
import javafx.scene.control.*;
import javafx.scene.paint.*;
import javafx.scene.layout.HBox;

public class HelloWorld extends Application {
	public static void main(String[] args) {
		launch(args);
	}
	@Override
	public void start(Stage primaryStage) {
		primaryStage.setTitle("JavaFX Welcome");
		GridPane grid = new GridPane();
		grid.setAlignment(Pos.CENTER);
		grid.setHgap(10);
		grid.setVgap(10);
		grid.setPadding(new Insets(25, 25, 25, 25));
//		grid.setGridLinesVisible(true);

		Text scenetitle = new Text("Welcome");
		scenetitle.setFont(Font.font("Tahoma", FontWeight.NORMAL, 20));

		grid.add(scenetitle, 0, 0, 2, 1);
		Label userName = new Label("User Name:");
		grid.add(userName, 0, 1);
		TextField userTextField = new TextField();
		grid.add(userTextField, 1, 1);
		Label pw = new Label("Password:");
		grid.add(pw, 0, 2);
		PasswordField pwBox = new PasswordField();
		grid.add(pwBox, 1, 2);

		Button btn = new Button("Sign in");
		HBox hbBtn = new HBox(10);
		hbBtn.setAlignment(Pos.BOTTOM_RIGHT);
		hbBtn.getChildren().add(btn);
		grid.add(hbBtn, 1, 4);

		final Text actiontarget = new Text();
			grid.add(actiontarget, 1, 6);

		btn.setOnAction(new EventHandler<ActionEvent>() {

		    @Override
		    public void handle(ActionEvent e) {
			actiontarget.setFill(Color.FIREBRICK);

			actiontarget.setText("Sign in button pressed");
		    }
		});

		Scene scene = new Scene(grid, 300, 275);
		primaryStage.setScene(scene);

		scene.getStylesheets().add
		     (HelloWorld.class.getResource("HelloWorld.css").toExternalForm());

		primaryStage.show();
	}
}

Команды компиляции, запуска, упаковки в jar и запуска jar, всякая в своем CMD-файле, остались бывшими.

Командная строка

@"C:Program FilesJavajdk1.7.0_40binjavac" -d out -classpath "C:Program FilesJavajre7libjfxrt.jar" srchelloworldHelloWorld.java
@"C:Program FilesJavajdk1.7.0_40binjava" -classpath "C:Program FilesJavajre7libjfxrt.jar;.out" helloworld.HelloWorld
@"C:Program FilesJavajdk1.7.0_40binjavafxpackager" -createjar -appclass helloworld.HelloWorld -srcdir .out -outfile HelloWorld -v
@"C:Program FilesJavajre7binjava.exe" -jar HelloWorld.jar
@pause

Займемся третьим разделом. Туториал предлагает воспользоваться заготовкой из второго раздела. Так и сделаем, только он у нас не Login.java, а HelloWorld.java. Пришло время создавать CSS-файл.

Проигнорируем те пункты инструкции (в туториале), которые касаются работы с IDE. В четвертом пункте предлагается сделать CSS-файл в папке srclogin, в нашем случае получается srchelloworld. Ну, пока что так и сделаем, только обзовем его, раз уж продолжаем здороваться с миром, HelloWorld.css. Хоть это и не твердо.

Шестой пункт рассказывает, какие метаморфозы нужно внести в код java: позже строк

Scene scene = new Scene(grid, 300, 275);
primaryStage.setScene(scene);

нужно вставить

scene.getStylesheets().add
 (HelloWorld.class.getResource("HelloWorld.css").toExternalForm());

(с поправкой на наименования файлов и классов), аккурат перед

primaryStage.show();

Помимо того, Дабы текстовые объекты могли как-то управляться CSS-файлом, нужно этим объектам дать соответствующие идентификаторы. Для этого нужно обнаружить строки

scenetitle.setFont(Font.font(“Tahoma”, FontWeight.NORMAL, 20));  

и

actiontarget.setFill(Color.FIREBRICK);

и заменить их на

scenetitle.setId("welcome-text");

и

actiontarget.setId("actiontarget");

соответственно. А отменнее, на каждый случай, не заменять, а закрыть комментарием, а исправление записать строчкой ниже.

И, безусловно, нужно наполнить файл с таблицами жанров.

HelloWorld.css

.root {
     -fx-background-image: url("background.jpg");
}
.label {
    -fx-font-size: 12px;
    -fx-font-weight: bold;
    -fx-text-fill: #333333;
    -fx-effect: dropshadow( gaussian , rgba(255,255,255,0.5) , 0,0,0,1 );
}
#welcome-text {
   -fx-font-size: 32px;
   -fx-font-family: "Arial Black";
   -fx-fill: #818181;
   -fx-effect: innershadow( three-pass-box , rgba(0,0,0,0.7) , 6, 0.0 , 0 , 2 );
}
#actiontarget {
  -fx-fill: FIREBRICK;
  -fx-font-weight: bold;
  -fx-effect: dropshadow( gaussian , rgba(255,255,255,0.5) , 0,0,0,1 );  
}
.button {
    -fx-text-fill: white;
    -fx-font-family: "Arial Narrow";
    -fx-font-weight: bold;
    -fx-background-color: linear-gradient(#61a2b1, #2A5058);
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
}
.button:hover {
    -fx-background-color: linear-gradient(#2A5058, #61a2b1);
}

Наполнил сразу каждому, что по тексту третьего раздела предлагается втыкать понемногу, любуясь итогом — фоновая картинка, результаты текста, результаты кнопки.

Ах да, нужно же еще картинку для фонового изображения… Ну, я не стал скачивать либо рисовать, а скопировал первую попавшуюся. Первой попалась фоновая (иронично, как раз к месту) из папки «Мои рисункиОбразцы рисунков» — Закат.jpg. Переименовал в background.jpg и положил рядом с CSS-файлом.

Компилируем. Удачно. Запускаем. Не работает! Постигаем итог ошибок. Настораживает Зачастую встречающееся Unknown source, стало быть, неведомый источник. Плюс находятся знакомые буквы среди каждого этого безобразия:

at helloworld.HelloWorld.start(HelloWorld.java:68)

А в шестьдесят восьмой строке у нас как раз выковыривание жанров из CSS-файла. Тот, что положен по инструкции в srchelloworld. В контесте данного «изыскания» я даже не хочу рассматривать, отчего для NetBeans данный файл требуется именно в папке исходников (правда и догадываюсь). Но, раз мы нигде не указывали путь к файлу жанров, он должен лежать непринужденно вблизи того, кто им пользуется. А запускается неупакованная программа из файла HelloWorld.class, тот, что в outhelloworld. Давайте туда и перебросим, совместно с картинкой.

Сейчас компилируется и запускается. Правда, картинка фоновая крепко отличается от туториальной, и краснокирпичное сообщение о нажатой кнопке на красном фоне нехорошо видно, но это мелочи, это дозволено и поменять. Комично другое — давайте сейчас дадим команду упаковки в jar и испробуем jar-файл запустить.

Не запускается! А если запускали консольной командой, а не щелчком по самому файлу, то видно ошибки, и какие-то они знакомые… Давайте-ка залезем в jar, как словно это архив. Там лежит конструкция папок comjavafxmain, присутствие которой обеспечивается утилитой javafxpackager, и META-INF с манифестом, это не дюже увлекательно теперь. А увлекательна папка helloworld, в которой нет HelloWorld.css, но есть HelloWorld.bss! Выходит, упаковщик дерзко, без нашей команды, переупаковал CSS в бинарный вид. Проверим? Давайте заменим растяжение .css на .bss в шестьдесят восьмой строке, откомпилируем, но не будем сразу запускать, а упакуем и запустим сразу jar.

Сейчас запускается. Но, какая неприятность, не запускается из HelloWorld.class! Не удерживать же два комплекта исходников для различных случаев. Тем больше, bss как раз рекомендованы для убыстрения загрузки. Добавим команду, которую запишем в файл css2bss.cmd:

@"C:Program FilesJavajdk1.7.0_40binjavafxpackager" -createbss -srcdir .srchelloworld -outdir .outhelloworld -srcfiles HelloWorld.css -v
@pause

Файлы CSS и фоновой картинки перекинем в srchelloworld (как от нас с самого начала и требовали), в файле исходника оставим в строке, где getStylesheets(), растяжение .bss. Компилируем. Делаем bss. Упаковываем в jar. Сейчас работают и запуск из HelloWorld.class, и из HelloWorld.jar. А разобраться в том, какие жанры за что отвечают, и как их дозволено всяко-различно менять, предлагаю самосильно. Эта тема непринужденно к JavaFX не относится.

Ну и четвертый раздел туториала — FXML. Код программы изменяется настолькоко крепко, что проще переписать его снова. И даже сделать копию плана в соседней папке, скажем, GetStartFXML. Туда нужно скопировать теснее пять командных файлов и сделать папки out и srchelloworld, а в последнюю положить исходник.

HelloWorld.java

package helloworld;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.*;
import javafx.fxml.*;

public class HelloWorld extends Application {
	public static void main(String[] args) {
		launch(args);
	}
	@Override
	public void start(Stage stage) throws Exception {
	    Parent root = FXMLLoader.load(getClass().getResource("fxml_example.fxml"));

	    Scene scene = new Scene(root, 300, 275);
	    stage.setTitle("FXML Welcome");
	    stage.setScene(scene); 
	    stage.show();

	}
}

Дальше нужно собрать файл fxml_example.fxml, разбросанный по четвертому разделу. Так как данные из него будут подхватываться на лету, как и из CSS-файла, стоит сделать его сразу же рядом с использующим его файлом HelloWorld.class, которого еще не существует. То есть, в outhelloworld, следственно сотворим вложенную в out папку самосильно, до первой компиляции.

fxml_example.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<GridPane fx:controller="helloworld.FXMLExampleController" xmlns:fx="http://javafx.com/fxml" alignment="center" hgap="10" vgap="10" styleClass="root">

    <padding><Insets top="25" right="25" bottom="10" left="25"/></padding> 

<Text id="welcome-text" text="Welcome" GridPane.columnIndex="0" GridPane.rowIndex="0" GridPane.columnSpan="2"/>

<Label text="User Name:" GridPane.columnIndex="0" GridPane.rowIndex="1"/>
<TextField GridPane.columnIndex="1" GridPane.rowIndex="1"/>
<Label text="Password:" GridPane.columnIndex="0" GridPane.rowIndex="2"/>
<PasswordField fx:id="passwordField" GridPane.columnIndex="1" GridPane.rowIndex="2"/>

<HBox spacing="10" alignment="bottom_right" GridPane.columnIndex="1" GridPane.rowIndex="4">
<Button text="Sign In" onAction="#handleSubmitButtonAction"/>
</HBox>
<Text fx:id="actiontarget" GridPane.columnIndex="1" GridPane.rowIndex="6"/>

<stylesheets>
<URL value="@HelloWorld.css" />
</stylesheets>

</GridPane>

Данный файл сразу включает в себя и работу с CSS, а чего тащить-то? Следственно положим рядом незадолго сделанные HelloWorld.css и background.jpg. Не хватает еще обработки событий кнопки. В четвертом разделе предлагается для этого применять обособленный файл, упомянутый в FXML: GridPane fx:controller=«helloworld.FXMLExampleController».

FXMLExampleController.java

package helloworld;

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.scene.text.Text;

public class FXMLExampleController {
@FXML private Text actiontarget;
@FXML protected void handleSubmitButtonAction(ActionEvent event) {
actiontarget.setText("Sign in button pressed");
}
}

И безусловно не нужно забывать его тоже откомпилировать, для чего добавим в compile.cmd дополнительную строчку. Помимо того, я убрал «собаку» перед командами компиляции, Дабы видеть, что обе запустились и отработали:

"C:Program FilesJavajdk1.7.0_25binjavac" -d out -classpath "C:Program FilesJavajre7libjfxrt.jar" srchelloworldHelloWorld.java 
"C:Program FilesJavajdk1.7.0_40binjavac" -d out -classpath "C:Program FilesJavajre7libjfxrt.jar" srchelloworldFXMLExampleController.java
@pause

Компилируем. Собираем jar. Запускаем class либо запускаем jar. Работает, различий внешнего вида и поведения от предыдущего примера не видно. Но получилось поделить приложение на кучу модулей — отдельно основной класс, создающий сцену, отдельно изложение формы, отдельно обработчик событий, отдельно жанры элементов. Причем, таблицы жанров и изложение формы дозволено менять без перекомпиляции класса, скажем, переставить местами элементы в ячейках таблицы GridPane либо сменить фоновую картинку.

Источник: programmingmaster.ru

Оставить комментарий
Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2017 © BB3x.ru - русская поддержка форума phpBB