java Vaadin 14时间选择器对齐居中
与vaadin14(.1.19)一起出现的是这次选择器组件:https://vaadin.com/components/vaadin-time-picker/java-examples
这是它的样子(当它是只读的):
我如何让这个时间选择器像这样显示以时间为中心的时间(这是浏览器中手动操作的屏幕截图(将文本对齐:直接在嵌入式输入字段中设置为中心),而不是编程解决方案)
我试图在Java代码中设置text align属性,但没有效果:
TimePicker timepicker = new TimePicker();
timepicker.getElement().getStyle().set("text-align", "center");
我搜索了一个主题变体。但这似乎只适用于文本字段和派生字段:
EmailField emailFeld = new EmailField();
emailFeld.addThemeVariants(TextFieldVariant.LUMO_ALIGN_CENTER);
# 1 楼答案
您需要在
TimePicker
的TextField
值部分的阴影DOM中更改CSS,我们使用主题属性作为附加选择器,以避免对所有文本字段设置主题:通过
@CssImport
注释包含CSS,为文本字段设置主题,并将主题属性设置为日期选择器。主题属性将传播到日期选择器中使用的文本字段:我在this answer中详细解释了它