fineui/demo/js/core/abstract/demo.collection_view.js

import { shortcut, Widget, createWidget } from "@/core";

@shortcut()
export class Func extends Widget {
    static xtype = "demo.collection_view";

    props = { baseCls: "demo-func" };

    render() {
        const items = [];
        const cellCount = 100;
        for (let i = 0; i < cellCount; i++) {
            items[i] = {
                type: "bi.label",
                text: i,
            };
        }
        const grid = createWidget({
            type: "bi.collection_view",
            width: 400,
            height: 300,
            items,
            cellSizeAndPositionGetter(index) {
                return {
                    x: (index % 10) * 50,
                    y: Math.floor(index / 10) * 50,
                    width: 50,
                    height: 50,
                };
            },
        });
        createWidget({
            type: "bi.absolute",
            element: this,
            items: [
                {
                    el: grid,
                    left: 10,
                    right: 10,
                    top: 10,
                    bottom: 10,
                }
            ],
        });
    }
}