JavaFX – Reach Internet Application от Sun. Прощай, унылый Swing?

Кирилл Сухов

JavaFX – Reach Internet Application от Sun
Прощай, унылый Swing?

5 декабря 2008 года Компания Sun Microsystems представила финальную версию JavaFX – свою платформу для создания Rich Internet Aplication, ставшую достойным ответом конкурентам.

Если вспомнить историю создания интернет-приложений, придется признать за компанией Sun первенство в создании Rich Internet Application. Первые Java-апплеты продемонстрированы Гослингом при презентации браузера WebRunner в далёком 1994 году. С тех пор прошло много всяких событий, интернет-приложения росли и изменялись, появилась технология Flash, использование клиентских возможностей браузера (Javascript, DOM) вылилось в термин WEB-2, а апплеты как технология, в общем, не сильно изменились. Заняв прочное положение на мобильных устройствах, на десктопах, они так и не получили заметного распространения. Положение осложнилось с появлением таких мощных конкурентных технологий, как Adobe Flex/Air, Microsoft Silverlight.

С другой стороны, имело место недовольство потребителей возможностями средств Java (Swing, Java2D), для разработки графического пользовательского интерфейса. Особенность ситуации была в том, что эти средства вполне позволяли в теории создавать GUI любой сложности и «красивости», но процесс этот никак нельзя было назвать лёгким и эффективным. Возникла необходимость в простом средстве проектирования интерфейсов, которым может быть скриптовый декларативный язык.

Явление JavaFX

Впервые технология была представлена на конференции JavaOne в мае 2007 года. В декабре 2008 года вышла JavaFX 1.0, включающая в себя средства разработки – JavaFX 1.0 SDK, плагин для NetBeans IDE 6.5 и JavaFX 1.0 Production Suite – набор инструментов для экспорта графических объектов в приложения JavaFX. Была представлена также бета-версия эмулятора JavaFX 1.0 Mobile, для разработки JavaFX-приложений для мобильных платформ. JavaFX TV – среда для запуска приложений на телевизионной платформе, планируется к запуску в начале 2010 года.

На настоящий момент (апрель 2009 года) вышла версия JavaFX 1.1, включающая мобильный профайл, позволяющий запускать JavaFX-приложения на мобильных устройствах.

На недавно открытом официальном сайте (JavaFX.com) можно видеть примеры готовых приложений на основе новой технологии, предоставленных с исходным кодом.

JavaFX потихоньку входит в нашу жизнь.

Что это?

Что конкретно представляет собой JavaFX-приложение? Оно вполне может работать как продукт Java web start, но основная его роль, декларируемая Sun – «апплет нового образца», основное отличие которого от обычных апплетов – возможность самостоятельного существования. В самом деле, JavaFX-программа вполне может быть оформлена в качестве обычного апплета, но этот апплет можно вытащить из содержащей его страницы, закрыть последнюю и продолжить работу (Drag-to-Install).

В общем, такой продукт является интернет-приложением, только потому, что через Глобальную сеть происходит доставка его потребителю, а также по причине наличия возможности активного взаимодействия через Интернет с сервером. Ну а в обычной несетевой, ипостаси эти приложения мало чем уступают обычным настольным.

Приложение JavaFX, естественно, использует для работы Java-машину (см. рис 1). Как следствие оно может использовать классы и объекты Java, импортировав соответствующие пакеты.

Рисунок 1. Архитектура платформы JavaFX

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

В общем, такой продукт является интернет-приложением, только потому, что через Глобальную сеть происходит доставка его потребителю, а также по причине наличия возможности активного взаимодействия через Интернет с сервером. Ну а в обычной несетевой, ипостаси эти приложения мало чем уступают обычным настольным.

Впрочем, не особенно хочется превращать обзор в рекламную листовку, лучше давайте попробуем возможности JavaFX на практике.

Начинаем работу

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

Прежде всего на вашей системе должен быть установлен пакет JDK (Java Development Kit) версии 5 или 6 (последняя по многим причинам предпочтительнее). Если это не сделано, скачиваем пакет по адресу http://java.sun.com/javase/downloads/index.jsp и устанавливаем его. Теперь скачиваем и устанавливаем JavaFX SDK (http://java.sun.com/javafx/downloads). Инсталляция не должна вызвать особых вопросов.

Для проверки работоспособности среды в консоли выполним команду javafxc, без параметров:

C:\Sun>javafxc

 

javafxc: no source files Usage: javafxc <options> <source files> use -help for a list of possible options   C:\Sun>

