Gui — JavaFX (accordion)


JavaFX tutorial

This is a JavaFX tutorial. The JavaFX tutorial is suited for beginners and intermediate Java developers. After reading this tutorial, you will be able to develop non-trivial JavaFX applications.

Table of contents


JavaFX is a software platform for developing and delivering rich internet applications (RIAs) that can run across a wide variety of devices. JavaFX is the next generation GUI toolkit for the Java platform.

The Java Swing tutorial covers Swing. The Advanced Java Swing e-book covers advanced Java Swing topics. The Java SWT tutorial covers the third-party SWT toolkit. The Java 2D games tutorial and the Java 2D tutorial further enhance your knowledge of the graphics programming in Java. The Java tutorial teaches the basics of Java language.

JavaFX Accordion Support

About Support

TestComplete can recognize JavaFX Accordion controls in JavaFX and Swing applications. It provides special properties and methods that let you retrieve the controls data and simulate user actions on the controls (see below).

Supported Versions

Supported component versions: JavaFX SDK ver. 2.2.7 — 2.2.45, 8, 9, 10, 11.


In order for TestComplete to be able to work with JavaFX Accordion controls, the following requirements must be met:

You must have an active license for the TestComplete Desktop module.

The control’s >JavaFX Controls | Accordion group of your project’s Object Mapping options. By default, this group contains the following item:

You can also command the test engine to recognize custom controls as JavaFX Accordion controls. See below for information about this.

Support for the JavaFX Accordion controls is implemented by the JavaFX Control Support plugin. This plugin is installed and enabled automatically as part of the TestComplete Desktop module.

If you experience issues when working with the controls, select File > Install Extensions from the TestComplete main menu and check whether the plugin is active. (You can find the plugin in the Desktop group.) If the plugin is not available, run the TestComplete installation in the Repair mode.

Recognizing Custom Controls

To command TestComplete to recognize your custom controls as JavaFX Accordion controls, open your project’s Object Mapping options and add the control’s >JavaFX Controls | Accordion group. The class name is specified by the control’s JavaFullClassName property. You can get the property value in the Object Browser panel. You can also choose the needed control from screen. For detailed information, see Object Mapping. Once the control is mapped, it gets all the properties, methods and actions specific to the JavaFX Accordion control.

Цукерберг рекомендует:  Bot - Как создать бота для игры или сайта

If the specified custom control does not fit the control’s type, then it may not properly respond to commands that TestComplete sends, so recording or playing back user actions over the tested control will cause errors.


When testing JavaFX Accordion controls, you can use properties and methods specific to these controls, as well as properties and methods that TestComplete applies to onscreen objects. For the full list of available properties and methods, see the following topics:

JavaFX Tutorial

JavaFX is a Java library used to build Rich Internet Applications. The applications written using this library can run consistently across multiple platforms. The applications developed using JavaFX can run on various devices such as Desktop Computers, Mobile Phones, TVs, Tablets, etc..

To develop GUI Applications using Java programming language, the programmers rely on libraries such as Advanced Windowing Tool kit and Swing. After the advent of JavaFX, these Java programmers can now develop GUI applications effectively with rich content.

In this tutorial, we will discuss all the necessary elements of JavaFX that you can use to develop effective Rich Internet Applications.


This tutorial has been prepared for beginners who want to develop Rich Internet Applications using JavaFX.


For this tutorial, it is assumed that the readers have a prior knowledge of Java programming language.

JavaFX Accordion Slide Out Menu for the NetBeans Platform

Join the DZone community and get the full member experience.

Let’s say you have a NetBeans Platform application that puts a premium on vertical space. Maybe a Heads Up Display on a Touch Screen? Wouldn’t it be great to have the menu slide out from the edge of the screen only when you need it? Well the NetBeans Platform provides slide-in TopComponents, of course, but a JMenu just isn’t going to work out so well inside one.

We can use JavaFX as part of the solution as it provides some capabilities that the base Swing components available in the NetBeans Platform do not. Let’s say we take all of our root MenuBar items and place them within an Accordion type pane. Each collapsible TitledPane of the Accordion control could then contain the sub-menu items, maybe represented by a JavaFX MenuButton. This would allow for a recursive Menu like effect but the overall container could be placed anywhere.

Something like the screenshot below:

What we see here is the described effect sliding out and overlayed on top of the Favorites tab. I sprinkled in some transparency for good measure. Notice how we are able to completely eliminate the Menu Bar and Tool Bar gaining potentially valuable real estate? The rest of this tutorial will explain the steps necessary to achieve something like this.

To fully understand and follow this tutorial you will need to start with the tutorial that this tutorial is clearly evolved from of which the link is below:

That article was written by Geertjan Wielenga and it will become clear that much of the base code to accomplish this article was extended from Geertjan’s example. Thanks again Geertjan!

Similar articles to this that may be helpful are below:

All these articles are loosely coupled in a tutorial arc towards explaining and demonstrating the advantages of integrating JavaFX into the NetBeans Platform. The following two steps are borrowed exactly as found from Geertjan’s tutorial:

