pub fn lazy_vertical_grid() -> LazyVerticalGridBuilderExpand description
§lazy_vertical_grid
A vertically scrolling grid that only renders items visible in the viewport.
§Usage
Display tiled content such as photo galleries or dashboards.
§Parameters
modifier- optional modifier for the scroll container.scroll_smoothing- fraction of the remaining distance kept per 60Hz frame while animating a scroll step; defaults to the scrollable default.scrollbar_behavior- visibility behavior of the scrollbars.scrollbar_track_color- optional scrollbar track color override.scrollbar_thumb_color- optional scrollbar thumb color override.scrollbar_thumb_hover_color- optional scrollbar thumb hover color override.scrollbar_layout- whether scrollbars are overlaid or laid out alongside content.columns- grid cell definition for columns.main_axis_spacing- spacing between rows.cross_axis_spacing- spacing between columns.cross_axis_alignment- how columns are arranged when extra horizontal space is available.item_alignment- alignment of items within each cell.overscan- number of extra rows instantiated before and after the viewport.estimated_item_size- estimated main-axis size for each row.content_padding- symmetric padding applied around the grid content.max_viewport_main- optional maximum viewport length reported back to parents.controller- optional external controller for scroll position and cache.- item declarations are appended through builder methods like
itemanditems.
§Examples
use tessera_components::{
lazy_grid::{GridCells, lazy_vertical_grid},
text::text,
theme::material_theme,
};
use tessera_components::modifier::{ModifierExt as _, SemanticsArgs};
use tessera_ui::{Modifier, tessera};
#[tessera]
fn demo() {
material_theme().child(|| {
lazy_vertical_grid()
.columns(GridCells::fixed(2))
.overscan(0)
.items(4, move |i| {
text(format!("Tile {i}")).modifier(
Modifier::new().semantics(SemanticsArgs {
test_tag: Some(format!("tile-{i}")), ..Default::default()
})
);
});
});
}
let snapshot = tessera_ui::testing::layout_test(demo).run();
for index in 0..4 {
snapshot.node(&format!("tile-{index}")).exists();
}