javascript - ExtJS 4 菜单颜色选择器 (Ext.menu.ColorPicker) 中的 CustomColors 颜色

Question

感谢您查看此消息!

我的一个使用 Ext.menu.ColorPicker 的项目遇到问题 我不知道为什么(我希望这可能非常简单)，但选择器根本不假设我需要它具有的自定义颜色!

这是一些示例代码，说明了我的问题:

Ext.onReady(function () {
var customColors = [
        'fa7166', 'cf2424', 'a01a1a', '7e3838', 'ca7609', 'f88015', 'eda12a', 'd5b816',
        'e281ca', 'bf53a4', '9d3283', '7a0f60', '542382', '7742a9', '8763ca', 'b586e2',
        '7399f9', '4e79e6', '2951b9', '133897', '1a5173', '1a699c', '3694b7', '64b9d9',
        'a8c67b', '83ad47', '2e8f0c', '176413', '0f4c30', '386651', '3ea987', '7bc3b5'
    ];

var picker = Ext.create('Ext.picker.Color');

picker.colors[0] = '556677';
picker.colors = customColors;

    var btn = Ext.create('Ext.Button', {
        menu: {
            xtype: 'colormenu',
            picker: picker,
            value: 'FFFFFF',
            handler: function (obj, rgb) {
                Ext.Msg.alert('border-color: ' + rgb.toString());
            } // handler
        }, // menu
        renderTo: Ext.getBody(),
        text: 'Menu Button'
    }).showMenu();
}); // onReady()

行:

picker.colors[0] = '556677';

工作完美，你可以看到，我可以更改数组的元素 0。

但这行:

picker.colors = customColors;

应该将整个新颜色数组分配给选择器，我不知道为什么，但它似乎不起作用。

我需要组件具有所有这些颜色，32 种颜色，而不是选择器上默认的 40 种默认颜色!

我应该怎么做？
提前致谢...

Answer 1

您是否使用了错误的小部件组合，您正在嵌入 Ext.menu.ColorPicker在另一个里面Ext.menu.Menu ，而不是你应该按原样使用 Ext.menu.ColorPicker ，然后你就可以开始了，就像这样

var customColors = ['fa7166', 'cf2424', ...];
var pickerMenu = Ext.create('Ext.menu.ColorPicker');
pickerMenu.picker.colors = customColors;

var btn = Ext.create('Ext.Button', {
    menu: pickerMenu, // menu
    renderTo: Ext.getBody(),
    text: 'Menu Button'
}).showMenu();

Here's适用于自定义颜色列表的代码的修改版本。希望能帮助解决您的问题。