Если результат отличается, в первую очередь следует проверить, добавлен ли путь к JavaFX SDK в переменную окружения PATH.

Теперь напишем нашу первую программу. Создадим файл testfx.fx следующего содержания:

import javafx.stage.*;

import javafx.scene.*;

import javafx.scene.text.*;

import javafx.scene.paint.*;

import javafx.scene.effect.*;

Stage {

title: "Hello FX"

width: 250

height: 80

scene: Scene {

content: Text {

x: 10 y: 30

font: Font { size: 24 }

fill: Color.GREEN

effect: DropShadow{ offsetX: 3 offsetY: 3}

content: "Hello FX!"

}

}

}

Скомпилируем этот класс командой javafxc:

C:\Sun>javafxc testfx.fx

И запустим соответственно командой javafx:

C:\Sun>javafx testfx

Результат можно наблюдать на рис. 2.

Рисунок 2. Здравствуйте

Теперь давайте разберёмся, что мы тут натворили. С командами компиляции и запуска всё ясно – это прямые аналоги утилиты javac и команды java. Первые строчки кода также хорошо знакомы любому Java-программисту – это импорт необходимых классов из соответствующих пакетов.

Далее идёт то, что называется «декларативным синтаксисом». Что это такое? Если очень коротко, то особенность заключается в том, что программа не задаёт пошаговую инструкцию реализации алгоритма работы, а описывает объекты, полученные в виде конечного результата. При этом описываются свойства и поведение объектов, в том числе и интерактивное. Впрочем, об этом далее, в более сложных примерах.

Пока всё просто: объект Stage представляет собой окно приложения с соответствующими свойствами (title, width, height), значения которых определяются в последующих строчках. Далее внутри его описывается объект Stage – своего рода фрейм, содержащий другие объекты. Вернее, в данном случае один визуальный объект – Text, который также снабжен описанием своих свойств (положение, шрифт, цвет). Помимо их описания к тексту применён эффект тени, причём как шрифт, так и эффект также имеют свои описания.

Как видим, тут всё очень просто и интуитивно понятно. Впрочем, давайте попробуем написать маленькое, но действительно полезное приложение. Что нам нехватает в мире ERP-систем и SOA-приложений? Разумеется, красивого калькулятора! Вооружимся описанием языка и вперёд.

Сначала опишем калькулятор с индикатором:

import javafx.stage.*;

import javafx.scene.*;

import javafx.scene.text.*;

import javafx.scene.paint.*;

import javafx.scene.effect.*;

import javafx.scene.shape.*;

Stage {

title: "JavaFX-калькулятор"

width: 300

height: 500

 

scene: Scene {

content:[ Text {

x: 20 y: 60

font: Font { size: 36}

fill: Color.GREEN

effect: DropShadow{ offsetX: 3 offsetY: 6}

content: "2 * 2 = 4"

}

]

 

}

}

Похоже на предыдущий пример. Мы импортировали необходимые классы, создали окно приложения, описали основной фрейм, создали там пока единственный элемент (в терминах JavaFX – нод) – Text. После текста добавим описание кнопки, используя встроенный объект Rectangle:

Rectangle {

fill: Color.SILVER

x: 10

y: 80

width:60

height: 40

arcWidth: 20

arcHeight: 20

}

И надписи на ней:

Text {

x: 35

y: 110

font: Font { size: 24}

fill: Color.GREEN

content: "1"

}

Попробуем скомпилировать и запустить результат приведёнными выше командами, и полюбуемся чудным однокнопочным калькулятором (см. рис. 3).

Рисунок 3. Для калькулятора маловато кнопок

Ну дальше всё просто – описываем одну за другой все остальные кнопки... Что? Объекты? Массивы? Всё так, и хоть мне и платят за количество печатных знаков, я всё-таки программист и не могу не унифицировать процесс. Для начала создадим следующий класс:

class CalcBatton{

var cx: Number;

var cy: Number ;

var ctext: String;

var group= Group{

content: [

Rectangle {

fill: Color.SILVER

x: cx

y: cy

width:60

height: 40

arcWidth: 20

arcHeight: 20

cursor: HAND

effect: DropShadow{ offsetX: 3 offsetY: 6}

},

Text {

x: cx + 25

y: cy + 30

font: Font { size: 24}

fill: Color.GREEN

content: ctext

}]}

}

