qooxdoo - 自定义listitem部件选择

问题描述：

我做了自定义listitem视图（基于http://news.qooxdoo.org/tutorial-part-4-2-custom-widgets-4）。qooxdoo - 自定义listitem部件选择

我对此列表上的选择项目有问题。总是选择第一个元素（不管列表中的哪个元素将点击）。

我该怎么办才能解决我的问题？

这里是我的列表项控件：

 
qx.Class.define("project.MyView", { 
    extend : qx.ui.core.Widget, 
    include : [qx.ui.form.MModelProperty], 

    construct : function() { 
     this.base(arguments); 

     var layout = new qx.ui.layout.Grid(4, 2); 
     layout.setColumnFlex(1, 1); 
     this._setLayout(layout); 

     this._createChildControl("icon"); 
     this._createChildControl("date"); 
     this._createChildControl("description"); 
    }, 

    properties : { 
     appearance : { 
      refine : true, 
      init : "listitem" 
     }, 

     icon : { 
      check : "String", 
      apply : "_applyIcon", 
      nullable : true 
     }, 

     date : { 
      check : "String", 
      apply : "_applyDate", 
      nullable : true 
     }, 

     description : { 
      check : "String", 
      apply : "_applyDescription", 
      nullable : true 
     } 
    }, 

    members : { 

     _createChildControlImpl : function(id) { 
      var control; 

      switch (id) { 
      case "icon": 
       control = new qx.ui.basic.Image(this.getIcon()); 
       control.setAnonymous(true); 
       this._add(control, { 
        row : 0, 
        column : 0, 
        rowSpan : 2 
       }); 
       break; 

      case "date": 
       control = new qx.ui.basic.Label(this.getDate()); 
       control.setAnonymous(true); 
       this._add(control, { 
        row : 0, 
        column : 2 
       }); 
       break; 

      case "description": 
       control = new qx.ui.basic.Label(this.getDescription()); 
       control.setAnonymous(true); 
       control.setRich(true); 
       this._add(control, { 
        row : 0, 
        column : 1 
       }); 
       break; 
      } 

      return control || this.base(arguments, id); 
     }, 

     _applyIcon : function(value, old) { 
      var icon = this.getChildControl("icon"); 
      icon.setSource(value); 
     }, 

     _applyDescription : function(value, old) { 
      var description = this.getChildControl("description"); 
      description.setValue(value); 
     }, 

     _applyDate : function(value, old) { 
      var date = this.getChildControl("date"); 
      date.setValue(value); 
     } 

    }, 

    destruct : function() { 

    } 

});

...这里我如何使用它：

 
this.list = new qx.ui.form.List(); 
this.listController = new qx.data.controller.List(null, this.list); 
this.listController.setDelegate({ 
    createItem : function() { 
     return new project.MyView(); 
    }, 

    bindItem : function(controller, item, id) { 
     controller.bindProperty("description", "description", null,item, id); 
     controller.bindProperty("icon", "icon", null, item, id); 
     controller.bindProperty("date", "date", null, item, id); 
    }, 

    configureItem : function(item) { 
     item.getChildControl("icon").setWidth(48); 
     item.getChildControl("icon").setHeight(48); 
     item.getChildControl("icon").setScale(true); 
     item.setMinHeight(52); 
    } 
});

答

貌似问题是在bindItem功能。只要你提供你自己的bindItem函数，所有默认的绑定属性就不再受约束了。这意味着标签，图标和模型不再同步。我没有尝试过你的代码，但我想用一个简单的模型绑定，问题就会消失。

controller.bindProperty("", "model", null, item, id);

这是必要的情况下你想要的东西在你的模型属性，并与不同的，在你选择的例子。这条代码只是将整个对象用作模型，在大多数情况下这是一个好主意。

最好，马丁

谢谢 - 这是有效的。 – tchudyk 2010-12-21 18:41:44

qooxdoo - 自定义listitem部件选择

相关推荐