Step 1. Remove the default menubar and replace with your own:

Step 2: In the layer.xml file define your Swing replacement menubar.

I have also taken the liberty to hide the Toolbars as well. Now why are we replacing the old MenuBar with a new MenuBar if we intend to hide it? Well if you hide the MenuBar via the layer.xml as I did the Toolbars the filesystem folder tree will not be instantiated. That means we won’t be able to dynamically determine the Menu Folder tree to rebuild our custom AccordionMenu. The solution? Make an empty Menubar.

Step 3: Build an «AccordionMenu» using JavaFX

This is where the tutorials diverge and this process gets a bit more complicated. Our task is to use the JavaFX/Swing Interop pattern to create a component that extends JFXPanel yet can give the user access to all the items that were once in the Menu Bar. The basic algorithm is as such:

Create a component that extends JFXPanel
Implement the standard Platform.runLater() pattern for creating a JavaFX scene
Loop through each top level file object in the Menu folder of the application file system:

Create a JavaFX Flow Pane for each file object
Recursively create JavaFX ButtonMenu items for submenus
Add ButtonMenu items to FlowPanes
Add FlowPane to JavaFX TitledPane
Add TitledPane to JavaFX Accordion component

Add Accordion to scene

So instead of Menus and SubMenus, we are using MenuButtons which can be recursively added to other MenuButtons and MenuItems. The Accordion control gives us a space saving collapsible view with some nice animation. The FlowPane makes it easy to layout the MenuButtons horizontally in a way that maximizes space. Below is the code for my AccordionMenu class. You will see where I borrowed heavily from Geertjan’s example:

I took the liberty of placing a few CSS stylings here and there, trying to play with the transparency. Also I found that it looked better if a JavaFX Button was used for any Actions found at the very top level, instead of a MenuButton with a single item.

Step 4: Build a Slide in TopComponent for the new AccordionMenu

Now that you have a JFXPanel Swing Interop component, your NetBeans Platform TopComponent doesn’t need to know about JavaFX. However in this scenario the Platform also is contributing via its wonderful docking framework. Use the Window wizard and select Left Sliding In as a mode. I would also advise making this component not closable, otherwise the user could lose the ability to use the menu. Here are the annotations and constructor code in my TopComponent:

Step 5. See how great it looks

We now have a slide out collapsible application menu provided by JavaFX components. These components can be «skinned» using CSS stylings and as such the menu can be crafted differently for different applications. (By the way if anyone reading this has some ideas please contact me because I am not a CSS guy at all)

Best of all we have adapted our application to work nicely with a Heads Up Display or Kiosk view that typically run on touchscreen computers. This is because we have saved real estate and implemented an interface that is more condusive to single touches versus mouse drag events.

Hey let’s see how it might look with an application that needs all the space it can get?

GUI на Java

Пользовательский интерфейс на Java прошел весьма тернистый путь становления и развития. Долгое время его обвиняли в медленной работе, жадности к ресурсам системы, ограниченной функциональности. Появление .NET с более быстрыми графическими компонентами еще больше пошатнуло позиции Java. Но нет худа без добра — все эта движуха только подстегивала разработчиков Java к развитию и улучшению графических библиотек. Посмотрим, что из этого получилось.

Abstract Window Toolkit

Хакер #183. Малварь для Android

AWT была первой попыткой Sun создать графический интерфейс для Java. Они пошли легким путем и просто сделали прослойку на Java, которая вызывает методы из библиотек, написанных на С. Библиотечные методы создают и используют графические компоненты операционной среды. С одной стороны, это хорошо, так как программа на Java похожа на остальные программы в рамках данной ОС. Но с другой стороны, нет никакой гарантии, что различия в размерах компонентов и шрифтах не испортят внешний вид программы при запуске ее на другой платформе. Кроме того, чтобы обеспечить мультиплатформенность, пришлось унифицировать интерфейсы вызовов компонентов, из-за чего их функциональность получилась немного урезанной. Да и набор компонентов получился довольно небольшой. К примеру, в AWT нет таблиц, а в кнопках не поддерживается отображение иконок.

Использованные ресурсы AWT старается освобождать автоматически. Это немного усложняет архитектуру и влияет на производительность. Освоить AWT довольно просто, но написать что-то сложное будет несколько затруднительно. Сейчас ее используют разве что для апплетов.


  • часть JDK;
  • скорость работы;
  • графические компоненты похожи на стандартные.


  • использование нативных компонентов налагает ограничения на использование их свойств. Некоторые компоненты могут вообще не работать на «неродных» платформах;
  • некоторые свойства, такие как иконки и всплывающие подсказки, в AWT вообще отсутствуют;
  • стандартных компонентов AWT очень немного, программисту приходится реализовывать много кастомных;
  • программа выглядит по-разному на разных платформах (может быть кривоватой).


В настоящее время AWT используется крайне редко — в основном в старых проектах и апплетах. Oracle припрятал обучалки и всячески поощряет переход на Swing. Оно и понятно, прямой доступ к компонентам оси может стать серьезной дырой в безопасности.


Как выглядит Swing

