checkBox 复选框

在线示例

checkBox 是一个拥有两个状态的组件：选中或者未选中。

  • XML 元素：checkBox

  • Java 类：JmixCheckbox

基本用法

默认情况下，Jmix Studio 在创建实体详情界面时，为实体的 Boolean 类型的属性生成 checkBox。

check box basics 
<data>
    <instance id="userDc"
          class="com.company.onboarding.entity.User">
    <fetchPlan extends="_base"/>
    <loader/>
    </instance>
</data>
<layout>
    <checkbox label="Active"
              dataContainer="userDc"
              property="active" value="false"
              id="checkbox"/>
</layout>

在 checkBox 元素中，dataContainer 属性引用 userDc 数据容器，property 属性指定实体的 active 属性。

XML 属性

id - ariaLabel - autofocus - classNames - colspan - dataContainer - enabled - height - indeterminate - label - maxHeight - maxWidth - minHeight - minWidth - property - readOnly - requiredIndicatorVisible - tabIndex - value - visible - width

ariaLabel

MDN

设置 checkBox 的辅助功能标签。

indeterminate

Vaadin

设置 checkBox 的不确定状态。

根据 HTML5 标准，这个状态只是影响组件的外观，并不会影响组件的值。

value

定义 checkBox 的值，可以是 true 或 false。

事件和处理器

AttachEvent - BlurEvent - ClickEvent - ComponentValueChangeEvent - DetachEvent - FocusEvent

在 Jmix Studio 生成处理器桩代码时，可以使用 Jmix UI 组件面板的 Handlers 标签页或者视图类顶部面板的 Generate Handler 添加，也可以通过 Code → Generate 菜单（Alt+Insert / Cmd+N）生成。

ClickEvent

当用户点击 checkBox 时，发送 com.vaadin.flow.component.ClickEvent 事件。

@Autowired
private Notifications notifications;

@Subscribe("checkbox")
public void onCheckboxClick(final ClickEvent<Checkbox> event) {
    if (Boolean.TRUE.equals(event.getSource().getValue())) {
        notifications.create("set")
                .show();
    } else {
        notifications.create("not set")
                .show();
    }
}

XML 内部元素

tooltip

参考

Vaadin 文档