Demo.Func = BI.inherit(BI.Widget, {
    props: {
        baseCls: "demo-func"
    },

    _createItems: function () {
        var items = BI.map(BI.range(1000), function (i) {
            return {
                type: "demo.virtual_group_item",
                value: i,
                key: i + 1
            };
        });
        return items;
    },

    render: function () {
        var self = this;
        var buttonGroupItems = self._createItems();
        var virtualGroupItems = self._createItems();
        return {
            type: "bi.vertical",
            vgap: 20,
            items: [{
                type: "bi.label",
                cls: "layout-bg5",
                height: 50,
                text: "共1000个元素,演示button_group和virtual_group每次删除第一个元素,打开控制台看输出"
            }, {
                type: "bi.button_group",
                width: 500,
                height: 300,
                ref: function () {
                    self.buttonGroup = this;
                },
                chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
                layouts: [{
                    type: "bi.vertical"
                }],
                items: this._createItems()
            }, {
                type: "bi.button",
                text: "演示button_group的刷新",
                handler: function () {
                    buttonGroupItems.shift();
                    self.buttonGroup.populate(BI.deepClone(buttonGroupItems));
                }
            }, {
                type: "bi.virtual_group",
                width: 500,
                height: 300,
                ref: function () {
                    self.virtualGroup = this;
                },
                chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
                layouts: [{
                    type: "bi.vertical"
                }],
                items: this._createItems()
            }, {
                type: "bi.button",
                text: "演示virtual_group的刷新",
                handler: function () {
                    virtualGroupItems.shift();
                    self.virtualGroup.populate(BI.deepClone(virtualGroupItems));
                }
            }]

        };
    }
});
BI.shortcut("demo.virtual_group", Demo.Func);

Demo.Item = BI.inherit(BI.Widget, {
    props: {
        baseCls: "demo-item",
        height: 30
    },

    render: function () {
        var self = this, o = this.options;
        return {
            type: "bi.label",
            ref: function () {
                self.label = this;
            },
            height: this.options.height,
            text: "key:" + o.key + ",随机数" + BI.UUID()
        };
    },

    shouldUpdate: function (nextProps) {
        var o = this.options;
        return o.type !== nextProps.type || o.key !== nextProps.key || o.value !== nextProps.value;
    },

    update: function (item) {
        this.label.setText(item.value);
        console.log("更新了一项");
        return true;// 返回是不是更新成功
    },

    created: function () {
        console.log("创建了一项");
    },

    destroyed: function () {
        console.log("删除了一项");
    }
});
BI.shortcut("demo.virtual_group_item", Demo.Item);