guy
7 years ago
16 changed files with 427 additions and 73 deletions
@ -0,0 +1,22 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.list_view", |
||||
el: { |
||||
type: "bi.left" |
||||
}, |
||||
items: BI.map(Demo.CONSTANTS.ITEMS, function (i, item) { |
||||
return BI.extend({}, item, { |
||||
type: "bi.label", |
||||
width: 200, |
||||
height: 200, |
||||
text: (i + 1) + "." + item.text, |
||||
}); |
||||
}) |
||||
} |
||||
} |
||||
}); |
||||
BI.shortcut("demo.list_view", Demo.Func); |
||||
@ -0,0 +1,110 @@
|
||||
/** |
||||
* 表示当前对象 |
||||
* |
||||
* Created by GUY on 2017/5/23. |
||||
* @class BI.ListView |
||||
* @extends BI.Widget |
||||
*/ |
||||
BI.ListView = BI.inherit(BI.Widget, { |
||||
props: function () { |
||||
return { |
||||
baseCls: "bi-list-view", |
||||
overscanHeight: 100, |
||||
blockSize: 10, |
||||
scrollTop: 0, |
||||
el: {}, |
||||
items: [] |
||||
}; |
||||
}, |
||||
|
||||
init: function () { |
||||
var self = this; |
||||
this.renderedIndex = -1; |
||||
this.cache = {}; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this, o = this.options; |
||||
return { |
||||
type: "bi.vertical", |
||||
items: [BI.extend({ |
||||
type: "bi.vertical", |
||||
scrolly: false, |
||||
ref: function () { |
||||
self.container = this; |
||||
} |
||||
}, o.el)], |
||||
element: this |
||||
} |
||||
}, |
||||
|
||||
mounted: function () { |
||||
var self = this, o = this.options; |
||||
this._populate(); |
||||
this.element.scroll(function (e) { |
||||
o.scrollTop = self.element.scrollTop(); |
||||
self._calculateBlocksToRender(); |
||||
}); |
||||
BI.ResizeDetector.addResizeListener(this, function () { |
||||
self._calculateBlocksToRender(); |
||||
}); |
||||
}, |
||||
|
||||
_renderMoreIf: function () { |
||||
var self = this, o = this.options; |
||||
var height = this.element.height(); |
||||
var minContentHeight = o.scrollTop + height + o.overscanHeight; |
||||
var index = (this.cache[this.renderedIndex] && (this.cache[this.renderedIndex].index + o.blockSize)) || 0, |
||||
cnt = this.renderedIndex + 1; |
||||
var lastHeight; |
||||
var getElementHeight = function () { |
||||
return self.container.element.height(); |
||||
}; |
||||
while ((lastHeight = getElementHeight()) < minContentHeight && index < o.items.length) { |
||||
var items = o.items.slice(index, index + o.blockSize); |
||||
this.container.addItems(items); |
||||
var addedHeight = getElementHeight() - lastHeight; |
||||
this.cache[cnt] = { |
||||
index: index, |
||||
scrollTop: lastHeight, |
||||
height: addedHeight |
||||
}; |
||||
this.renderedIndex = cnt; |
||||
cnt++; |
||||
index += o.blockSize; |
||||
} |
||||
}, |
||||
|
||||
_calculateBlocksToRender: function () { |
||||
var o = this.options; |
||||
this._renderMoreIf(); |
||||
}, |
||||
|
||||
_populate: function (items) { |
||||
var o = this.options; |
||||
if (items && this.options.items !== items) { |
||||
this.options.items = items; |
||||
} |
||||
this._calculateBlocksToRender(); |
||||
this.element.scrollTop(o.scrollTop); |
||||
}, |
||||
|
||||
restore: function () { |
||||
this.renderedIndex = -1; |
||||
this.container.empty(); |
||||
this.cache = {}; |
||||
}, |
||||
|
||||
populate: function (items) { |
||||
if (items && this.options.items !== items) { |
||||
this.restore(); |
||||
} |
||||
this._populate(); |
||||
}, |
||||
|
||||
destroyed: function () { |
||||
this.restore(); |
||||
} |
||||
}); |
||||
BI.shortcut('bi.list_view', BI.ListView); |
||||
|
||||
Loading…
Reference in new issue