Вслед за AWT Sun разработала набор графических компонентов под названием Swing. Компоненты Swing полностью написаны на Java. Для отрисовки используется 2D, что принесло с собой сразу несколько преимуществ. Набор стандартных компонентов значительно превосходит AWT по разнообразию и функциональности. Стало легко создавать новые компоненты, наследуясь от существующих и рисуя все, что душе угодно. Стала возможной поддержка различных стилей и скинов. Вместе с тем скорость работы первых версий Swing оставляла желать лучшего. Некорректно написанная программа и вовсе могла повесить винду намертво.

Тем не менее благодаря простоте использования, богатой документации и гибкости компонентов Swing стал, пожалуй, самым популярным графическим фреймворком в Java. На его базе появилось много расширений, таких как SwingX, JGoodies, которые значительно упрощают создание сложных пользовательских интерфейсов. Практически все популярные среды программирования Java включают графические редакторы для Swing-форм. Поэтому разобраться и начать использовать Swing не составит особого труда.


  • часть JDK, не нужно ставить дополнительных библиотек;
  • по Swing гораздо больше книжек и ответов на форумах. Все проблемы, особенно у начинающих, гуглу досконально известны;
  • встроенный редактор форм почти во всех средах разработки;
  • на базе свинга есть много расширений типа SwingX;
  • поддержка различных стилей (Look and feel).


  • окно с множеством компонентов начинает подтормаживать;
  • работа с менеджерами компоновки может стать настоящим кошмаром в сложных интерфейсах.


Swing жил, Swing жив, Swing будет жить. Хотя Oracle и старается продвигать JavaFX, на сегодняшний день Swing остается самым популярным фреймворком для создания пользовательских интерфейсов на Java.

Standard Widget Toolkit

SWT был разработан в компании IBM в те времена, когда Swing еще был медленным, и сделано это было в основном для продвижения среды программирования Eclipse. SWT, как и AWT, использует компоненты операционной системы, но для каждой платформы у него созданы свои интерфейсы взаимодействия. Так что для каждой новой системы тебе придется поставлять отдельную JAR-библиотеку с подходящей версией SWT. Это позволило более полно использовать существующие функции компонентов на каждой оси. Недостающие функции и компоненты были реализованы с помощью 2D, как в Swing. У SWT есть много приверженцев, но, положа руку на сердце, нельзя не согласиться, что получилось не так все просто, как хотелось бы. Новичку придется затратить на изучение SWT намного больше времени, чем на знакомство с тем же Swing. Кроме того, SWT возлагает задачу освобождения ресурсов на программиста, в связи с чем ему нужно быть особенно внимательным при написании кода, чтобы случайное исключение не привело к утечкам памяти.


  • использует компоненты операционной системы — скорость выше;
  • Eclipse предоставляет визуальный редактор форм;
  • обширная документация и множество примеров;
  • возможно использование AWT- и Swing-компонентов.


  • для каждой платформы необходимо поставлять отдельную библиотеку;
  • нужно все время следить за использованием ресурсов и вовремя их освобождать;
  • сложная архитектура, навевающая суицидальные мысли после тщетных попыток реализовать кастомный интерфейс.


Видно, что в IBM старались. Но получилось уж очень на любителя…


Как выглядит JavaFX

JavaFX можно без преувеличения назвать прорывом. Для отрисовки используется графический конвейер, что значительно ускоряет работу приложения. Набор встроенных компонентов обширен, есть даже отдельные компоненты для отрисовки графиков. Реализована поддержка мультимедийного контента, множества эффектов отображения, анимации и даже мультитач. Внешний вид всех компонентов можно легко изменить с помощью CSS-стилей. И самое прекрасное — в JavaFX входит набор утилит, которые позволяют сделать родной инсталлятор для самых популярных платформ: exe или msi для Windows, deb или rpm для Linux, dmg для Mac. На сайте Oracle можно найти подробную документацию и огромное количество готовых примеров. Это превращает программирование с JavaFX в легкое и приятное занятие.

Цукерберг рекомендует:  Пароль - Удаляет из базы сам пароль когда восстанавливаешь его


  • быстрая работа за счет графического конвейера;
  • множество различных компонентов;
  • поддержка стилей;
  • утилиты для создания установщика программы;
  • приложение можно запускать как десктопное и в браузере как часть страницы.


  • фреймворк еще разрабатывается, поэтому случаются и падения и некоторые глюки;
  • JavaFX пока не получил широкого распространения.


Хорошая работа, Oracle. Фреймворк оставляет только позитивные впечатления. Разобраться несложно, методы и интерфейсы выглядят логичными. Хочется пользоваться снова и снова!

Визуальные библиотеки на практике

SWT: погодный виджет

Для демонстрации возможностей наиболее популярных графических библиотек и основных принципов работы с ними сделаем несколько небольших виджетов с отображением различной информации.

И начнем, пожалуй, с самого популярного виджета — отображения текущей погоды, для реализации которого выберем SWT.

