Графіки
JavaFX надає розробникам шість класів, які презентують відповідні шість типів графіків. Це: BarChart, AreaChart, LineChart, BubbleChart, ScatterChart та PieChart. Але розробники не обмежені цими типами: на основі цих класів можна створити власні графіки.
Всі класи окрім PieChart мають суперклас XYChart, який відповідає за вісі. Властивість xValue відповідає за тип даних, який буде відображатися по осі Х. yValue відповідає за вісь Y. З класами, які мають вісі, можна використовувати XYChart.Series клас. Цей клас є графіком, побудованим на з’єднаних лінією точках. Нижче наведено приклад створення графіку з використанням XYChart.Series (рис. 3.21):
public class LineChartSample extends Application {
@Override public void start(Stage stage) {
stage.setTitle("Line Chart Sample");
final CategoryAxis xAxis = new CategoryAxis();
final NumberAxis yAxis = new NumberAxis();
xAxis.setLabel("Month");
final LineChart<String,Number> lineChart =
new LineChart<String,Number>(xAxis,yAxis);
lineChart.setTitle("Stock Monitoring, 2010");
XYChart.Series series = new XYChart.Series();
series.setName("My portfolio");
series.getData().add(new XYChart.Data("Jan", 23));
series.getData().add(new XYChart.Data("Feb", 14));
series.getData().add(new XYChart.Data("Mar", 15));
series.getData().add(new XYChart.Data("Apr", 24));
series.getData().add(new XYChart.Data("May", 34));
series.getData().add(new XYChart.Data("Jun", 36));
series.getData().add(new XYChart.Data("Jul", 22));
series.getData().add(new XYChart.Data("Aug", 45));
series.getData().add(new XYChart.Data("Sep", 43));
series.getData().add(new XYChart.Data("Oct", 17));
series.getData().add(new XYChart.Data("Nov", 29));
series.getData().add(new XYChart.Data("Dec", 25));
Scene scene = new Scene(lineChart,800,600);
lineChart.getData().add(series);
stage.setScene(scene);
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
Рис. 3.21. Графік, побудований за допомогою класу LineChart
ПРАКТИЧНА ЧАСТИНА
3.3.1 Інтегрування веб-браузеру до проекту
Дати користувачеві можливість продивлятися веб-ресурси за допомогою JavaFx дуже легко. Якщо в клас JavafxApp в метод setButtonsActions дописати наступні рядки:
taskbar.getChildren().add(ButtonCreator.createButton(getClass().getResource("media/images/icon-3.png").toString(), new Runnable() {
public void run() {
WebView browser = new WebView();
WebEngine webEngine = browser.getEngine();
webEngine.load("http://www.google.ru/");
changeView(browser);
}
}));
то запустивши додаток можна побачити наступне (рис. 3.22).
Але для більшого комфорту потрібно хоча б дати користувачеві можливість змінювати адресу сторінки. Для цього потрібно створити окремий клас Browser в новому пакеті browser з наступним кодом:
public class Browser extends BorderPane {
private final WebView browser = new WebView();
private final WebEngine webEngine = browser.getEngine();
private final HBox hbox = new HBox();
private final TextField tf = new TextField();
private final String startPage = "http://www.google.ru/";
private final Button change = new Button("Change");
public Browser() {}
}
Рис. 3.22. Демонстрація вбудованого веб-браузеру
HBox hbox буде містити в собі рядок для введення адреси та кнопку переходу за введеною адресою. Також потрібно надати можливість переходу за адресою після натиснення клавіші Enter. Отже конструктор буде виглядати так:
public Browser() {
this.setCenter(browser);
tf.setText(startPage);
tf.setOnKeyPressed(new EventHandler <KeyEvent>(){
@Override
public void handle(KeyEvent t) {
if (t.getCode() == KeyCode.ENTER) {
webEngine.load(tf.getText());
}
}
});
change.setOnAction(new EventHandler<ActionEvent>(){
@Override public void handle(ActionEvent e){
webEngine.load(tf.getText());
}
});
browser.widthProperty().addListener(new ChangeListener(){
@Override public void changed(ObservableValue o,Object oldVal, Object newVal){
tf.setPrefWidth((Double)newVal - 61);
//At start change.getWidth() equals 0, so...hardcoding.
}
});
hbox.getChildren().addAll(tf, change);
this.setBottom(hbox);
change.fire();
}
}
В конструкторі визначаються три оброблювачі подій: один для переходу за адресою через клавішу Enter, інший — по натисканню кнопки change, а третій необхідний для змінення довжини текстового поля вводу адреси. Береться ширина веб-браузера та віднімається ширина кнопки. Але через те, що в конструкторі change.getWidth()повертає 0 — приходиться вручну задавати це значення. Запустивши додаток можна подивитись на результат (рис. 3.23).
Рис. 3.23. Веб-браузер з панеллю адреси