FTXUI  3.0.0
C++ functional terminal UI.
flexbox_config.hpp
Go to the documentation of this file.
1 #ifndef FTXUI_DOM_FLEXBOX_CONFIG_HPP
2 #define FTXUI_DOM_FLEXBOX_CONFIG_HPP
3 
4 /*
5  This replicate the CSS flexbox model.
6  See guide for documentation:
7  https://css-tricks.com/snippets/css/a-guide-to-flexbox/
8 */
9 
10 namespace ftxui {
11 
12 struct FlexboxConfig {
13  /// This establishes the main-axis, thus defining the direction flex items are
14  /// placed in the flex container. Flexbox is (aside wrapping) single-direction
15  /// layout concept. Think of flex items as primarily laying out either in
16  /// horizontal rows or vertical columns.
17  enum class Direction {
18  Row, ///< Flex items are laid out in a row.
19  RowInversed, ///< Flex items are laid out in a row, but in reverse order.
20  Column, ///< Flex items are laid out in a column.
21  ColumnInversed ///< Flex items are laid out in a column, but in reverse
22  ///< order.
23  };
25 
26  /// By default, flex items will all try to fit onto one line. You can change
27  /// that and allow the items to wrap as needed with this property.
28  enum class Wrap {
29  NoWrap, ///< Flex items will all try to fit onto one line.
30  Wrap, ///< Flex items will wrap onto multiple lines.
31  WrapInversed, ///< Flex items will wrap onto multiple lines, but in reverse
32  ///< order.
33  };
35 
36  /// This defines the alignment along the main axis. It helps distribute extra
37  /// free space leftover when either all the flex items on a line are
38  /// inflexible, or are flexible but have reached their maximum size. It also
39  /// exerts some control over the alignment of items when they overflow the
40  /// line.
41  enum class JustifyContent {
42  /// Items are aligned to the start of flexbox's direction.
43  FlexStart,
44  /// Items are aligned to the end of flexbox's direction.
45  FlexEnd,
46  /// Items are centered along the line.
47  Center,
48  /// Items are stretched to fill the line.
49  Stretch,
50  /// Items are evenly distributed in the line; first item is on the start
51  // line, last item on the end line
53  /// Items are evenly distributed in the line with equal space around them.
54  /// Note that visually the spaces aren’t equal, since all the items have
55  /// equal space on both sides. The first item will have one unit of space
56  /// against the container edge, but two units of space between the next item
57  /// because that next item has its own spacing that applies.
59  /// Items are distributed so that the spacing between any two items (and the
60  /// space to the edges) is equal.
62  };
64 
65  /// This defines the default behavior for how flex items are laid out along
66  /// the cross axis on the current line. Think of it as the justify-content
67  /// version for the cross-axis (perpendicular to the main-axis).
68  enum class AlignItems {
69  FlexStart, ///< items are placed at the start of the cross axis.
70  FlexEnd, ///< items are placed at the end of the cross axis.
71  Center, ///< items are centered along the cross axis.
72  Stretch, ///< items are stretched to fill the cross axis.
73  };
75 
76  // This aligns a flex container’s lines within when there is extra space in
77  // the cross-axis, similar to how justify-content aligns individual items
78  // within the main-axis.
79  enum class AlignContent {
80  FlexStart, ///< items are placed at the start of the cross axis.
81  FlexEnd, ///< items are placed at the end of the cross axis.
82  Center, ///< items are centered along the cross axis.
83  Stretch, ///< items are stretched to fill the cross axis.
84  SpaceBetween, ///< items are evenly distributed in the cross axis.
85  SpaceAround, ///< tems evenly distributed with equal space around each
86  ///< line.
87  SpaceEvenly, ///< items are evenly distributed in the cross axis with equal
88  ///< space around them.
89  };
91 
92  int gap_x = 0;
93  int gap_y = 0;
94 
95  // Constructor pattern. For chained use like:
96  // ```
97  // FlexboxConfig()
98  // .Set(FlexboxConfig::Direction::Row)
99  // .Set(FlexboxConfig::Wrap::Wrap);
100  // ```
106  FlexboxConfig& SetGap(int gap_x, int gap_y);
107 };
108 
109 } // namespace ftxui
110 
111 #endif // FTXUI_DOM_FLEXBOX_CONFIG_HPP
112 
113 // Copyright 2021 Arthur Sonzogni. All rights reserved.
114 // Use of this source code is governed by the MIT license that can be found in
115 // the LICENSE file.
AlignContent align_content
@ Center
items are centered along the cross axis.
@ FlexStart
items are placed at the start of the cross axis.
@ FlexEnd
items are placed at the end of the cross axis.
@ SpaceBetween
items are evenly distributed in the cross axis.
@ Stretch
items are stretched to fill the cross axis.
@ Column
Flex items are laid out in a column.
@ Row
Flex items are laid out in a row.
@ RowInversed
Flex items are laid out in a row, but in reverse order.
@ NoWrap
Flex items will all try to fit onto one line.
@ Wrap
Flex items will wrap onto multiple lines.
@ Center
items are centered along the cross axis.
@ FlexStart
items are placed at the start of the cross axis.
@ FlexEnd
items are placed at the end of the cross axis.
@ Stretch
items are stretched to fill the cross axis.
FlexboxConfig & SetGap(int gap_x, int gap_y)
JustifyContent justify_content
@ Center
Items are centered along the line.
@ FlexStart
Items are aligned to the start of flexbox's direction.
@ FlexEnd
Items are aligned to the end of flexbox's direction.
@ SpaceBetween
Items are evenly distributed in the line; first item is on the start.
@ Stretch
Items are stretched to fill the line.
FlexboxConfig & Set(FlexboxConfig::Direction)