使用 Grails 2.3.9 和 Vaadin 插件 7.3.9
class MyUI extends UI {
@Override
protected void init(VaadinRequest vaadinRequest) {
VerticalLayout layout = new VerticalLayout()
layout.setMargin(true)
SignInForm signInForm = new SignInForm()
layout.addComponent(signInForm)
layout.setComponentAlignment(signInForm, Alignment.MIDDLE_CENTER)
layout.setSizeFull()
setContent(layout)
}
}
自定义组件
class SignInForm extends CustomComponent {
Panel p = new Panel()
public SignInForm() {
p.setSizeUndefined()
Label label = new Label("test");
p.setContent(label);
setCompositionRoot(p);
}
}
它是这样的:
如何让自定义组件水平居中?
最佳答案
将自定义组件放置在垂直布局中。将自定义组件的大小设置为未定义。设置垂直布局的大小并居中对齐。
public void init(VaadinRequest request) {
VerticalLayout vLayout = new VerticalLayout();
SignInComponent signInComponent = new SignInComponent();
vLayout.addComponent(signInComponent);
vLayout.setSizeFull();
vLayout.setComponentAlignment(signInComponent, Alignment.MIDDLE_CENTER);
this.setContent(vLayout);
class SignInComponent extends CustomComponent {
public SignInComponent() {
Panel p = new Panel();
p.setSizeUndefined();
Label label = new Label("test");
p.setContent(label);
this.setSizeUndefined();
this.setCompositionRoot(p);
}
}
或
使用面板而不是自定义布局:
public void init(VaadinRequest request) {
VerticalLayout vLayout = new VerticalLayout();
SignInPanel signInPanel = new SignInPanel();
vLayout.addComponent(signInPanel);
vLayout.setSizeFull();
vLayout.setComponentAlignment(signInPanel, Alignment.MIDDLE_CENTER);
this.setContent(vLayout);
}
class SignInPanel extends Panel {
public SignInPanel() {
this.setSizeUndefined();
Label label = new Label("test");
this.setContent(label);
}
}
两者的代码输出:
关于Vaadin - 中心自定义组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28559028/