Пакет javafx.scene.control

Элементы управления пользовательским интерфейсом JavaFX (UI-элементы управления или просто элементы управления) — это специализированные узлы в графическом дереве JavaFX, специально предназначенные для повторного использования в различных контекстах приложений. Они разработаны для высокой визуальной настраиваемости дизайнерами и разработчиками. Они разработаны для эффективной работы с системами компоновки. Примерами таких элементов являются Button, Label, ListView и TextField.

Поскольку элементы управления являются Nodes в графическом дереве, они могут свободно комбинироваться с Groups, Images, Media, Text и basic geometric shapes. Хотя создание новых UI-элементов управления не является тривиальной задачей, их использование и стилизация очень просты, особенно для веб-разработчиков.

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

Архитектура

Элементы управления следуют классической модели MVC. Control является «моделью». Она содержит состояние и функции, которые манипулируют этим состоянием. Сам класс Control не знает, как он отображается или как происходит взаимодействие с пользователем. Эти задачи делегируются Skin («представление»), который может внутренне разделить функциональность представления и контроллера на отдельные классы, хотя в настоящее время в публичном API нет «контроллера».

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

Control

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

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

Skin элемента управления может быть изменен в любое время. Это пометит элемент управления как нуждающийся в перекомпоновке, так как изменение Skin, вероятно, изменило предпочтительный размер элемента управления. Если Skin не указан в момент создания элемента управления, для всех встроенных элементов управления будет предоставлен по умолчанию skin на основе CSS.

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

focusTraversable переопределяется в Control как true по умолчанию, в то время как в Node он по умолчанию false. Элементы управления, которые по умолчанию не должны быть фокусируемыми (например, Label), переопределяют это значение на false.

Функции getMinWidth, getMinHeight, getPrefWidth, getPrefHeight, getMaxWidth и getMaxHeight напрямую делегируются Skin. Метод baselineOffset делегируется узлу Skin. Не рекомендуется подклассам изменять эти делегирования.

Стилизация элементов управления

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

Самый простой и очень мощный метод стилизации встроенных элементов управления — использование CSS. Обратите внимание, что в этом релизе данное описание CSS применяется только к скинам по умолчанию, предоставляемым для встроенных элементов управления. В последующих выпусках это будет доступно для любых пользовательских элементов управления сторонних разработчиков, которые хотят воспользоваться этими возможностями CSS.

Каждый из скинов по умолчанию для встроенных элементов управления состоит из нескольких индивидуально стилизуемых областей или регионов. Это очень похоже на HTML-страницу, которая состоит из <div> элементов, а затем стилизуется с помощью CSS. Каждый отдельный регион может быть нарисован с фоном, границами, изображениями, отступами, отступами и так далее. Поддержка CSS в JavaFX включает возможность наличия нескольких фонов и границ и вывода цветов. Эти возможности делают очень простым изменение внешнего вида элементов управления в JavaFX с помощью CSS.

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

Как и все другие узлы в графическом дереве, элементы управления могут быть стилизованы с помощью внешнего файла стилей или путем прямого указания стиля на элементе управления. Хотя для примеров проще выразить и понять, указав стиль непосредственно на узле, рекомендуется использовать внешний файл стилей и использовать styleClass или id элемента управления, как вы бы использовали «класс» или id HTML-элемента в HTML CSS.

Каждый UI-элемент управления указывает styleClass, который может быть использован для стилизации элементов управления из внешнего файла стилей. Например, элементу управления Button присваивается CSS-класс «кнопка». Имена CSS-классов разделяются дефисом, а не в camelCase, в противном случае они точно такие же. Например, Button — «кнопка», RadioButton — «radio-button», Tooltip — «tooltip» и т. д.

В документации к классу каждого элемента управления определены регионы скинов по умолчанию, которые можно стилизовать. Для получения дополнительной информации о возможностях CSS, предоставляемых JavaFX, см. Руководство по справке CSS.