Любая программа на SWT начинается с создания объекта Display. Он служит своеобразным контекстом приложения, который содержит необходимые методы для обращения к ресурсам системы и обеспечивает цикл событий. Следующим шагом будет создание не менее важного объекта Shell. Shell представляет собой обычное окно операционной системы. В конструктор shell передается Display, чтобы создать окно верхнего уровня.

Так как мы создаем виджет, нам не нужно отображать стандартное обрамление окна и кнопки управления, для этого мы указали флаг NO_TRIM. Для фона мы будем использовать картинку — прямоугольник с закругленными углами. В принципе, окно SWT может принимать любые формы. Чтобы добиться такого эффекта, используем класс Region. Все, что нужно, — добавить в этот класс все видимые точки из картинки фона, пропуская прозрачные.

В изображениях разных форматов прозрачность задается по-разному, поэтому и извлекается информация о прозрачных областях тоже не одинаково. Создаем область фона и добавляем туда все видимые точки:

Устанавливаем форму окна:

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

Итак, по нажатию на клавишу Esc окно закроется. При нажатии левой клавиши мыши на области окна запомним координаты нажатия. При движении мыши с зажатой левой клавишей — передвигаем окно на экране соответственно движению. При событии перерисовки — рисуем картинку фона, используя графический контекст GC.

Назначим слушатель соответствующим событиям окна:

Устанавливаем размер окна равным размеру изображения:

Открываем окно и запускаем цикл событий:

Не забываем в конце освободить использованные ресурсы:

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

Настало время добавить содержания. Будем отображать текущую погоду в виде иконки состояния (солнечно, дождь, снег…), показаний температуры и времени последнего обновления.

Для расположения графических компонентов в окне в нужном виде используются менеджеры компоновки. Менеджер компоновки занимается не только расположением компонентов, но и изменением их размеров при изменении размеров окна. Для нашего виджета будем использовать GridLayout. Этот менеджер располагает компоненты в ячейках воображаемой таблицы. Создаем GridBagLayout на две колонки с различной шириной колонок (флаг false в конструкторе), устанавливаем его в качестве менеджера компоновки окна:

Для картинки статуса используем компонент Label. В качестве родителя передаем объект окна. Вторым параметром можно установить стиль компонента. Для каждого компонента набор возможных флагов стиля разный, их можно посмотреть в документации или прямо в исходниках компонента.

Флаги в классе GridData означают, что метка будет располагаться слева вверху, будет растягиваться горизонтально и вертикально (флаги, установленные в true) при наличии свободного места и занимает одну строку и один столбец таблицы компоновки.

В SWT нет прозрачного фона компонентов, и позади картинки статуса будет красоваться белый фон, чего, конечно, не хотелось бы. Поэтому создадим объект Color с цветом фона окна:

В конце программы этот объект также необходимо очистить, вызвав метод dispose. Устанавливаем цвет фона и картинку статуса, которую можно загрузить из файла точно так же, как мы загрузили картинку фона вначале:

Теперь добавим Label с текущей температурой и расположим его в правой верхней части окна:

Установим какую-нибудь температуру:

Для записи температуры по Цельсию используется юникодный номер соответствующего символа со служебными символами \u.

Шрифт по умолчанию для текстовых меток слишком маленький. Так что создадим новый, побольше:

FontData[] fD = temperatureLabel.getFont().getFontData(); fD[0].setHeight(30); fD[0].setStyle(SWT.BOLD); Font newFont = new Font(display, fD[0]); temperatureLabel.setFont(newFont); Шрифт, как и другие ресурсные объекты, нужно освобождать. Для этого воспользуемся слушателем события разрушения метки:

Наконец, добавим метку с описанием погодных условий:

Текст может быть довольно длинным, так что при создании метки указываем флаг WRAP, чтобы текст автоматически разбивался на несколько строк при нехватке места. Расположим компонент по центру и разрешим ему заполнить все горизонтальное пространство. Также укажем, что компонент занимает два столбца таблицы компоновки. Запускаем и получаем окошко с картинки «Виджет погоды».

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

Swing: всегда свежие новости

На Swing мы напишем виджет для отображения RSS-новостей. Начинаем, как и в прошлый раз, с создания окна. Класс, реализующий функционал стандартного окна в Swing, называется JFrame. По умолчанию закрытие окна приложения в Swing не приводит к остановке программы, так что лучше прописать, как должно себя вести окно при закрытии:

Для представления новостей лучше всего подходит таблица. Swing построен на паттерне «Модель —представление — контроллер» (MVC). В архитектуре MVC модель предоставляет данные, представление отвечает за отображение данных (например, текст, поля ввода), а контроллер обеспечивает взаимодействие между моделью и представлением. Таблица хорошо демонстрирует этот подход. Для представления данных используется класс, реализующий интерфейс TableModel.

Для хранения информации о доступных новостях заведем класс FeedMessage c полями для названия статьи и даты выхода:

Чтобы упростить и ускорить разработку, наследуем нашу модель данных от класса AbstractTableModel, который предлагает готовую реализацию почти всех методов интерфейса TableModel.

Метод fireTableDataChanged сообщает представлению, что модель данных изменилась и необходима перерисовка.

