如何在Sencha GXT中实现颜色选择器字段？

Question

颜色选择器字段下拉列表：

在点击“更多颜色”时，还需要提供添加自定义颜色的功能，就像在MS Paint中一样。任何开箱即用的解决方案也是受欢迎的。就我在SenchaGXT中检查而言，我无法找到正确的实现。

Answer 1

我能够使用我自己对本机组件进行的少量编辑来创建此功能。我使用了一个拆分按钮并将颜色菜单附加到它上面，使其像一个颜色选择器。

    SplitButton colorPicker = new SplitButton();
    final ColorMenu colorMenu = new ColorMenu();

    colorMenu.getPalette().addValueChangeHandler(new ValueChangeHandler<String>(){

        public void onValueChange(ValueChangeEvent<String> event){
            String color = event.getValue();
            System.out.println("Color value is "+color);
            StyleInjector.inject(".CustomColor1 > div > div { background-color: "+color+" !important; border-color: #c4c5c5 !important;} ");
            colorMenu.hide();
        }
    });

    colorPicker.setMenu(colorMenu);
    colorPicker.setHeight(20);
    colorPicker.setWidth(150);
    StyleInjector.inject(".CustomColor1 > div {background:none !important; background-image:none !important; background-color: #FFFFFF !important; border-color: #c4c5c5 !important; border-width: 1px !important;} ");
    colorPicker.setStyleName("CustomColor1");

我得到了这样的想要的输出。

所以，我已经实现了我想要的目标。

快乐的编码！