В данном случае мы объединили в одну группу кнопку и надпись на ней, создав класс, экземплярами которого будут кнопки калькулятора. Переменные класса устанавливают надпись на кнопке и её абсолютное расположение (вообще говоря, в JavaFX присутствуют менеджеры размещения, но для простого приложения с фиксированным числом компонентов можно ограничиться и абсолютным позиционированием.)

Теперь создадим массив кнопок:

def bt1=CalcBatton{ cx: 10, cy: 80,ctext: "1"}

def bt2=CalcBatton{ cx: 80, cy: 80,ctext: "2"}

def bt3=CalcBatton{ cx: 150, cy: 80,ctext: "3"}

 

...

 

def bt9=CalcBatton{ cx: 10, cy: 180,ctext: "9"}

def bt0=CalcBatton{ cx: 80, cy: 180,ctext: "0"}

 

def bt_add=CalcBatton{ cx: 150, cy: 180,ctext: "+"}

def bt_sub= CalcBatton{ cx: 220, cy: 180,ctext: "-"}

def bt_mul=CalcBatton{ cx: 10, cy: 230,ctext: "*"}

def bt_div=CalcBatton{ cx: 80, cy: 230,ctext: "/"}

def bt_res=CalcBatton{ cx: 150, cy: 230,ctext: "="}

def bt_del=CalcBatton{ cx: 220, cy: 230,ctext: "C"}

var buttons=[bt1.group,bt2.group,bt3.group,

bt4.group,bt5.group,bt6.group,

bt7.group,bt8.group,bt9.group,

bt0.group,bt_add.group,bt_sub.group,

bt_mul.group,bt_div.group,bt_res.group,

bt_del.group];

И разместим этот массив на «сцене» приложения:

Stage {

...

scene: Scene {

content:[ Text {

...

},buttons

]}

}

После компиляции должна получиться картинка, сходная с рис. 4.

Рисунок 4. Теперь кнопок достаточно

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

var cont="";

class CalcBatton{

…...................................

effect: DropShadow{ offsetX: 3 offsetY: 6}

content: bind cont

}

 

effect: DropShadow{ offsetX: 3 offsetY: 6}

onMouseClicked: function(evt: MouseEvent):Void {

but="{but}{ctext}";

if({ctext}=="C"){

but="";

}

}

}

Как видно из кода, при нажатии на клавишу <C> происходит очистка индикатора. Конечно, следует также прописать реакцию на нажатие <=>, вызывающее вычисление результата, но это я предоставляю для реализации читателю. Сама по себе задача вполне ординарная. Мы же тут заняты другим – стараемся «сделать красиво». Продолжая действовать в этом направлении, «оживим» кнопки, заставим их нажиматься. Для этого введём ещё два атрибута нашего класса:

var gradx= 3;

var grady= 6;

var group= Group{

Эти переменные будут отвечать за размеры эффекта тени, при изменении которых и создаётся эффект нажатия:

cursor: HAND

effect: DropShadow{ offsetX: bind gradx offsetY: bind grady}

Как видите, мы опять используем связывание. И связываем мы их с типичными действиями пользователя. Пишем в коде объекта Rectangle:

onMousePressed: function(evt: MouseEvent):Void {

gradx=0;

grady=0;

}

 

onMouseReleased: function(evt: MouseEvent):Void {

gradx=3;

grady=6;

}

},

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

import javafx.stage.*;

import javafx.scene.*;

import javafx.scene.text.*;

import javafx.scene.paint.*;

import javafx.scene.effect.*;

import javafx.scene.paint.Color;

import javafx.scene.shape.*;

import javafx.scene.layout.HBox;

import javafx.scene.layout.VBox;

import javafx.scene.Cursor.*;

import javafx.scene.Node.*;

import javafx.scene.input.MouseEvent;

 

class Calc{

// здесь «вычислительная» часть

}

 

def cl= Calc{};

def fil_bt=LinearGradient {

startX: 0.0, startY: 0.0, endX: 0.0, endY: 1.0, proportional: true

stops: [

Stop {offset: 0.0 color: Color.WHITE},

Stop {offset: 1.0 color: Color.SILVER}

]

}

var cont="";

var sum=0;