Создаем таблицу и немного изменяем ее вид, чтобы она была больше похожа на виджет. Убираем линии между строками и столбцами, увеличиваем высоту строки и убираем заголовок таблицы с названиями колонок:

Теперь займемся внешним видом ячеек. Swing позволяет назначать отдельные классы представления для разных типов данных. За отрисовку отдельных ячеек таблицы отвечает класс, наследующий интерфейс TableCellRenderer. По умолчанию используется DefaultTableCellRenderer, который представляет собой текстовую метку.

Назначим свой отрисовщик ячейки для данных типа String. Изменим стандартный цвет шрифта и сделаем чередующийся цвет фона, чтобы улучшить читаемость.

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

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

Добавляем компонент прокрутки на главную панель окна. Вторым аргументом можно передать размещение компонента. По умолчанию главная панель окна использует менеджер компоновки BorderLayout, который располагает компоненты по сторонам света. Поместим таблицу с прокруткой в центре.

Как и в прошлый раз, уберем стандартное обрамление окна. А в качестве заголовка окна будем использовать стилизованную текстовую метку, которую разместим вверху окна.

В отличие от SWT, объекты «цвет» и «шрифт» освобождаются автоматически, так что можно больше не переживать за утечки памяти.

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

Теперь поменяем форму окна на прямоугольник с закругленными углами. Лучше всего это делать в слушателе компонента, так как, если размер окна изменится, форма окна будет правильно пересчитана:

Устанавливаем размер окна, убираем обрамление и делаем окно полупрозрачным.

Наконец, открываем окно в графическом потоке. SwingUtilities.invokeLater(new Runnable() < public void run() < frame.setVisible(true); >>);

Осталось дописать загрузку данных в отдельном потоке, и получим такой вот виджет с последними новостями твоего любимого журнала :).

JavaFX: послушаем музычку

И наконец, гвоздь сезона — JavaFX. Воспользуемся его мультимедийными возможностями и компонентом для построения графиков и сделаем простенький эквалайзер.

Для начала наследуем класс виджета от Application. Это основной класс приложения в JavaFX. Application содержит основные методы жизненного цикла приложения. Компоненты формы создаются в методе start, аргументом которому служит класс Stage. Stage представляет собой окно программы. Изменим стиль окна на TRANSPARENT, чтобы убрать обрамление и кнопки. В Stage помещается класс Scene, в котором задаются размеры окна и цвет фона. В Scene, в свою очередь, передаем класс Group, в который будем помещать дочерние компоненты:

Для отображения эквалайзера используем столбиковую диаграмму, по осям которой будем отображать частоту и мощность звука:

Заполняем диаграмму начальными данными:

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

Добавляем оба компонента к группе:

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

Загружаем песню в плеер:

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

Делаем сцену видимой и запускаем песню:

И наслаждаемся такой вот красотой.


Как видишь, остается все меньше того, что не под силу Java. Кроме описанных графических библиотек, есть еще множество других, не таких распространенных, но не обязательно худших по качеству. У каждой из них есть свои сильные и слабые стороны. Java предоставляет право выбора тебе :).

JavaFX изнутри

На JavaOne 2011 было объявлено о выпуске финальной версии JavaFX 2.0. Рассмотрим из чего оно состояит и какие средства предлагает.

Hello JavaFX

Создадим и запустим первое приложение на JavaFX. Для этого нам понадобится JavaFX 2.0 SDK и последний Netbeans. О настройке JavaFX в Netbeans можно прочитать на странице

Запускаем Netbeans, выбираем из меню File/New Project, в диалоге выбираем категорию JavaFX и тип проекта JavaFX Application. Будет создан проект с одной тестовой формой как на картинке ниже (можно назвать проект HelloJavaFX или как-то иначе). Код класса формы:

Посмотрим что у нас появится в папке dist после компиляции. Там будут следующие файлы:
— папка web-files — содержит картинки для запуска в виде апплета
— HelloJavaFX.html — страница с встроенным апплетом приложения
— HelloJavaFX.jar — приложение для запуска обычным двойным щелчком мыши
— HelloJavaFX.jnlp — описатель запуска через WebStart

Нас интересует само приложение HelloJavaFX.jar. Откроем его любым архиватором (.jar это обычный .zip-архив) и посмотрим на манифест. Главная строка запуска:
Main-Class: com/javafx/main/Main
говорит о том что в каждое JavaFX-приложение Netbeans’ом добавляется класс-стартер com.javafx.main.Main, который инициализирует все библиотеки JavaFX и запускает само приложение. Имя главного класс берётся из поля JavaFX-Application-Class, в нашем случает это hellojavafx.HelloJavaFX

Ничего необычного. На данный момент JavaFX это просто набор библиотек, функции которых можно использовать из Java-кода.

JavaFX в Swing

Рассмотрим пример Swing-формы со встроенным JavaFX-компонентом. Создадим в Netbeans новый проект и добавим в него ссылку на Runtime-библиотеку JavaFX (по умолчанию она находится в файле C:\Program Files\Oracle\JavaFX Runtime 2.0\lib\jfxrt.jar).

