Vaadin单选按钮,水平而不是堆叠垂直

Question

我想在1行中显示我的单选按钮,例如:

◎选项1◉选项2

但是对于Vaadin,我无法做到这一点似乎如下,

◎选项1

◉选项2

这是我的代码:

final List<String> options = Arrays.asList(new String[] {
                "hebele", "hubele"});

        final OptionGroup group = new OptionGroup("", options);

        group.setNullSelectionAllowed(false); // user can not 'unselect'
        group.select("hubele"); // select this by default

我怎么能改变这个？

Answer 1

使用Vaadin 7.3,Valo主题支持水平OptionGroup而无需编写自定义样式:

OptionGroup group = new OptionGroup("", options);
group.addStyleName(ValoTheme.OPTIONGROUP_HORIZONTAL);

Answer 2

正如The Book of Vaadin中所解释的，您必须定义一个主题来设置您自己的style.css文件。

然后您可以覆盖要内联显示的选项的默认样式，如下所示：

.v-app .v-select-optiongroup .v-select-option {
    display:inline;
}