zng/
grid.rs

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

pub use zng_wgt_grid::{node, AutoGrowFnArgs, AutoGrowMode, Cell, Column, Grid, Row};

/// Cell widget and properties.
pub mod cell {
    pub use zng_wgt_grid::cell::{at, column, column_span, row, row_span, span, Cell, CellInfo, AT_AUTO};
}

/// Column widget and properties.
pub mod column {
    pub use zng_wgt_grid::column::{get_index, get_index_len, get_rev_index, is_even, is_first, is_last, is_odd, Column};
}

/// Row widget and properties.
pub mod row {
    pub use zng_wgt_grid::row::{get_index, get_index_len, get_rev_index, is_even, is_first, is_last, is_odd, Row};
}