zng/
grid.rs

1#![cfg(feature = "grid")]
2
3//! Grid layout widgets.
4//!
5//! The [`Grid!`](struct@Grid) layout widget that defines a grid using column and row widgets and then size and position
6//! cell widgets into this grid.
7//!
8//! The example below defines a 3x3 grid that demonstrates different length units.
9//!
10//! ```
11//! use zng::prelude::*;
12//!
13//! # fn example() {
14//! let length_color = [
15//!     (Length::Default, colors::RED), // default (auto)
16//!     (200.dip(), colors::GREEN),     // exact
17//!     (1.lft(), colors::BLUE),        // leftover
18//! ];
19//!
20//! # let _ =
21//! Grid! {
22//!     columns = length_color.iter().map(|(length, color)| {
23//!         grid::Column! {
24//!             width = length.clone();
25//!             widget::background_color = color.with_alpha(10.pct());
26//!         }
27//!     });
28//!
29//!     rows = length_color.iter().map(|(length, color)| {
30//!         grid::Row! {
31//!             height = length.clone();
32//!             widget::background_color = color.with_alpha(10.pct());
33//!         }
34//!     });
35//!
36//!     cells = (0..3).flat_map(|col| {
37//!         (0..3usize).map(move |row| {
38//!             Text! {
39//!                 grid::cell::at = (col, row);
40//!                 txt = formatx!("({col}, {row})");
41//!
42//!                 txt_align = Align::CENTER;
43//!                 layout::padding = 10;
44//!                 widget::border = 1, colors::AZURE.transparent();
45//!                 when *#gesture::is_hovered {
46//!                     widget::border = 1, colors::AZURE;
47//!                 }
48//!             }
49//!         })
50//!     });
51//! };
52//! # ; }
53//! ```
54//!
55//! The grid can also auto-grow rows or columns and auto-position cells, the following example
56//! defines a 3x6 grid that auto-grows rows (by default) and generates custom row widgets that
57//! have an alternating background color.
58//!
59//! ```
60//! use zng::prelude::*;
61//! # fn example() {
62//!
63//! # let _ =
64//! Grid! {
65//!     columns = ui_vec![grid::Column!(1.lft()), grid::Column!(2.lft()), grid::Column!(1.lft())];
66//!     auto_grow_fn = wgt_fn!(|_| grid::Row! {
67//!         when *#is_odd {
68//!             widget::background_color = colors::BLACK.with_alpha(10.pct());
69//!         }
70//!     });
71//!
72//!     cells = (0..6).flat_map(|row| {
73//!         (0..3usize).map(move |col| {
74//!             Text! {
75//!                 grid::cell::at = grid::cell::AT_AUTO;
76//!                 txt = formatx!("({col}, {row})");
77//!
78//!                 txt_align = Align::CENTER;
79//!                 layout::padding = 10;
80//!                 widget::border = 1, colors::AZURE.transparent();
81//!                 when *#gesture::is_hovered {
82//!                     widget::border = 1, colors::AZURE;
83//!                 }
84//!             }
85//!         })
86//!     });
87//! }
88//! # ; }
89//! ```
90//!
91//! # Full API
92//!
93//! See [`zng_wgt_grid`] for the full widget API.
94
95pub use zng_wgt_grid::{AutoGrowFnArgs, AutoGrowMode, Cell, Column, Grid, Row, node};
96
97/// Cell widget and properties.
98pub mod cell {
99    pub use zng_wgt_grid::cell::{AT_AUTO, Cell, CellInfo, at, column, column_span, row, row_span, span};
100}
101
102/// Column widget and properties.
103pub mod column {
104    pub use zng_wgt_grid::column::{Column, get_index, get_index_len, get_rev_index, is_even, is_first, is_last, is_odd};
105}
106
107/// Row widget and properties.
108pub mod row {
109    pub use zng_wgt_grid::row::{Row, get_index, get_index_len, get_rev_index, is_even, is_first, is_last, is_odd};
110}
zng/grid.rs

zng/
grid.rs