После подключения Runtime, можно встраивать любые JavaFX-компоненты с помощью класса JFXPanel. Дабавим текстовый редактор с помощью следующего кода:

В результате получится такая форма:

Как видно по коду кнопки Read, мы в любой момент можем получить доступ к данным в текстовом редакторе. Для запуска такого приложения мы должны добавить в class-path путь к Runtime-библиотеки JavaFX, например так:

java -cp %cp%;»C:\Program Files\Oracle\JavaFX Runtime 2.0\lib\jfxrt.jar»;SwingJavaFx.jar swingjavafx.SwingJavaFx

Всё достаточно тривиально и не отличается от использования других библиотек в Java-проектах.


С возможностями JavaFX можно ознакомиться на странице платформы. В API есть набор классов для рисования примитивов, графиков, набор компонентов GUI с собственным оформлением. Наконец-то появился компонент веб-браузера и текстовый редактор с возможностью форматирования.


Binding (связывание) предназначен для связывания свойств объектов. Например вы можете привязать координаты кнопки к ширине окна и в результате при изменении размеров формы, переместится и привязанная кнопка.

Рассмотрим на примере:

Строка с кодом
final DoubleBinding db = scene.widthProperty().subtract(150);
создаёт переменную db и привязывает её значение к ширине формы минус 150 пикселов. К сожалению мы не можем просто привязать координаты кнопки к этой переменной (типа btn.layoutX.bind(db); что было бы очевидно и удобно). Поэтому к созданной переменной надо добавить Listener, в котором и обновлять координаты кнопки:

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

Сам код API чрезмерно раздут, например класс SimpleDoubleProperty имеет иерархию наследования из шести классов и имплементирует девять интерфейсов. Это новое понимание характеристики simple.

В результате хорошая идея выглядит не очень привлекательно. Много кода, неявные ошибки. Хотя простая и понятная реализация связывания есть для многих языков и библиотек, в том числе и для Swing.

Цукерберг рекомендует:  Web developer - Где можно найти реальные примеры по DOM

Использование CSS

Оформление интерфейса можно задавать с помощью CSS. Для этого нужно создать описание стилей, например такое:

— стиль cssbutton задаёт шрифт, отступы, заливку и эффект тени. Далее нужно подключить файл стилей к сцене:

и добавить стиль к компоненту по имени:

Кнопка будет выглядеть примерно так:

Описание доступных в CSS свойств можно прочитать на странице документации.

Не очень понятно зачем вообще нужно задавать оформление стилями. Всё что можно задать стилями можно сделать и в коде, в CSS нельзя использовать переменные или вычисления, нельзя создавать новые свойства, стили сложно отлаживать.

Использование FXML

Компоновку форм можно задать в отдельном файле FXML и при старте приложения загрузить из него. Такой подход используется во многих средах разработки.

В Netbeans для этих целей предлагается создать проект с типом JavaFX FXML Application. Будет создана начальная форма примерно такого содержания:

Аннотация @FXML служит для обозначения переменных и функций доступных при загрузке из FXML-файла. Сам файл выглядит примерно так:

Как видно в примере, и метод handleButtonAction и свойство label заданные в коде, используются внутри FXML-описания формы.

Загрузка FXML-формы при старте приложения вызывается примерно так:

Каких-то преимуществ подобное создание GUI не даёт. Визуального редактора нет, а править руками одинаково затратно как Java-код, так и FXML-описание.

Визуальный редактор

Форморисовалка есть в Visual Studio для VB и C#, в Adobe Flex, в Oracle JBuilder есть прекрасный редактор для Swing. Для JavaFX визульный редактор был объявлен ещё 2 года назад. Можно даже видео с ним посмотреть на странице

Но пока публичного релиза не было и неизвестно когда будет.

Ложка мёда в бочке дёгтя

Общая оценка скорей всего неудовлетворительная. Демо-приложения тормозят, внешний вид компонентов уступает Macintosh Aqua, Adone Flex или Microsoft Metro. Первая версия JavaFX появилась ещё в далёком 2008 году но Sun так и не смог довести технологию до ума.

Тем не менее, на последней JavaOne о JavaFX говорилось очень много. Будем надеяться что Oracle железной рукой направит разработчиков в нужное русло и заставит выдать наконец-то рабочий инструмент весто обещаний.

Читают сейчас

Похожие публикации

  • 30 апреля 2013 в 18:18

Быстрый способ создать установщик для Java программы

Использование Google Map в приложении на JavaFX

Автоматизация бизнес-процессов. Использование JavaFX в реальных проектах


AdBlock похитил этот баннер, но баннеры не зубы — отрастут

Комментарии 24

Мне кажется, основной причиной стала масса проблем, порожденных тем, что программировать можно на двух языках сразу. Сейчас поясню мысль:

1. Вопрос первичности. Запуск Java из JavaFX и запуск JavaFX из Java — это два разных запутанных подхода, каждый из которых напоминает конструкцию костылей. Когда все написано только на JFX script (не помню, если честно, как назывался этот декларативный язык, и фигурировало ли его название хоть где-то), таких проблем не возникает, но написать на нем что-то посложнее красивой демки, идущей в архиве с примерами, не так уж и просто.