class CalcBatton{

var cx: Number ;

var cy: Number ;

var ctext: String;

var gradx= 3;

var grady= 6;

var group= Group{

content: [

Rectangle {

fill: fil_bt

x: cx

y: cy

width:60

height: 40

arcWidth: 20

arcHeight: 20

cursor: HAND

effect: DropShadow{ offsetX: bind gradx offsetY: bind grady}

onMouseClicked: function(evt: MouseEvent):Void {

if({ctext}=="C"){

but="";

}

else{

but="{cont}{ctext}";

}

}

onMousePressed: function(evt: MouseEvent):Void {

gradx=0;

grady=0;

}

onMouseReleased:

function(evt: MouseEvent):Void {

gradx=3;

grady=6;

}

},

Text {

x: cx + 25

y: cy + 30

font: Font { size: 24}

fill: Color.GREEN

content: ctext

}]}

 

}

def bt1=CalcBatton{ cx: 10, cy: 80,ctext: "1"}

def bt2=CalcBatton{ cx: 80, cy: 80,ctext: "2"}

def bt3=CalcBatton{ cx: 150, cy: 80,ctext: "3"}

def bt4=CalcBatton{ cx: 220, cy: 80,ctext: "4"}

def bt5=CalcBatton{ cx: 10, cy: 130,ctext: "5"}

def bt6=CalcBatton{ cx: 80, cy: 130,ctext: "6"}

def bt7=CalcBatton{ cx: 150, cy: 130,ctext: "7"}

def bt8=CalcBatton{ cx: 220, cy: 130,ctext: "8"}

def bt9=CalcBatton{ cx: 10, cy: 180,ctext: "9"}

def bt0=CalcBatton{ cx: 80, cy: 180,ctext: "0"}

def bt_add=CalcBatton{ cx: 150, cy: 180,ctext: "+"}

def bt_sub=CalcBatton{ cx: 220, cy: 180,ctext: "-"}

def bt_mul=CalcBatton{ cx: 10, cy: 230,ctext: "*"}

def bt_div=CalcBatton{ cx: 80, cy: 230,ctext: "/"}

def bt_res=CalcBatton{ cx: 150, cy: 230,ctext: "="}

def bt_del=CalcBatton{ cx: 220, cy: 230,ctext: "C"}

var buttons=[bt1.group,bt2.group,bt3.group,

bt4.group,bt5.group,bt6.group,

bt7.group,bt8.group,bt9.group,

bt0.group,bt_add.group,bt_sub.group,

bt_mul.group,bt_div.group,bt_res.group,

bt_del.group];

Stage {

title: "FX Калькулятор"

width: 300

height: 500

scene: Scene {

content:[ Text {

x: 20 y: 60

font: Font { size: 36}

fill: Color.GREEN

effect: DropShadow{ offsetX: 3 offsetY: 6}

content: bind cont

},buttons

]

fill: LinearGradient {

startX: 0.0, startY: 0.0, endX: 0.0, endY: 1.0, proportional: true

stops: [

Stop {offset: 0.0 color: Color.WHITE},

Stop {offset: 1.0 color: Color.LIGHTGREEN}

]

}

}

}

Результат – на рис. 5.

Рисунок 5. Приложение готово и даже работает

Что ещё?

Какие возможности JavaFX остались за рамками этого небольшого примера? Прямо скажу, немало. Начнём с того, что в палитре среды присутствует множество графических примитивов. Это геометрические фигуры (вроде используемого нами Rectangle), градиенты (линейный градиент мы использовали для заливки калькулятора и кнопок), различные графические эффекты. JavaFX позволяет работать с готовыми изображениями, используя их в сценах и применяя к ним различные фотоэффекты, как-то затенение, смещение, размытость, трансформация и так далее, причём применять в любой комбинации.

Средствами JavaFX легко достигается анимация объектов (каюсь, хотел включить эту важную функциональность в наш калькулятор, но вовремя остановился) и встраивается видео. Вот как просто это делается:

Stage {

title: "My Media Player"

scene: Scene{

content: MediaComponent {

mediaSourceURL: mediaUrl

volume: 0.5

visible:true

mediaPlayerAutoPlay: true

}

}

}

Поддерживаются все форматы, которые поддерживает платформа, на которой исполняется приложение, при этом используются «родные» кодеки этой платформы. Если не находится нужного кодека, используется встроенный кроссплатформенный кодек On2 от компании On2 Technologies.

Разумеется, всё вышеперечисленное можно применять в различных комбинациях. Примеры применения с исходным кодом можно найти на сайте технологии JavaFX – http://www.javafx.com/samples.

На рис. 6 показан один из них – вращающийся трёхмерный куб, каждая грань которого работает как видеопроигрыватель, в котором можно открыть отдельный видеофрагмент.

Рисунок 6. В каждой грани независимый видеофрагмент (если хватит оперативки)

Разумеется у средства для создания RIA есть инструменты для построения именно интернет-приложений.

