Button Sencha Touch：动态按钮背景

我们使用DataView来显示一系列按钮。数据来自商店，其中的每个模型都包含按钮的背景色。我可以更改按钮的文本，但如何根据模型的值更改背景颜色

这是ButtonData模型：

Ext.define('Sencha.model.ButtonData', {
extend: 'Ext.data.Model',

config: {
    fields: [
         {name: 'text', type: 'auto'},
         {name: 'color', type: 'auto'}
           ]
       }
});

基于这个例子 我有一个带有此配置的数据项：

config : {  
      dataMap: {  
          getButton : { setText: 'text'}, // works!

 //problem is here: how do I set the background color based on the 'color' 
 // member form the 'ButtonData' model? 
                 },

    button: { 
      ui: 'plain' 
        }

}

因此，问题是如何根据“ButtonData”模型中的“color”成员设置背景色

Thx

---

Maarten

按钮小部件中没有颜色属性，因为按钮的颜色是一种合成效果，包括去饱和、暗化、渐变。。。所以你不能只在一个地方改变颜色

推荐的选项是从标准主题开始创建自己的主题，然后为按钮创建不同的主题UI。可以在主题中添加这样的行：

// you can add as many as you want.
@include sencha-button-ui('color1', #FF0000, 'glossy');
@include sencha-button-ui('color2', #00FF00, 'glossy');

查看sencha touch主题的themes/stylesheets/sencha touch/default/widgets/_buttons.scss文件中的更多选项

然后，您可以根据您的模型更改按钮上的ui属性。此链接有助于启动并运行您自己的主题：

使用您自己的主题的其他优点是更容易接触css，您可以优化css文件的大小，删除不需要的部分，等等。

尝试类似的方法

config : {  
  dataMap: {  
      getButton : { 
         setText: 'text',
         setButton: {}
      }
  }
}

---

然后在dataview中使用的组件中实现setButton函数。你也可以考虑在那里有一个函数，并完成所有的工作。

最后我们使用了一个类似的方法：我们从按钮中派生出一个类，并给它添加了一个设置颜色函数来改变颜色。谢谢你的回答。