Skip to main content

grid_layout

Function grid_layout 

Source
pub fn grid_layout(
    id: impl Into<ElementId>,
    state: &Entity<GridLayoutState>,
    cx: &App,
) -> GridLayout
Expand description

Create a GridLayout wearing this design system: the theme’s medium spacing between items, its move motion, a dashed drop placeholder, a resize grip in each resizable item’s corner and a raised dragged item.

While the grid is editable — its items can be moved or resized — the selected item carries a ring in the primary color, so an editor shows which item its settings apply to. While the keyboard drives the grid the focus ring takes its place, never both. A read-only grid marks no selection.

Every part can still be overridden on the returned builder — .gap_4() for more room, say.

ⓘ
grid_layout("dashboard", &state, cx)
    .item(GridItem::new("revenue").rounded(cx.theme().radius_lg).child(revenue_card))