Прежде всего это объект javafx.io.http.HttpRequest, предоставляющий API для асинхронного взаимодействия с HTTP-сервером (да, да, тот самый AJAX). Очень полезным представляется javafx.data.pull.PullParser многопоточный парсер документов, с возможностью задания функции обратного вызова (callback) в качестве параметра.

Пример из руководства:

var total;

var title;

def parser = PullParser {

documentType: PullParser.XML;

input: anInputStreamThatContainsXML;

onEvent: function(event: Event) {

if (event.type == PullParser.START_ELEMENT) {

if (event.qname.name == "ResultSet" and event.level == 0) {

total = event.getAttributeValue(QName{name:"totalResultsAvailable"});

}

} else if (event.type == PullParser.END_ELEMENT) {

if (event.qname.name == "Title" and event.level == 2) {

title = event.text;

}

}

}

}

parser.parse();

parser.input.close();

println("results: {total}, title: {title}");

Предусмотрена также работа с RESTFul Web Services (технология Representational State Transfer), встроенные парсеры XML и JSON, интеграция с JavaScript и технологией LiveConnect.

Среда разработки

Такой пример, как наш калькулятор, вполне можно написать в простом текстовом редакторе, но современный процесс разработки (несмотря на мнение отдельных гиков) требует удобной и эффективной IDE, с возможностью отладки, профайлинга, рефакторинга и управления проектами, а также желательно с интеграцией с системой контроля версий и многим другим. И тут хорошие новости для программистов, привыкших работать в среде NetBeans. Начиная с версии 6.5 при установке соответствующего плагина теперь можно работать с JavaFX-проектами с неменьшей эффективностью, что и с Java, используя дизайнер форм и прочие инструменты IDE. Приверженцы другой популярной среды разработки, Eclipse, не остались обижены, плагин для работы с JavaFX доступен по адресу http://kenai.com/projects/eplugin.

Впрочем, это всё для программистов, для дизайнеров же подготовлен набор инструментов под общим названием JavaFX Production Suite. Это плагины для пакетов Adobe Photoshop и Adobe Illustrator, позволяющие сохранять многослойные приложения в формате JavaFX (Save as JavaFX). Он включает инструмент JavaFX Graphics Viewer, который позволяет использовать графику без компиляции в байт-код, и SVG Converter, позволяющий сохранять графику в формате JavaFX.

После знакомства с возможностями JavaFX, естественно, встаёт вопрос: каковы её перспективы? Какое место она может занять в быстро меняющемся ИТ-мире? Сейчас на этот вопрос, наверное, никто ответить не может. Но в целом платформа, имеющая все ключевые средства для построения RIA, с возможностью использования накопленных Java-наработок и уже сейчас имеющая вполне современные средства разработки, выглядит очень многообещающе.

Приложение

JavaFX Script – краткий обзор

В небольшом приложении я попытаюсь дать краткий обзор языку JavaFX Script, ровно до такой степени, чтобы читатель разобрался с кодом примера.

Следует сразу оговориться, что JavaFX Script – это не Java, и вообще он имеет с Java довольно мало общего. Вторая оговорка – пусть вас не смущает слово Script в его названии. Он не является языком сценариев в том смысле, в котором им является, например JavaScript, ничего общего он не имеет с такими интерпретируемыми «скриптовыми» языками, как PHP или Ruby. Прежде всего это декларативный язык. На практике это обозначает, что для построения приложения мы не описываем объекты и их методы, а определяем объекты сцены, определяем их атрибуты (в том числе поведение, реакцию на события). Но всё по порядку, сначала основы синтаксиса.

Основные типы данных

JavaFX имеет статическую типизацию – тип переменной (они задаются с помощью ключевого слова var) определяется при её инициализации:

var name;

var age;

name="John";

age=35

Константы задаются с помощью ключевого слова def. Правила наименований переменных и констант схожи с языком Java.

Это же касается и наименований функций. Сами они задаются так:

function addTwo(a:Number):Number{

return a+2;

}

 

println(addTwo(4));

Как видим, разительное отличие синтаксиса Java, заключается в указании типа возвращаемого значения не до, а после объявления функции. То же и с её аргументами. Возможно, причины такого синтаксического финта кроются в том, что продукт создавался с оглядкой на Adobe Flex. Впрочем, бог с ними, с грязными домыслами.

В языке присутствуют встроенные типы данных – String, Number, Integer, Boolean и Duration, которые также являются и объектами типов.

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

var name='john';

