Skip to content

Commit

Permalink
add more main axis alignments (#141)
Browse files Browse the repository at this point in the history
  • Loading branch information
Uriopass authored Jan 25, 2024
1 parent 7750ad6 commit 7295362
Show file tree
Hide file tree
Showing 3 changed files with 50 additions and 8 deletions.
15 changes: 12 additions & 3 deletions crates/yakui-core/src/types.rs
Original file line number Diff line number Diff line change
Expand Up @@ -59,9 +59,18 @@ pub enum MainAxisAlignment {
///
/// For a top-down list, this is the bottom of the container.
End,
// SpaceAround,
// SpaceBetween,
// SpaceEvenly,

/// Spread the items evenly where the gap at the start and end of the container
/// is half the size of the gap between each adjacent item.
SpaceAround,

/// Spread the items evenly with no gap at the start and the end of the container.
/// If there is only one item, it will be at the start.
SpaceBetween,

/// Spread the items evenly where the gap at the start and end of the container
/// is the same size as the gap between each adjacent item.
SpaceEvenly,
}

/// Defines alignment for items within a container's main axis when there is space left.
Expand Down
40 changes: 35 additions & 5 deletions crates/yakui-widgets/src/widgets/list.rs
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ yakui::row(|| {
#[non_exhaustive]
pub struct List {
pub direction: Direction,
/// Added space at the end of each item.
pub item_spacing: f32,
pub main_axis_size: MainAxisSize,
pub main_axis_alignment: MainAxisAlignment,
Expand Down Expand Up @@ -224,12 +225,41 @@ impl Widget for ListWidget {
}

// Finally, position all children based on the sizes calculated above.
let mut next_main = match self.props.main_axis_alignment {
MainAxisAlignment::Start => 0.0,
MainAxisAlignment::Center => (main_axis_size - total_main_axis_size) / 2.0,
MainAxisAlignment::End => main_axis_size - total_main_axis_size,
let (leading_space, mut between_space) = match self.props.main_axis_alignment {
MainAxisAlignment::Start => (0.0, 0.0),
MainAxisAlignment::Center => ((main_axis_size - total_main_axis_size) / 2.0, 0.0),
MainAxisAlignment::End => (main_axis_size - total_main_axis_size, 0.0),
MainAxisAlignment::SpaceAround => {
// avoid division by zero
if node.children.is_empty() {
(0.0, 0.0)
} else {
let between_space =
(main_axis_size - total_main_axis_size) / node.children.len() as f32;
(between_space * 0.5, between_space)
}
}
MainAxisAlignment::SpaceBetween => {
if node.children.len() <= 1 {
// We follow CSS spec and Flutter behavior (as the Flutter doc isn't explicit)
// of putting the first child at the start when there is only one
(0.0, 0.0)
} else {
let between_space = (main_axis_size - total_main_axis_size)
/ (node.children.len() as f32 - 1.0);
(0.0, between_space)
}
}
MainAxisAlignment::SpaceEvenly => {
let between_space =
(main_axis_size - total_main_axis_size) / (node.children.len() as f32 + 1.0);
(between_space, between_space)
}
other => unimplemented!("MainAxisAlignment::{other:?}"),
};
between_space += self.props.item_spacing;

let mut next_main = leading_space;

for &child_index in &node.children {
let child = ctx.dom.get(child_index).unwrap();
Expand All @@ -251,7 +281,7 @@ impl Widget for ListWidget {
child_layout.rect.set_pos(direction.vec2(next_main, cross));

next_main += child_main;
next_main += self.props.item_spacing;
next_main += between_space;
}

container_size
Expand Down
3 changes: 3 additions & 0 deletions crates/yakui/examples/main_alignment.rs
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@ pub fn run(state: &mut ExampleState) {
MainAxisAlignment::Start,
MainAxisAlignment::Center,
MainAxisAlignment::End,
MainAxisAlignment::SpaceBetween,
MainAxisAlignment::SpaceAround,
MainAxisAlignment::SpaceEvenly,
];

let index = (state.time.floor() as usize) % alignments.len();
Expand Down

0 comments on commit 7295362

Please sign in to comment.