TagPicker

TagPicker - 标签选择器 支持将选中的值作为标签展示。该组件由 ComboBoxValuesPicker 组成,因此可以有下拉列表,并支持操作。另外还可以用 TagField 处理标签。

tag picker

组件的 XML 名称:tagPicker

数据感知的 TagPicker

如需创建关联至数据的 TagPicker,可以用 XML 的 dataContainerpropertyoptionsContainer 属性。下面例子中,我们从所有职员中选出某个特定部门的职员作为展示列表:

@JmixEntity
@Table(name = "UIEX1_DEPARTMENT")
@Entity(name = "uiex1_Department")
public class Department {
    @InstanceName
    @Column(name = "NAME")
    private String name;

    @JoinColumn(name = "PARENT_DEPT_ID")
    @ManyToOne(fetch = FetchType.LAZY)
    private Department parentDept;

    @JoinColumn(name = "MANAGER_ID")
    @ManyToOne(fetch = FetchType.LAZY)
    private Employee manager;

    @OneToMany(mappedBy = "department")
    private List<Employee> employee;
}
@JmixEntity
@Table(name = "UIEX1_EMPLOYEE")
@Entity(name = "uiex1_Employee")
public class Employee {
    @InstanceName
    @Column(name = "NAME")
    private String name;

    @OneToMany(mappedBy = "employee")
    private List<EquipmentLine> equipment;

    @JoinColumn(name = "DEPARTMENT_ID")
    @ManyToOne(fetch = FetchType.LAZY)
    private Department department;
}
<data>
    <instance id="departmentDc"
              class="ui.ex1.entity.Department">
        <fetchPlan extends="_base">
            <property name="employee" fetchPlan="_base"/>
        </fetchPlan>
        <loader/>
    </instance>
    <collection id="employeesDc"
                class="ui.ex1.entity.Employee">
        <fetchPlan extends="_base"/>
        <loader id="employeesDl">
            <query>
                <![CDATA[select e from uiex1_Employee e]]>
            </query>
        </loader>
    </collection>
</data>
<layout>
    <tagPicker id="employeesTagPicker"
               property="employee"
               dataContainer="departmentDc"
               optionsContainer="employeesDc">
        <actions>
            <action id="lookup" type="tag_lookup"/>
            <action id="clear" type="value_clear"/>
        </actions>
    </tagPicker>
</layout>

上面的例子中,界面为具有 employee 属性的 Department 实体定义了 departmentDc 数据容器。dataContainer 属性指向数据容器。employeesDc 中的 Employee 实体集合设置为 optionsContainer 属性,其值展示在下拉列表中。

除了 dataContainerproperty 属性外,还可以使用 metaClass 属性,支持直接用实体类型字段无需数据容器:

<data>
    <collection id="employeesDc"
                class="ui.ex1.entity.Employee">
        <fetchPlan extends="_base"/>
        <loader id="employeesDl">
            <query>
                <![CDATA[select e from uiex1_Employee e]]>
            </query>
        </loader>
    </collection>
</data>
<layout>
    <tagPicker id="employeesPicker"
               metaClass="uiex1_Employee"
               optionsContainer="employeesDc">
        <actions>
            <action id="lookup" type="tag_lookup"/>
            <action id="clear" type="value_clear"/>
        </actions>
    </tagPicker>
</layout>

编程式设置选项

如果组件未与任何实体属性关联,可以在界面控制器中编程式设置下拉列表选项值:

<layout>
    <tagPicker id="dataTypeTagPicker"
               inlineTags="true"/>
</layout>
@Autowired
private TagPicker<String> dataTypeTagPicker;

@Subscribe
public void onInit(InitEvent event) {
    dataTypeTagPicker.setOptionsList(Arrays.asList(
            "Headphones", "Keyboard", "Mouse")
    );
}
tag picker 1

属性

tagPosition

设置标签相对于控件本身的位置,支持下列值:

  • BOTTOM - 默认值

    tag picker bottom
  • TOP

    tag picker top
  • LEFT

    tag picker left
  • RIGHT

    tag picker right

inlineTags

定义是否在一行显示多个标签(inlineTags=true):

tag picker inline

纵向排列(inlineTags=false,默认值)。

tag picker bottom

hideSelectedOptions

如果用户已经选择了某个选项,此时若 hideSelectedOptions=false,则该选项可继续用于选取。默认,hideSelectedOptions=true

操作

由于 TagPickerValuesPicker 的子类,因此可以使用其父类的所有 操作

注意,如果没有定义任何操作,则默认会加载 ValueClearAction

TagPickerAction

该操作仅在 TagPicker 具有数据容器或 metaClass 属性时有效。该操作与 LookupAction 类似,但使用的是 append 值,而非 set 值。

该操作的另一个功能是 multiSelect,支持多选,默认 multiSelect=true

事件和处理器

如需使用 Jmix Studio 生成处理器的桩代码,需要在界面 XML 描述或者 Component Hierarchy 面板选中该组件,然后用 Component Inspector 面板的 Handlers 标签页生成。

或者可以使用界面控制器顶部面板的 Generate Handler 按钮。

TagPicker 有下列事件和处理器,参阅 TagField

TagCaptionProvider

参阅 TagCaptionProvider

TagClickListener

参阅 TagClickListener

TagComparator

参阅 TagComparator

TagStyleProvider

参阅 TagStyleProvider

Validator

参阅 Validator

TagPicker XML 元素