āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā ā š shadcn/directory/1771-technologies/lytenyte/(column)/column-autosizing ā āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
Autosizing can consider header width, cell content width, or both. For
each column, you can define autosizeHeaderFn and autosizeCellFn to
control width calculations. If you omit these, LyteNyte Grid uses a
default text measurement function.
Because LyteNyte Grid emphasizes custom header and cell renderers for highlighting key content, we recommend providing matching autosize functions when using custom renderers to ensure accurate sizing.
Use the api.autosizeColumns method to autosize all columns or a
selected subset.
!demo:Autosizing Api="./demos/column-autosizing"
The autosize method returns an AutosizeResult object with key-value
pairs where keys are column ids and values are the new sizes. It also
supports a "dry run" mode that calculates widths without applying them.
For details, see the API Reference.
Use autosizeHeaderFn on a column to define a custom header autosizing
function. This is helpful when you want headers included in width
calculations.
!demo:Header Autosizing="./demos/column-autosizing-header"
autosizeCellFn controls how LyteNyte Grid calculates optimal cell
width. Each column can define its own function. If you use custom cell
renderers, provide a matching autosizeCellFn for accuracy.
In the example below, we set the base autosize function to autosize
columns to a width of 150px fixed. This makes all the columns take the
same width.
!demo:Cell Autosizing="./demos/column-autosizing-cell"
LyteNyte Grid uses row virtualization for performance. Only visible rows are considered in autosizing. If the viewport is not yet initialized, the grid uses about 50 rows for calculations.
For columns with a known set of possible values, consider an autosize function that returns the maximum width for those values, regardless of the visible rows.
LyteNyte Grid (Core and PRO) exports a measureText helper. Use it to
estimate text width when building custom autosize functions.
ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā ā
āāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāāā