将样式设置为 GWT ComboBox 项目

Question

我需要更改一些组合框元素的颜色。我读了这个主题： Set style to GWT ListBox items

但是不一样。因为当我尝试实现这个时：

SelectElement selectElement = SelectElement.as(combo.getElement());
         NodeList<OptionElement> options = selectElement.getOptions();

         for (int i = 0; i < options.getLength(); i++) {
              options.getItem(i).getStyle().setColor("#FF0000");
         }

在第一行编译returns错误：java.lang.AssertionError: null

我开始认为没有改变颜色的可能性，还是我错了？

结果应该是这样的沃尔沃选项：http://bustas.lrytas.lt/nekilnojamasis-turtas/geda-vilniaus-merams-ne-vienas-neissprendzia-opiausios-bedos.htm

Answer 1

我相信您可以使用 .setClassName("my_css_class") 来设置 SelectElement 的样式。

将 css 添加到您的 html 中，如下所示：

.styled-select select {
   background: transparent;
   width: 268px;
   padding: 5px;
   font-size: 16px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 34px;
   }

您还会发现很多关于使用 css 设置样式的信息。

如果您正在使用任何其他 GWT 小部件，即 ListBox，您可以使用 .setStyleName("my_class_name")。您也可以将 GWT ListBox 包装到 SelectElement 并设置样式。

ListBox listBox = ListBox.wrap(mySelectElement);
listBox.setStyleName("my_css_class");

更多信息请看这里：https://bavotasan.com/2011/style-select-box-using-only-css/

编辑：一些使用 css 样式下拉框的优秀示例：How to style a <select> dropdown with CSS only without JavaScript?

编辑 2 下拉框的自定义样式

为列表框或下拉框的单个项目设置样式。

CSS:

    .selectbox {
        border: 3px;
        border-radius: 5px;
        padding: 4px;
        background-color: #44f;
    }
    .optioncss {
        background-color: #888;
    }

HTML select 项目例如

    <select id="selectbox" class="selectbox">
        <option>Option 1</option>
        <option>Option 2</option>
        <option>Option 3</option>
        <option>Option 4</option>
    </select>

重新设计项目样式的 GWT 客户端代码

    ListBox select = ListBox.wrap(RootPanel.get("selectbox").getElement());
    SelectElement elem = (SelectElement)select.getElement().cast();
    elem.getOptions().getItem(0).setDisabled(true);
    elem.getOptions().getItem(1).setClassName("optioncss")

将样式设置为 GWT ComboBox 项目

Set style to GWT ComboBox items

java

gwt

combobox