checkbox

ДЕМОНСТРАЦИЯ

Флажок (checkbox) - это компонент с двумя состояниями: выбранный или невыбранный.

XML-элемент

checkbox

Java-класс

JmixCheckbox

Атрибуты

id - alignSelf - ariaLabel - ariaLabelledBy - autofocus - classNames - clickShortcut - colspan - css - dataContainer - enabled - focusShortcut - height - indeterminate - label - maxHeight - maxWidth - minHeight - minWidth - property - readOnly - tabIndex - value - visible - width

Обработчики

AttachEvent - BlurEvent - ClickEvent - ComponentValueChangeEvent - DetachEvent - FocusEvent

Элементы

tooltip

Основы

Пример использования checkbox:

<checkbox label="Create new document"
          value="true"/>
check box basics

Привязка данных

ДЕМОНСТРАЦИЯ

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

Следующий пример создает checkbox, связанный с данными. Атрибут сущности должен быть типа Boolean.

<data>
    <instance id="userDc"
              class="com.company.onboarding.entity.User"> (1)
        <fetchPlan extends="_base"/> (2)
        <loader/>
    </instance>
</data>
<layout>
    <checkbox id="checkbox"
              label="Active"
              dataContainer="userDc"
              property="active"/> (3)
</layout>
1 InstanceContainer для сущности User.
2 Встроенный план выборки экземпляра сущности, находящегося в контейнере.
3 Привязка компонента к контейнеру данных и свойству. Атрибут dataContainer содержит ссылку на контейнер данных userDc, а атрибут property ссылается на атрибут сущности active.

Состояния

checkbox может находиться в нескольких состояниях, определяющих его внешний вид и функциональность.

Enabled

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

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

checkbox enable disable
XML code 
<checkbox label="The enabled checkbox"
          value="true"
          enabled="true"/>
<checkbox label="The disabled checkbox"
          enabled="false"
          value="true"/>

Read-only

Атрибут readOnly управляет возможностью взаимодействия пользователя с компонентом checkbox. Если он установлен в true, флажок становится доступным только для чтения, то есть пользователь не может изменить его состояние.

XML code 
<checkbox label="The readOnly checkbox"
          value="true"
          readOnly="true"/>
<checkbox label="The editable checkbox"
          readOnly="false"
          value="true"/>

Indeterminate

Атрибут indeterminate управляет тем, находится ли флажок в неопределенном состоянии. Это состояние представляет собой ситуацию, когда флажок не полностью отмечен и не полностью снят.

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

В соответствии со стандартом HTML5, это влияет только на внешний вид, а не на значение "checked".
checkbox indeterminate
XML code 
<checkbox label="With indeterminate state = true"
          value="false"
          indeterminate="true"/>
<checkbox label="With indeterminate state = false"
          indeterminate="false"
          value="false"/>

События клика мыши

Событие com.vaadin.flow.component.ClickEvent генерируется при клике на компонент. Этот обработчик должен указать один из трех следующих субъектов, чтобы определить количество кликов, связанных с событием.

  • click - запускает событие при каждом клике на компонент.

  • singleClick - запускает событие после таймаута, чтобы убедиться, что это не двойной щелчок.

  • doubleClick - запускает событие, когда по компоненту происходит двойной щелчок.

Например:

Событие com.vaadin.flow.component.ClickEvent отправляется, когда пользователь кликает по флажку.

@Autowired
private Notifications notifications;

@Subscribe(id = "checkbox", subject = "clickListener")
public void onCheckboxClick(final ClickEvent<JmixCheckbox> event) {
    if (event.getSource().getValue()){
        notifications.show("Set");
    } else {
        notifications.show("Not set");
    }
}

Атрибуты

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

Ниже приведены атрибуты, специфичные для checkbox:

Название

Описание

Значение по умолчанию

enabled

Устанавливает компонент явно отключенным или включенным. Смотрите Состояние Enabled.

true

indeterminate

Устанавливает неопределенное состояние флажка. Смотрите Состояние Indeterminate.

false

readOnly

Указывает, находится ли компонент checkbox в режиме только для чтения. Смотрите Состояние Read-Only.

false

Обработчики

В Jmix существует множество общих обработчиков, которые конфигурируются одинаково для всех компонентов.

Ниже приведены обработчики, специфичные для checkbox.

Чтобы сгенерировать заглушку обработчика в Jmix Studio, используйте вкладку Handlers панели инспектора Jmix UI, или команду Generate Handler, доступную на верхней панели контроллера экрана и через меню Code → Generate (Alt+Insert / Cmd+N).

Название

Описание

ClickEvent

Событие com.vaadin.flow.component.ClickEvent генерируется при клике на компонент. Смотрите События клика мыши.

Смотрите также

Смотрите документацию Vaadin для получения дополнительной информации.