@egjs/infinitegrid
Version:
A module used to arrange elements including content infinitely according to grid type. With this module, you can implement various grids composed of different card elements whose sizes vary. It guarantees performance by maintaining the number of DOMs the
39 lines (38 loc) • 2.48 kB
TypeScript
import { PackingGridOptions } from "@egjs/grid";
import InfiniteGrid from "../InfiniteGrid";
import { InfiniteGridOptions } from "../types";
/**
* @typedef
* @extends InfiniteGridOptions
* @extends Grid.PackingGrid.PackingGridOptions
*/
export interface PackingInfiniteGridOptions extends PackingGridOptions, InfiniteGridOptions {
}
/**
* The PackingInfiniteGrid is a grid that shows the important items bigger without sacrificing the weight of the items.
* Rows and columns are separated so that items are dynamically placed within the horizontal and vertical space rather than arranged in an orderly fashion.
* If `sizeWeight` is higher than `ratioWeight`, the size of items is preserved as much as possible.
* Conversely, if `ratioWeight` is higher than `sizeWeight`, the ratio of items is preserved as much as possible.
* @ko PackingInfiniteGrid는 아이템의 본래 크기에 따른 비중을 해치지 않으면서 중요한 카드는 더 크게 보여 주는 레이아웃이다.
* 행과 열이 구분돼 아이템을 정돈되게 배치하는 대신 가로세로 일정 공간 내에서 동적으로 아이템을 배치한다.
* `sizeWeight`가 `ratioWeight`보다 높으면 아이템들의 size가 최대한 보존이 된다.
* 반대로 `ratioWeight`가 `sizeWeight`보다 높으면 아이템들의 비율이 최대한 보존이 된다.
* @param {HTMLElement | string} container - A base element for a module <ko>모듈을 적용할 기준 엘리먼트</ko>
* @param {PackingInfiniteGridOptions} options - The option object of the PackingInfiniteGrid module <ko>PackingInfiniteGrid 모듈의 옵션 객체</ko>
*/
export declare class PackingInfiniteGrid extends InfiniteGrid<PackingInfiniteGridOptions> {
static propertyTypes: {
aspectRatio: import("@egjs/grid").PROPERTY_TYPE;
sizeWeight: import("@egjs/grid").PROPERTY_TYPE;
ratioWeight: import("@egjs/grid").PROPERTY_TYPE;
weightPriority: import("@egjs/grid").PROPERTY_TYPE;
gap: import("@egjs/grid").PROPERTY_TYPE;
defaultDirection: import("@egjs/grid").PROPERTY_TYPE;
renderOnPropertyChange: import("@egjs/grid").PROPERTY_TYPE;
preserveUIOnDestroy: import("@egjs/grid").PROPERTY_TYPE;
useFit: import("@egjs/grid").PROPERTY_TYPE;
outlineSize: import("@egjs/grid").PROPERTY_TYPE;
outlineLength: import("@egjs/grid").PROPERTY_TYPE;
};
static defaultOptions: Required<PackingInfiniteGridOptions>;
}