println(«Hello {name}!»);

Типы Integer Number, предназначены для представления целочисленных значений и числа с плавающей точкой соответственно. Boolean, как несложно догадаться, может принимать значения true или false. Он используется в управляющих конструкциях (if, else), которые имеют традиционный для Java синтаксис.

Тип Duration используется для представления временных отрезков, например:

Имеется и знакомый по Java «пустой» тип Void (регистр – не опечатка), впрочем, при объявлении функции, не возвращающей значение, его можно опустить.

Для перечисляемых данных предусмотрен тип последовательности (sequencesy), обладающий необходимыми методами:

var colors: String[] = ["Green","Red","Gray"];

insert "Black" into colors;

insert "Blue" after colors[1];

 

// теперь последовательность такая:

// ["Green","Red","Blue","Gray",

// "Black"];

 

delete "Gray" from colors;

delete colors[2];

 

// теперь:

// ["Green","Red",Black"];

 

var nums = [1..100];

В последнем случае генерируется последовательность из целых чисел, от 1 до 100.

Классы и объекты

Классы в JavaFX определяются следующим образом:

class myObject{

var name: String;

var city: String;

var myRectangle: Rectangle;

 

function print_name() {

println("Name: {name}");

}

Вопросы тут может вызвать только тип данных Rectangle. Это один из многочисленных встроенных классов JavaXF, просмотреть его свойства и методы можно в документации по API JavaXF (http://java.sun.com/javafx/1.1/docs/api).

Объекты описываются так:

def myObj = myObject {

name: "Vasya";

city: "Moscow";

number:5;

}

def myRectangle = Rectangle {

fill: Color.GREEN

width:60

height: 40

}

Первый из вышеприведённых объектов является экземпляром произвольного пользовательского класса, второй – встроенного класса Rectangle. Вполне допустимы и композиции объектов:

def myObj=myObject {

name: "Vasya";

city: "Moscow";

number: "95050";

myRectangle: Rectangle {

fill: Color.GREEN

width:60

height: 40

}

}

Обращение к свойствам и методам объекта происходит посредством точечной нотации:

println( myObj.myRectangle.x);

println( myObj.=print_name());

Такие необходимые элементы ООП, как наследование и модификаторы доступа, также наличествуют.

Связывание данных

Ключевой элемент языка JavaFX Script – возможность динамической привязки данных (data binding). Это возможность связать любой параметр с динамически изменяющейся переменной.

Лучше всего применение связывания видно на примере:

var side= 15;

 

Scene {

content: [

SwingSlider {

minimum: 0

maximum: 50

value: side radius with inverse

vertical: false

},

Rectangle {

fill: Color.GREEN

 

width: bind side

height: bund side*2

}

]

}

В данном случае объект SwingSlider (стандартный скрол бар) определяет значение переменной side, с которой, в свою очередь, связаны размеры сторон объекта Rectangle (прямоугольник). Таким образом, пользователь может менять размеры фигуры, перемещая указатель скрола.

Ещё один интересный механизм JavaFX – триггеры, то есть конструкции, представляющие собой блоки кода, исполняемые по какому-либо событию. Пример того, как привязать блок кода к значению переменной:

var User = "Misha" on replace oldValue {

println("Пользователь изменился");

println("был: {oldValue}");

println("стал: {User}");

};

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

На сцене

В основе любой программы на JavaFX находится объект Stage, представляющий собой древовидную структуру, содержащую в себе другие объекты приложения. Каждый узел такой системы, представляющий собой наследника от класса javafx.scene.Node, может также содержать в себе объекты.

Класс Node является полноценным контейнером, характеризующийся размерами, системой координат и реагирующим на события мыши. Объекты, от него образованные, можно трансформировать, объединять в группы, применять к ним (как к отдельным, так и к группам) различные действия или графические эффекты.

Доступ к содержимому «Сцены» производится через объект Scene, для добавления на нее необходимых объектов, следует импортировать соответствующие классы и описать объекты и их поведение внутри Scene.

Дальше – смотрите пример, приведённый в статье.

Подробные уроки по языку JavaFX Script, на русском языке доступны на портале разработчиков Sun. По адресу http://developers.sun.ru/documents/javafx/FXTutorials.

1. Официальный сайт JavaFX – http://javafx.com.
2. Материалы по JavaFX на сайте российских разработчиков Sun Microsystems – http://developers.sun.ru/javafx.
3. Русскоязычная wiki по JavaFX – http://ru.jfx.wikia.com/wiki.