Vaadin输入字段带有内联图标按钮，用于帮助/信息，验证和输入助手

Question

我需要在Vaadin 8（或更高版本）中找到一个可靠的方法，将图标按钮添加到字段，文本区域甚至复选框和可能的标签。

是否已经有一些我可以利用的内置支持？我注意到，例如Vaadin如何显示组件错误，并在字段旁边显示一个红色感叹号 - 该机制是否可以以某种方式访问​​和扩展？

你有没有实现类似的东西？您能否就如何实现这一目标分享一些总体战略建议？

理想情况下，这些图标会显示在字段内，但我可以将它们显示在输入旁边，只要它不会完全破坏页面布局。

这些将用于显示：

• 弹出帮助的帮助按钮
• 显示验证信息的验证按钮（警告或错误）
• 帮助选择输入的输入辅助按钮（例如，弹出日历或其他实体选择对话框）
• 清除输入的清除按钮

基本上我希望像日历图标一样使用Vaadin为DateField实现，除了我需要几个按钮，我需要能够控制它们（它们应该显示在右边）：

Answer 1

在您的问题中，您说“......图标按钮字段，文字区域......”。

对于字段，最好使用com.vaadin.ui.CustomField代替Composite或CustomComponent。

Answer 2

我决定使用Composite或CustomComponent创建自定义组件。

自定义组件的根目录是HorizontalLayout，我将所需的按钮放在输入字段旁边。

这种方法还允许我包装Label，ComboBox，CheckBox，DateField，PasswordField等。

如果我决定添加其他标记，例如脏/修改标记或必需的输入标记，它也可以扩展。