2. Вопрос многопоточности и управления потоками. Весь код на JFX script выполнялся в одном потоке. Если же мы пытались что-то сделать из другого потока (например, обновить progressbar на JFX из отдельного потока, запущенного из Java-кода), то в зависимости от положения звезд и планет, а также погоды, у нас либо все успешно обновлялось, либо приложение вешалось намертво. Конечно, спасал javafx.lang.FX.deferAction(), но далеко не в 100% случаев. К тому же, мало охотников писать на каждый необходимый метод соответствующую обертку. Нормальную поддержку многопоточности и взаимодействия с Java-кодом, вероятно, так и не получилось сделать. А если судить по фидбэку, который в свое время был на uservoice, этот вопрос стал вопросом жизни и смерти для декларативного языка JFX.

3. Вопрос мнимой силы биндинга. По-моему, сила биндинга переменных превратилась в слабость, т.к. постоянно нужно держать в уме, что куда биндится, и две схемы биндинга (прямую и обратную). Это создавало массу дополнительной бесплатной головной боли.

4. Вопрос эффективности JavaFX API в целом и генерируемого байткода в частности. Если декомпилировать класс, скомпилированный из JFX-кода, можно увидеть, что даже самый простой код приводит к генерации статического класса с цепочкой вызовов, идущих глубоко в недра API JavaFX script, через многочисленные классы-обертки, классы-контроллеры и т.д. Производительности при таком раскладе ожидать не приходится. Gоневоле задумываешься, когда на незамысловатой демке одно ядро не самого старого двухъядерного процессора (JavaFX 1.1 — 2009, Core2Duo T7100 — 2007) целиком отдается под нужды этой самой демки.

Именно поэтому переход на Java логичен, и его нужно только приветствовать. Жаль, конечно, что он произошел слишком поздно.

Естественно, все вышеперечисленное является всего лишь моим ИМХО.

Аккордеон JavaFX с несколькими открытыми стеклами

Возможно ли иметь аккордеон с более чем 1 открытой панелью в JavaFX?

Нет, JavaFX 2.2 Accordion может иметь только одну открытую область за раз.

Я создал запрос расширения (JDK-8090554 StackedTitlePanes control) для функции, которая позволяет вам открывать более одного окна в аккордеоне на время, однако запрос функции в настоящее время не реализован.

В то же время вы можете легко создать подобный элемент управления, создав несколько экземпляров TitledPane и разместив их в VBox.

При необходимости вы можете обернуть VBox , содержащий ваши панели, в ScrollPane, чтобы содержимое всех ваших расширенных панели могут использоваться, если их площадь переполняет доступную область.

У меня были несколько разные требования

  • Аккордеон либо расширяет, либо управляет пространством вида для встроенных представлений
  • Весь вид можно поместить в прокрутку.
  • Каждый ящик полностью расширяется до размера всего представления, если аккордеон является фиксированным размером или он расширяется до размера содержимого, если это не фиксированный вид.

Хотя в моем случае я не смог выполнить все 3. и тест 2., я смог придумать следующее исправление:

1) Используйте ScrollPane с VBox внутри, с TitlesWindows внутри. 2) Убедитесь, что для TitledPanes установлено значение VBox.grow = «SOMETIMES» . 3) Добавьте VBox в качестве последнего элемента и установите VBox.vgrow = «ВСЕГДА» — это подталкивает TitlesPanes до минимального размера. Все остальные предоставили примеры кода, если вы хотите использовать fxml или не хотите использовать Java, просто использование элементов напрямую работает так же (сгенерировано с помощью SceneBuilder):

4) Несмотря на то, что это делает вас уложенными ящиками, которые расширяются/сжимаются независимо друг от друга, это не устраняет проблему, в которой у вас есть поля, которые не изменяются правильно до их содержимого (если, например, у вас есть встроенный просмотр списка как в приведенном выше примере), и поэтому вам теперь придется прокручивать немного, когда осталось много экранной недвижимости. Решение? Требуется немного Java.

Чтобы реализовать это исправление, мы сначала привязываем TitledPane maxHeightProperty() к внешнему VBox heightProperty() :

Мы привязываемся к каждой панели expandedProperty() и динамически связываем и отвязываем prefHeighProperty() :

Если мы показываем, мы просим быть такими же большими, как VBox, если мы не показаны, мы просим их как можно меньше. Преимущество в этом заключается в том, что макет автоматически вычисляет доступную высоту в зависимости от количества отображаемых в настоящее время TitledPanes, что приводит к точному поведению, которое мы хотим.

Лекция 10. GUI. JavaFX¶


Простое приложение¶

Рассмотрим простое приложение JavaFX:

Метод main может отсутствовать (наследуется через Application)



Нормальный шаблон JavaFX-приложения содержит метод main:

Вся его задача: передать управление основному классу приложения с заданными параметрами.



Рассмотрим более сложный пример приложения.

Начало файла: подключение многочисленных классов:

Следующий блок: создание элементов управления

Задаем обработчики нажатий на клавиши (используются безымянные lambda-функции)


Одним из важных перимуществ JavaFX является

использование каскадных таблиц стилей CSS

Рассмотрим пример приложения с кнопками, стиль которых задается в отдельном файле.

Содержимое файла buttonstyles.css:

Можно задавать стили прямо в коде:


Рассмотрим пример использования диаграмм JavaFX:

Java GUI & JavaFX создать простое приложение

28.02.2020, 16:44

Анимация — Java GUI & JavaFX
Есть такой код, который нужно модернизировать и сделать так, чтобы два шарика отталкивались друг от.

С использованием JavaFX необходимо создать Java приложение
Приложение реализующее добавление, редактирование и удаление данных .Предусмотреть возможность.

JAVA GUI & keyPressed
Здравствуйте, можете подсказать, где ошибка. Смысл задачи, увеличивать/уменьшать рисунок по.

Как создать на JavaFX десктопное приложение?
Всем привет! Как создать на JavaFX десктопное приложение, чтобы оно запускалось под управлением.

Как создать GUI с возможностью Drag &b Drop?
Добрый день! я только начинаю осваивать Java. Посоветуйте плиз как создать графический.

JavaFX Tutorial

JavaFX tutorial provides basic and advanced concepts of JavaFX. Our JavaFX tutorial is designed for beginners and professionals.

JavaFX is a Java library that is used to develop Desktop applications as well as Rich Internet Applications (RIA). The applications built in JavaFX, can run on multiple platforms including Web, Mobile and Desktops.

Our JavaFX tutorial includes all topics of JavaFX library such as Fundamentals, 2D Shapes, 3D Shapes, Effects, Animation, Text, Layouts, UI Controls, Transformations, Charts, JavaFX with CSS, JavaFX with Media etc.

What is JavaFX?

JavaFX is a Java library used to develop Desktop applications as well as Rich Internet Applications (RIA). The applications built in JavaFX, can run on multiple platforms including Web, Mobile and Desktops.

JavaFX is intended to replace swing in Java applications as a GUI framework. However, It provides more functionalities than swing. Like Swing, JavaFX also provides its own components and doesn’t depend upon the operating system. It is lightweight and hardware accelerated. It supports various operating systems including Windows, Linux and Mac OS.

History of JavaFX

JavaFX was developed by Chris Oliver. Initially the project was named as Form Follows Functions (F3) . It is intended to provide the richer functionalities for the GUI application development. Later, Sun Micro-systems acquired F3 project as JavaFX in June, 2005.

Sun Micro-systems announces it officially in 2007 at W3 Conference. In October 2008, JavaFX 1.0 was released. In 2009, ORACLE corporation acquires Sun Micro-Systems and released JavaFX 1.2. the latest version of JavaFX is JavaFX 1.8 which was released on 18th March 2014.

Features of JavaFX

Feature Description
Java Library It is a Java library which consists of many classes and interfaces that are written in Java.
FXML FXML is the XML based Declarative mark up language. The coding can be done in FXML to provide the more enhanced GUI to the user.
Scene Builder Scene Builder generates FXML mark-up which can be ported to an IDE.
Web view Web pages can be embedded with JavaFX applications. Web View uses WebKitHTML technology to embed web pages.
Built in UI controls JavaFX contains Built-in components which are not dependent on operating system. The UI component are just enough to develop a full featured application.
CSS like styling JavaFX code can be embedded with the CSS to improve the style of the application. We can enhance the view of our application with the simple knowledge of CSS.
Swing interoperability The JavaFX applications can be embedded with swing code using the Swing Node class. We can update the existing swing application with the powerful features of JavaFX.
Canvas API Canvas API provides the methods for drawing directly in an area of a JavaFX scene.
Rich Set of APIs JavaFX provides a rich set of API’s to develop GUI applications.
Integrated Graphics Library An integrated set of classes are provided to deal with 2D and 3D graphics.
Graphics Pipeline JavaFX graphics are based on Graphics rendered pipeline(prism). It offers smooth graphics which are hardware accelerated.
High Performance Media Engine The media pipeline supports the playback of web multimedia on a low latency. It is based on a Gstreamer Multimedia framework.
Self-contained application deployment model Self Contained application packages have all of the application resources and a private copy of Java and JavaFX Runtime.

JavaFX Index

JavaFX Tutorial

JavaFX 2D Shapes

JavaFX Text

JavaFX Text

JavaFX Transformation

JavaFX Animation

JavaFX 3D Shapes

JavaFX Layouts


JavaFX Charts


Media with JavaFX

JavaFX Event Handling


Before Learning JavaFX, you must have the knowledge of core Java. You must also be familiar with Eclipse or NetBeans. All the examples in this tutorial has been tested on Eclipse IDE.


Our JavaFX tutorial is designed to help beginners and professionals both.


We assure you that you will not find any kind of problem in this tutorial. However, if you find any, you can post into the contact form.

Понравилась статья? Поделиться с друзьями:
Все языки программирования для начинающих