1//! A representation of [CSS layout properties](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) in Rust, used for flexbox layout
2
3use crate::geometry::{Rect, Size};
4
5/// How [`Nodes`](crate::node::Node) are aligned relative to the cross axis
6///
7/// The default behavior is [`AlignItems::Stretch`].
8///
9/// [Specification](https://www.w3.org/TR/css-flexbox-1/#align-items-property)
10#[derive(Copy, Clone, PartialEq, Eq, Debug)]
11#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
12pub enum AlignItems {
13 /// Items are packed toward the start of the cross axis
14 FlexStart,
15 /// Items are packed toward the end of the cross axis
16 FlexEnd,
17 /// Items are packed along the center of the cross axis
18 Center,
19 /// Items are aligned such as their baselines align
20 Baseline,
21 /// Stretch to fill the container
22 Stretch,
23}
24
25impl Default for AlignItems {
26 fn default() -> Self {
27 Self::Stretch
28 }
29}
30
31/// Overrides the inherited [`AlignItems`] behavior for this node.
32///
33/// The behavior of any child nodes will be controlled by this node's [`AlignItems`] value.
34///
35/// The default behavior is [`AlignSelf::Auto`].
36///
37/// [Specification](https://www.w3.org/TR/css-flexbox-1/#align-items-property)
38#[derive(Copy, Clone, PartialEq, Eq, Debug)]
39#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
40pub enum AlignSelf {
41 /// Inherits the [`AlignItems`] behavior of the parent
42 Auto,
43 /// Items are packed toward the start of the cross axis
44 FlexStart,
45 /// Items are packed toward the end of the cross axis
46 FlexEnd,
47 /// Items are packed along the center of the cross axis
48 Center,
49 /// Items are aligned such as their baselines align
50 Baseline,
51 /// Distribute items evenly, but stretch them to fill the container
52 Stretch,
53}
54
55impl Default for AlignSelf {
56 fn default() -> Self {
57 Self::Auto
58 }
59}
60
61/// Sets the distribution of space between and around content items along the cross-axis
62///
63/// The default value is [`AlignContent::Stretch`].
64///
65/// [Specification](https://www.w3.org/TR/css-flexbox-1/#align-content-property)
66#[derive(Copy, Clone, PartialEq, Eq, Debug)]
67#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
68pub enum AlignContent {
69 /// Items are packed toward the start of the cross axis
70 FlexStart,
71 /// Items are packed toward the end of the cross axis
72 FlexEnd,
73 /// Items are packed along the center of the cross axis
74 Center,
75 /// Distribute items evenly, but stretch them to fill the container
76 Stretch,
77 /// Distribute items evenly, such that the first and last item are aligned with the edges
78 SpaceBetween,
79 /// Distribute items evenly,
80 /// such that the space between items is the same as the space between the first and last item and the edges
81 SpaceAround,
82}
83
84impl Default for AlignContent {
85 fn default() -> Self {
86 Self::Stretch
87 }
88}
89
90/// Sets the layout used for the children of this node
91///
92/// [`Display::Flex`] is the default value.
93#[derive(Copy, Clone, PartialEq, Eq, Debug)]
94#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
95pub enum Display {
96 /// The children will follow the flexbox layout algorithm
97 Flex,
98 /// The children will not be laid out, and will follow absolute positioning
99 None,
100}
101
102impl Default for Display {
103 fn default() -> Self {
104 Self::Flex
105 }
106}
107
108/// The direction of the flexbox layout main axis.
109///
110/// There are always two perpendicular layout axes: main (or primary) and cross (or secondary).
111/// Adding items will cause them to be positioned adjacent to each other along the main axis.
112/// By varying this value throughout your tree, you can create complex axis-aligned layouts.
113///
114/// Items are always aligned relative to the cross axis, and justified relative to the main axis.
115///
116/// The default behavior is [`FlexDirection::Row`].
117///
118/// [Specification](https://www.w3.org/TR/css-flexbox-1/#flex-direction-property)
119#[derive(Copy, Clone, PartialEq, Eq, Debug)]
120#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
121pub enum FlexDirection {
122 /// Defines +x as the main axis
123 ///
124 /// Items will be added from left to right in a row.
125 Row,
126 /// Defines +y as the main axis
127 ///
128 /// Items will be added from top to bottom in a column.
129 Column,
130 /// Defines -x as the main axis
131 ///
132 /// Items will be added from right to left in a row.
133 RowReverse,
134 /// Defines -y as the main axis
135 ///
136 /// Items will be added from bottom to top in a column.
137 ColumnReverse,
138}
139
140impl Default for FlexDirection {
141 fn default() -> Self {
142 Self::Row
143 }
144}
145
146impl FlexDirection {
147 #[inline]
148 /// Is the direction [`FlexDirection::Row`] or [`FlexDirection::RowReverse`]?
149 pub(crate) fn is_row(self) -> bool {
150 matches!(self, Self::Row | Self::RowReverse)
151 }
152
153 #[inline]
154 /// Is the direction [`FlexDirection::Column`] or [`FlexDirection::ColumnReverse`]?
155 pub(crate) fn is_column(self) -> bool {
156 matches!(self, Self::Column | Self::ColumnReverse)
157 }
158
159 #[inline]
160 /// Is the direction [`FlexDirection::RowReverse`] or [`FlexDirection::ColumnReverse`]?
161 pub(crate) fn is_reverse(self) -> bool {
162 matches!(self, Self::RowReverse | Self::ColumnReverse)
163 }
164}
165
166/// Sets the distribution of space between and around content items along the main-axis
167///
168/// The default value is [`JustifyContent::FlexStart`].
169///
170/// [Specification](https://www.w3.org/TR/css-flexbox-1/#justify-content-property)
171#[derive(Copy, Clone, PartialEq, Eq, Debug)]
172#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
173pub enum JustifyContent {
174 /// Items are packed toward the start of the main axis
175 FlexStart,
176 /// Items are packed toward the end of the main axis
177 FlexEnd,
178 /// Items are packed along the center of the main axis
179 Center,
180 /// Distribute items evenly, such that the first and last item are aligned with the edges
181 SpaceBetween,
182 /// Distribute items evenly,
183 /// such that the space between items is twice same as the space between the first and last item and the edges
184 SpaceAround,
185 /// Distribute items evenly,
186 /// such that the space between items is the same as the space between the first and last item and the edges
187 SpaceEvenly,
188}
189
190impl Default for JustifyContent {
191 fn default() -> Self {
192 Self::FlexStart
193 }
194}
195
196/// The positioning strategy for this item.
197///
198/// This controls both how the origin is determined for the [`Style::position`] field,
199/// and whether or not the item will be controlled by flexbox's layout algorithm.
200///
201/// WARNING: this enum follows the behavior of [CSS's `position` property](https://developer.mozilla.org/en-US/docs/Web/CSS/position),
202/// which can be unintuitive.
203///
204/// [`PositionType::Relative`] is the default value, in contrast to the default behavior in CSS.
205#[derive(Copy, Clone, PartialEq, Eq, Debug)]
206#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
207pub enum PositionType {
208 /// The offset is computed relative to the final position given by the layout algorithm.
209 /// Offsets do not affect the position of any other items; they are effectively a correction factor applied at the end.
210 Relative,
211 /// The offset is computed relative to this item's closest positioned ancestor, if any.
212 /// Otherwise, it is placed relative to the origin.
213 /// No space is created for the item in the page layout, and its size will not be altered.
214 ///
215 /// WARNING: to opt-out of layouting entirely, you must use [`Display::None`] instead on your [`Style`] object.
216 Absolute,
217}
218
219impl Default for PositionType {
220 fn default() -> Self {
221 Self::Relative
222 }
223}
224
225/// Controls whether flex items are forced onto one line or can wrap onto multiple lines.
226///
227/// Defaults to [`FlexWrap::NoWrap`]
228///
229/// [Specification](https://www.w3.org/TR/css-flexbox-1/#flex-wrap-property)
230#[derive(Copy, Clone, PartialEq, Eq, Debug)]
231#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
232pub enum FlexWrap {
233 /// Items will not wrap and stay on a single line
234 NoWrap,
235 /// Items will wrap according to this item's [`FlexDirection`]
236 Wrap,
237 /// Items will wrap in the opposite direction to this item's [`FlexDirection`]
238 WrapReverse,
239}
240
241impl Default for FlexWrap {
242 fn default() -> Self {
243 Self::NoWrap
244 }
245}
246
247/// A unit of linear measurement
248///
249/// This is commonly combined with [`Rect`], [`Point`](crate::geometry::Point) and [`Size<T>`].
250/// The default value is [`Dimension::Undefined`].
251#[derive(Copy, Clone, PartialEq, Debug)]
252#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
253pub enum Dimension {
254 /// The dimension is not given
255 Undefined,
256 /// The dimension should be automatically computed
257 Auto,
258 /// The dimension is stored in [points](https://en.wikipedia.org/wiki/Point_(typography))
259 ///
260 /// Each point is about 0.353 mm in size.
261 Points(f32),
262 /// The dimension is stored in percentage relative to the parent item.
263 Percent(f32),
264}
265
266impl Default for Dimension {
267 fn default() -> Self {
268 Self::Undefined
269 }
270}
271
272impl Dimension {
273 /// Is this value defined?
274 pub(crate) fn is_defined(self) -> bool {
275 matches!(self, Dimension::Points(_) | Dimension::Percent(_))
276 }
277}
278
279impl Default for Rect<Dimension> {
280 fn default() -> Self {
281 Self { start: Default::default(), end: Default::default(), top: Default::default(), bottom: Default::default() }
282 }
283}
284
285impl Rect<Dimension> {
286 /// Generates a [`Rect<Dimension>`] using [`Dimension::Points`] values for `start` and `top`
287 #[must_use]
288 pub fn top_from_points(start: f32, top: f32) -> Rect<Dimension> {
289 Rect { start: Dimension::Points(start), top: Dimension::Points(top), ..Default::default() }
290 }
291
292 /// Generates a [`Rect<Dimension>`] using [`Dimension::Points`] values for `end` and `bottom`
293 #[must_use]
294 pub fn bot_from_points(end: f32, bottom: f32) -> Rect<Dimension> {
295 Rect { end: Dimension::Points(end), bottom: Dimension::Points(bottom), ..Default::default() }
296 }
297
298 /// Generates a [`Rect<Dimension>`] using [`Dimension::Percent`] values for `start` and `top`
299 #[must_use]
300 pub fn top_from_percent(start: f32, top: f32) -> Rect<Dimension> {
301 Rect { start: Dimension::Percent(start), top: Dimension::Percent(top), ..Default::default() }
302 }
303
304 /// Generates a [`Rect<Dimension>`] using [`Dimension::Percent`] values for `end` and `bottom`
305 #[must_use]
306 pub fn bot_from_percent(end: f32, bottom: f32) -> Rect<Dimension> {
307 Rect { end: Dimension::Percent(end), bottom: Dimension::Percent(bottom), ..Default::default() }
308 }
309
310 /// Generates a [`Rect<Dimension>`] using [`Dimension::Undefined`] for all values
311 pub const UNDEFINED: Rect<Dimension> = Self {
312 start: Dimension::Undefined,
313 end: Dimension::Undefined,
314 top: Dimension::Undefined,
315 bottom: Dimension::Undefined,
316 };
317
318 /// Generates a [`Rect<Dimension>`] using [`Dimension::Auto`] for all values
319 pub const AUTO: Rect<Dimension> =
320 Self { start: Dimension::Auto, end: Dimension::Auto, top: Dimension::Auto, bottom: Dimension::Auto };
321
322 /// Create a new Rect with [`Dimension::Points`]
323 #[must_use]
324 pub fn from_points(start: f32, end: f32, top: f32, bottom: f32) -> Self {
325 Rect {
326 start: Dimension::Points(start),
327 end: Dimension::Points(end),
328 top: Dimension::Points(top),
329 bottom: Dimension::Points(bottom),
330 }
331 }
332
333 /// Create a new Rect with [`Dimension::Percent`]
334 #[must_use]
335 pub fn from_percent(start: f32, end: f32, top: f32, bottom: f32) -> Self {
336 Rect {
337 start: Dimension::Percent(start),
338 end: Dimension::Percent(end),
339 top: Dimension::Percent(top),
340 bottom: Dimension::Percent(bottom),
341 }
342 }
343}
344
345impl Default for Size<Dimension> {
346 fn default() -> Self {
347 Self { width: Dimension::Auto, height: Dimension::Auto }
348 }
349}
350
351/// The flexbox layout information for a single [`Node`](crate::node::Node).
352///
353/// The most important idea in flexbox is the notion of a "main" and "cross" axis, which are always perpendicular to each other.
354/// The orientation of these axes are controlled via the [`FlexDirection`] field of this struct.
355///
356/// This struct follows the [CSS equivalent](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox) directly;
357/// information about the behavior on the web should transfer directly.
358///
359/// Detailed information about the exact behavior of each of these fields
360/// can be found on [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS) by searching for the field name.
361/// The distinction between margin, padding and border is explained well in
362/// this [introduction to the box model](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model).
363///
364/// If the behavior does not match the flexbox layout algorithm on the web, please file a bug!
365#[derive(Copy, Clone, PartialEq, Debug)]
366#[cfg_attr(feature = "serde", derive(Serialize, Deserialize))]
367#[cfg_attr(feature = "serde", serde(default))]
368pub struct FlexboxLayout {
369 /// What layout strategy should be used?
370 pub display: Display,
371 /// What should the `position` value of this struct use as a base offset?
372 pub position_type: PositionType,
373 /// Which direction does the main axis flow in?
374 pub flex_direction: FlexDirection,
375 /// Should elements wrap, or stay in a single line?
376 pub flex_wrap: FlexWrap,
377 /// How should items be aligned relative to the cross axis?
378 pub align_items: AlignItems,
379 /// Should this item violate the cross axis alignment specified by its parent's [`AlignItems`]?
380 pub align_self: AlignSelf,
381 /// How should content contained within this item be aligned relative to the cross axis?
382 pub align_content: AlignContent,
383 /// How should items be aligned relative to the main axis?
384 pub justify_content: JustifyContent,
385 /// How should the position of this element be tweaked relative to the layout defined?
386 pub position: Rect<Dimension>,
387 /// How large should the margin be on each side?
388 pub margin: Rect<Dimension>,
389 /// How large should the padding be on each side?
390 pub padding: Rect<Dimension>,
391 /// How large should the border be on each side?
392 pub border: Rect<Dimension>,
393 /// The relative rate at which this item grows when it is expanding to fill space
394 ///
395 /// 0.0 is the default value, and this value must not be negative.
396 pub flex_grow: f32,
397 /// The relative rate at which this item shrinks when it is contracting to fit into space
398 ///
399 /// 1.0 is the default value, and this value must not be negative.
400 pub flex_shrink: f32,
401 /// Sets the initial main axis size of the item
402 pub flex_basis: Dimension,
403 /// Sets the initial size of the item
404 // TODO: why does this exist as distinct from flex_basis? How do they interact?
405 pub size: Size<Dimension>,
406 /// Controls the minimum size of the item
407 pub min_size: Size<Dimension>,
408 /// Controls the maximum size of the item
409 pub max_size: Size<Dimension>,
410 /// Sets the preferred aspect ratio for the item
411 ///
412 /// The ratio is calculated as width divided by height.
413 pub aspect_ratio: Option<f32>,
414}
415
416impl Default for FlexboxLayout {
417 fn default() -> Self {
418 Self {
419 display: Default::default(),
420 position_type: Default::default(),
421 flex_direction: Default::default(),
422 flex_wrap: Default::default(),
423 align_items: Default::default(),
424 align_self: Default::default(),
425 align_content: Default::default(),
426 justify_content: Default::default(),
427 position: Default::default(),
428 margin: Default::default(),
429 padding: Default::default(),
430 border: Default::default(),
431 flex_grow: 0.0,
432 flex_shrink: 1.0,
433 flex_basis: Dimension::Auto,
434 size: Default::default(),
435 min_size: Default::default(),
436 max_size: Default::default(),
437 aspect_ratio: Default::default(),
438 }
439 }
440}
441
442impl FlexboxLayout {
443 /// If the `direction` is row-oriented, the min width. Otherwise the min height
444 pub(crate) fn min_main_size(&self, direction: FlexDirection) -> Dimension {
445 if direction.is_row() {
446 self.min_size.width
447 } else {
448 self.min_size.height
449 }
450 }
451
452 /// If the `direction` is row-oriented, the max width. Otherwise the max height
453 pub(crate) fn max_main_size(&self, direction: FlexDirection) -> Dimension {
454 if direction.is_row() {
455 self.max_size.width
456 } else {
457 self.max_size.height
458 }
459 }
460
461 /// If the `direction` is row-oriented, the margin start. Otherwise the margin top
462 pub(crate) fn main_margin_start(&self, direction: FlexDirection) -> Dimension {
463 if direction.is_row() {
464 self.margin.start
465 } else {
466 self.margin.top
467 }
468 }
469
470 /// If the `direction` is row-oriented, the margin end. Otherwise the margin bottom
471 pub(crate) fn main_margin_end(&self, direction: FlexDirection) -> Dimension {
472 if direction.is_row() {
473 self.margin.end
474 } else {
475 self.margin.bottom
476 }
477 }
478
479 /// If the `direction` is row-oriented, the height. Otherwise the width
480 pub(crate) fn cross_size(&self, direction: FlexDirection) -> Dimension {
481 if direction.is_row() {
482 self.size.height
483 } else {
484 self.size.width
485 }
486 }
487
488 /// If the `direction` is row-oriented, the min height. Otherwise the min width
489 pub(crate) fn min_cross_size(&self, direction: FlexDirection) -> Dimension {
490 if direction.is_row() {
491 self.min_size.height
492 } else {
493 self.min_size.width
494 }
495 }
496
497 /// If the `direction` is row-oriented, the max height. Otherwise the max width
498 pub(crate) fn max_cross_size(&self, direction: FlexDirection) -> Dimension {
499 if direction.is_row() {
500 self.max_size.height
501 } else {
502 self.max_size.width
503 }
504 }
505
506 /// If the `direction` is row-oriented, the margin top. Otherwise the margin start
507 pub(crate) fn cross_margin_start(&self, direction: FlexDirection) -> Dimension {
508 if direction.is_row() {
509 self.margin.top
510 } else {
511 self.margin.start
512 }
513 }
514
515 /// If the `direction` is row-oriented, the margin bottom. Otherwise the margin end
516 pub(crate) fn cross_margin_end(&self, direction: FlexDirection) -> Dimension {
517 if direction.is_row() {
518 self.margin.bottom
519 } else {
520 self.margin.end
521 }
522 }
523
524 /// Computes the final alignment of this item based on the parent's [`AlignItems`] and this item's [`AlignSelf`]
525 pub(crate) fn align_self(&self, parent: &FlexboxLayout) -> AlignSelf {
526 // FUTURE WARNING: This function should never return AlignSelf::Auto
527 // See #169 https://github.com/DioxusLabs/taffy/pull/169#issuecomment-1157698840
528
529 if self.align_self == AlignSelf::Auto {
530 match parent.align_items {
531 AlignItems::FlexStart => AlignSelf::FlexStart,
532 AlignItems::FlexEnd => AlignSelf::FlexEnd,
533 AlignItems::Center => AlignSelf::Center,
534 AlignItems::Baseline => AlignSelf::Baseline,
535 AlignItems::Stretch => AlignSelf::Stretch,
536 }
537 } else {
538 self.align_self
539 }
540 }
541}
542
543#[allow(clippy::bool_assert_comparison)]
544#[cfg(test)]
545mod tests {
546 mod test_flex_direction {
547 use crate::style::*;
548
549 #[test]
550 fn flex_direction_is_row() {
551 assert_eq!(FlexDirection::Row.is_row(), true);
552 assert_eq!(FlexDirection::RowReverse.is_row(), true);
553 assert_eq!(FlexDirection::Column.is_row(), false);
554 assert_eq!(FlexDirection::ColumnReverse.is_row(), false);
555 }
556
557 #[test]
558 fn flex_direction_is_column() {
559 assert_eq!(FlexDirection::Row.is_column(), false);
560 assert_eq!(FlexDirection::RowReverse.is_column(), false);
561 assert_eq!(FlexDirection::Column.is_column(), true);
562 assert_eq!(FlexDirection::ColumnReverse.is_column(), true);
563 }
564
565 #[test]
566 fn flex_direction_is_reverse() {
567 assert_eq!(FlexDirection::Row.is_reverse(), false);
568 assert_eq!(FlexDirection::RowReverse.is_reverse(), true);
569 assert_eq!(FlexDirection::Column.is_reverse(), false);
570 assert_eq!(FlexDirection::ColumnReverse.is_reverse(), true);
571 }
572 }
573
574 mod test_flexbox_layout {
575 use crate::style::*;
576
577 fn layout_from_align_items(align: AlignItems) -> FlexboxLayout {
578 FlexboxLayout { align_items: align, ..Default::default() }
579 }
580
581 fn layout_from_align_self(align: AlignSelf) -> FlexboxLayout {
582 FlexboxLayout { align_self: align, ..Default::default() }
583 }
584
585 #[test]
586 fn flexbox_layout_min_main_size() {
587 let layout = FlexboxLayout { min_size: Size::from_points(1.0, 2.0), ..Default::default() };
588 assert_eq!(layout.min_main_size(FlexDirection::Row), Dimension::Points(1.0));
589 assert_eq!(layout.min_main_size(FlexDirection::Column), Dimension::Points(2.0));
590 }
591
592 #[test]
593 fn flexbox_layout_max_main_size() {
594 let layout = FlexboxLayout { max_size: Size::from_points(1.0, 2.0), ..Default::default() };
595 assert_eq!(layout.max_main_size(FlexDirection::Row), Dimension::Points(1.0));
596 assert_eq!(layout.max_main_size(FlexDirection::Column), Dimension::Points(2.0));
597 }
598
599 #[test]
600 fn flexbox_layout_main_margin_start() {
601 let layout = FlexboxLayout { margin: Rect::top_from_points(2.0, 1.0), ..Default::default() };
602 assert_eq!(layout.main_margin_start(FlexDirection::Row), Dimension::Points(2.0));
603 assert_eq!(layout.main_margin_start(FlexDirection::Column), Dimension::Points(1.0));
604 }
605
606 #[test]
607 fn flexbox_layout_main_margin_end() {
608 let layout = FlexboxLayout { margin: Rect::bot_from_points(2.0, 1.0), ..Default::default() };
609 assert_eq!(layout.main_margin_end(FlexDirection::Row), Dimension::Points(2.0));
610 assert_eq!(layout.main_margin_end(FlexDirection::Column), Dimension::Points(1.0));
611 }
612
613 #[test]
614 fn flexbox_layout_cross_size() {
615 let layout = FlexboxLayout { size: Size::from_points(1.0, 2.0), ..Default::default() };
616 assert_eq!(layout.cross_size(FlexDirection::Row), Dimension::Points(2.0));
617 assert_eq!(layout.cross_size(FlexDirection::Column), Dimension::Points(1.0));
618 }
619
620 #[test]
621 fn flexbox_layout_min_cross_size() {
622 let layout = FlexboxLayout { min_size: Size::from_points(1.0, 2.0), ..Default::default() };
623 assert_eq!(layout.min_cross_size(FlexDirection::Row), Dimension::Points(2.0));
624 assert_eq!(layout.min_cross_size(FlexDirection::Column), Dimension::Points(1.0));
625 }
626
627 #[test]
628 fn flexbox_layout_max_cross_size() {
629 let layout = FlexboxLayout { max_size: Size::from_points(1.0, 2.0), ..Default::default() };
630 assert_eq!(layout.max_cross_size(FlexDirection::Row), Dimension::Points(2.0));
631 assert_eq!(layout.max_cross_size(FlexDirection::Column), Dimension::Points(1.0));
632 }
633
634 #[test]
635 fn flexbox_layout_cross_margin_start() {
636 let layout = FlexboxLayout { margin: Rect::top_from_points(2.0, 1.0), ..Default::default() };
637 assert_eq!(layout.cross_margin_start(FlexDirection::Row), Dimension::Points(1.0));
638 assert_eq!(layout.cross_margin_start(FlexDirection::Column), Dimension::Points(2.0));
639 }
640
641 #[test]
642 fn flexbox_layout_cross_margin_end() {
643 let layout = FlexboxLayout { margin: Rect::bot_from_points(2.0, 1.0), ..Default::default() };
644 assert_eq!(layout.cross_margin_end(FlexDirection::Row), Dimension::Points(1.0));
645 assert_eq!(layout.cross_margin_end(FlexDirection::Column), Dimension::Points(2.0));
646 }
647
648 #[test]
649 fn flexbox_layout_align_self_auto() {
650 let parent = layout_from_align_items(AlignItems::FlexStart);
651 let layout = layout_from_align_self(AlignSelf::Auto);
652 assert_eq!(layout.align_self(&parent), AlignSelf::FlexStart);
653
654 let parent = layout_from_align_items(AlignItems::FlexEnd);
655 let layout = layout_from_align_self(AlignSelf::Auto);
656 assert_eq!(layout.align_self(&parent), AlignSelf::FlexEnd);
657
658 let parent = layout_from_align_items(AlignItems::Center);
659 let layout = layout_from_align_self(AlignSelf::Auto);
660 assert_eq!(layout.align_self(&parent), AlignSelf::Center);
661
662 let parent = layout_from_align_items(AlignItems::Baseline);
663 let layout = layout_from_align_self(AlignSelf::Auto);
664 assert_eq!(layout.align_self(&parent), AlignSelf::Baseline);
665
666 let parent = layout_from_align_items(AlignItems::Stretch);
667 let layout = layout_from_align_self(AlignSelf::Auto);
668 assert_eq!(layout.align_self(&parent), AlignSelf::Stretch);
669 }
670
671 #[test]
672 fn align_self() {
673 let parent = layout_from_align_items(AlignItems::FlexEnd);
674 let layout = layout_from_align_self(AlignSelf::FlexStart);
675 assert_eq!(layout.align_self(&parent), AlignSelf::FlexStart);
676
677 let parent = layout_from_align_items(AlignItems::FlexStart);
678 let layout = layout_from_align_self(AlignSelf::FlexEnd);
679 assert_eq!(layout.align_self(&parent), AlignSelf::FlexEnd);
680
681 let parent = layout_from_align_items(AlignItems::FlexStart);
682 let layout = layout_from_align_self(AlignSelf::Center);
683 assert_eq!(layout.align_self(&parent), AlignSelf::Center);
684
685 let parent = layout_from_align_items(AlignItems::FlexStart);
686 let layout = layout_from_align_self(AlignSelf::Baseline);
687 assert_eq!(layout.align_self(&parent), AlignSelf::Baseline);
688
689 let parent = layout_from_align_items(AlignItems::FlexStart);
690 let layout = layout_from_align_self(AlignSelf::Stretch);
691 assert_eq!(layout.align_self(&parent), AlignSelf::Stretch);
692 }
693 }
694}