FTXUI 6.1.9
C++ functional terminal UI.
Loading...
Searching...
No Matches
src/ftxui/component/menu.cpp
Go to the documentation of this file.
1// Copyright 2020 Arthur Sonzogni. All rights reserved.
2// Use of this source code is governed by the MIT license that can be found in
3// the LICENSE file.
4#include <algorithm> // for max, fill_n, reverse
5#include <chrono> // for milliseconds
6#include <ftxui/dom/direction.hpp> // for Direction, Direction::Down, Direction::Left, Direction::Right, Direction::Up
7#include <functional> // for function
8#include <string> // for operator+, string
9#include <utility> // for move
10#include <vector> // for vector, __alloc_traits<>::value_type
11
12#include "ftxui/component/animation.hpp" // for Animator, Linear
13#include "ftxui/component/app.hpp" // for Component
14#include "ftxui/component/component.hpp" // for Make, Menu, MenuEntry, Toggle
15#include "ftxui/component/component_base.hpp" // for ComponentBase
16#include "ftxui/component/component_options.hpp" // for MenuOption, MenuEntryOption, UnderlineOption, AnimatedColorOption, AnimatedColorsOption, EntryState
17#include "ftxui/component/event.hpp" // for Event, Event::ArrowDown, Event::ArrowLeft, Event::ArrowRight, Event::ArrowUp, Event::End, Event::Home, Event::PageDown, Event::PageUp, Event::Return, Event::Tab, Event::TabReverse
18#include "ftxui/component/mouse.hpp" // for Mouse, Mouse::Left, Mouse::Released, Mouse::WheelDown, Mouse::WheelUp, Mouse::None
19#include "ftxui/dom/elements.hpp" // for operator|, Element, reflect, Decorator, nothing, Elements, bgcolor, color, hbox, separatorHSelector, separatorVSelector, vbox, xflex, yflex, text, bold, focus, inverted, select
20#include "ftxui/screen/box.hpp" // for Box
21#include "ftxui/screen/color.hpp" // for Color
22#include "ftxui/screen/util.hpp" // for clamp
23#include "ftxui/util/ref.hpp" // for Ref, ConstStringListRef, ConstStringRef
24
25namespace ftxui {
26
27namespace {
28
29Element DefaultOptionTransform(const EntryState& state) {
30 std::string label = (state.active ? "> " : " ") + state.label; // NOLINT
31 Element e = text(std::move(label));
32 if (state.focused) {
33 e = e | inverted;
34 }
35 if (state.active) {
36 e = e | bold;
37 }
38 return e;
39}
40
41bool IsInverted(Direction direction) {
42 switch (direction) {
43 case Direction::Up:
44 case Direction::Left:
45 return true;
46 case Direction::Down:
48 return false;
49 }
50 return false; // NOT_REACHED()
51}
52
53bool IsHorizontal(Direction direction) {
54 switch (direction) {
55 case Direction::Left:
57 return true;
58 case Direction::Down:
59 case Direction::Up:
60 return false;
61 }
62 return false; // NOT_REACHED()
63}
64
65} // namespace
66
67/// @brief A list of items. The user can navigate through them.
68/// @ingroup component
69class MenuBase : public ComponentBase, public MenuOption {
70 public:
71 explicit MenuBase(const MenuOption& option) : MenuOption(option) {
72 focused_entry() = selected();
73 }
74
75 bool IsHorizontal() { return ftxui::IsHorizontal(direction); }
76 void OnChange() { App::PostEventOrExecute(on_change); }
77
78 void OnEnter() { App::PostEventOrExecute(on_enter); }
79
80 void Clamp() {
81 if (selected() != selected_previous_) {
82 SelectedTakeFocus();
83 }
84 boxes_.resize(size());
85 selected() = util::clamp(selected(), 0, size() - 1);
86 selected_previous_ = util::clamp(selected_previous_, 0, size() - 1);
87 selected_focus_ = util::clamp(selected_focus_, 0, size() - 1);
88 focused_entry() = util::clamp(focused_entry(), 0, size() - 1);
89 }
90
91 void OnAnimation(animation::Params& params) override {
92 animator_first_.OnAnimation(params);
93 animator_second_.OnAnimation(params);
94 for (auto& animator : animator_background_) {
95 animator.OnAnimation(params);
96 }
97 for (auto& animator : animator_foreground_) {
98 animator.OnAnimation(params);
99 }
100 }
101
102 Element OnRender() override {
103 Clamp();
104 UpdateAnimationTarget();
105
106 Elements elements;
107 const bool is_menu_focused = Focused();
108 if (elements_prefix) {
109 elements.push_back(elements_prefix());
110 }
111 elements.reserve(size());
112 for (int i = 0; i < size(); ++i) {
113 if (i != 0 && elements_infix) {
114 elements.push_back(elements_infix());
115 }
116 const bool is_focused = (focused_entry() == i) && is_menu_focused;
117 const bool is_selected = (selected() == i);
118
119 const EntryState state = {
120 std::string(entries[i]), false, is_selected, is_focused, i,
121 };
122
123 Element element = (entries_option.transform ? entries_option.transform
124 : DefaultOptionTransform) //
125 (state);
126 if (selected_focus_ == i) {
127 element |= focus;
128 }
129 element |= AnimatedColorStyle(i);
130 element |= reflect(boxes_[i]);
131 elements.push_back(element);
132 }
133 if (elements_postfix) {
134 elements.push_back(elements_postfix());
135 }
136
137 if (IsInverted(direction)) {
138 std::reverse(elements.begin(), elements.end()); // NOLINT
139 }
140
141 const Element bar =
142 IsHorizontal() ? hbox(std::move(elements)) : vbox(std::move(elements));
143
144 if (!underline.enabled) {
145 return bar | reflect(box_);
146 }
147
148 if (IsHorizontal()) {
149 return vbox({
150 bar | xflex,
151 separatorHSelector(first_, second_, //
152 underline.color_active,
153 underline.color_inactive),
154 }) |
155 reflect(box_);
156 } else {
157 return hbox({
158 separatorVSelector(first_, second_, //
159 underline.color_active,
160 underline.color_inactive),
161 bar | yflex,
162 }) |
163 reflect(box_);
164 }
165 }
166
167 void SelectedTakeFocus() {
168 selected_previous_ = selected();
169 selected_focus_ = selected();
170 }
171
172 void OnUp() {
173 switch (direction) {
174 case Direction::Up:
175 selected()++;
176 break;
177 case Direction::Down:
178 selected()--;
179 break;
180 case Direction::Left:
181 case Direction::Right:
182 break;
183 }
184 }
185
186 void OnDown() {
187 switch (direction) {
188 case Direction::Up:
189 selected()--;
190 break;
191 case Direction::Down:
192 selected()++;
193 break;
194 case Direction::Left:
195 case Direction::Right:
196 break;
197 }
198 }
199
200 void OnLeft() {
201 switch (direction) {
202 case Direction::Left:
203 selected()++;
204 break;
205 case Direction::Right:
206 selected()--;
207 break;
208 case Direction::Down:
209 case Direction::Up:
210 break;
211 }
212 }
213
214 void OnRight() {
215 switch (direction) {
216 case Direction::Left:
217 selected()--;
218 break;
219 case Direction::Right:
220 selected()++;
221 break;
222 case Direction::Down:
223 case Direction::Up:
224 break;
225 }
226 }
227
228 // NOLINTNEXTLINE(readability-function-cognitive-complexity)
229 bool OnEvent(Event event) override {
230 Clamp();
231 if (!CaptureMouse(event)) {
232 return false;
233 }
234
235 if (event.is_mouse()) {
236 return OnMouseEvent(event);
237 }
238
239 if (Focused()) {
240 const int old_selected = selected();
241 if (event == Event::ArrowUp || event == Event::Character('k')) {
242 OnUp();
243 }
244 if (event == Event::ArrowDown || event == Event::Character('j')) {
245 OnDown();
246 }
247 if (event == Event::ArrowLeft || event == Event::Character('h')) {
248 OnLeft();
249 }
250 if (event == Event::ArrowRight || event == Event::Character('l')) {
251 OnRight();
252 }
253 if (event == Event::PageUp) {
254 selected() -= box_.y_max - box_.y_min;
255 }
256 if (event == Event::PageDown) {
257 selected() += box_.y_max - box_.y_min;
258 }
259 if (event == Event::Home) {
260 selected() = 0;
261 }
262 if (event == Event::End) {
263 selected() = size() - 1;
264 }
265 if (event == Event::Tab && size()) {
266 selected() = (selected() + 1) % size();
267 }
268 if (event == Event::TabReverse && size()) {
269 selected() = (selected() + size() - 1) % size();
270 }
271
272 selected() = util::clamp(selected(), 0, size() - 1);
273
274 if (selected() != old_selected) {
275 focused_entry() = selected();
276 SelectedTakeFocus();
277 OnChange();
278 return true;
279 }
280 }
281
282 if (event == Event::Return) {
283 OnEnter();
284 return true;
285 }
286
287 return false;
288 }
289
290 bool OnMouseEvent(Event event) {
291 if (event.mouse().button == Mouse::WheelDown ||
292 event.mouse().button == Mouse::WheelUp) {
293 return OnMouseWheel(event);
294 }
295
296 if (event.mouse().button != Mouse::None &&
297 event.mouse().button != Mouse::Left) {
298 return false;
299 }
300 if (!CaptureMouse(event)) {
301 return false;
302 }
303 for (int i = 0; i < size(); ++i) {
304 if (!boxes_[i].Contain(event.mouse().x, event.mouse().y)) {
305 continue;
306 }
307
308 TakeFocus();
309 focused_entry() = i;
310
311 if (event.mouse().button == Mouse::Left &&
312 event.mouse().motion == Mouse::Pressed) {
313 if (selected() != i) {
314 selected() = i;
315 selected_previous_ = selected();
316 OnChange();
317 }
318 return true;
319 }
320 }
321 return false;
322 }
323
324 bool OnMouseWheel(Event event) {
325 if (!box_.Contain(event.mouse().x, event.mouse().y)) {
326 return false;
327 }
328 const int old_selected = selected();
329
330 if (event.mouse().button == Mouse::WheelUp) {
331 selected()--;
332 }
333 if (event.mouse().button == Mouse::WheelDown) {
334 selected()++;
335 }
336
337 selected() = util::clamp(selected(), 0, size() - 1);
338
339 if (selected() != old_selected) {
340 SelectedTakeFocus();
341 OnChange();
342 }
343 return true;
344 }
345
346 void UpdateAnimationTarget() {
347 UpdateColorTarget();
348 UpdateUnderlineTarget();
349 }
350
351 void UpdateColorTarget() {
352 if (size() != int(animation_background_.size())) {
353 animation_background_.resize(size());
354 animation_foreground_.resize(size());
355 animator_background_.clear();
356 animator_foreground_.clear();
357
358 const int len = size();
359 animator_background_.reserve(len);
360 animator_foreground_.reserve(len);
361 for (int i = 0; i < len; ++i) {
362 animation_background_[i] = 0.F;
363 animation_foreground_[i] = 0.F;
364 animator_background_.emplace_back(&animation_background_[i], 0.F,
365 std::chrono::milliseconds(0),
367 animator_foreground_.emplace_back(&animation_foreground_[i], 0.F,
368 std::chrono::milliseconds(0),
370 }
371 }
372
373 const bool is_menu_focused = Focused();
374 for (int i = 0; i < size(); ++i) {
375 const bool is_focused = (focused_entry() == i) && is_menu_focused;
376 const bool is_selected = (selected() == i);
377 float target = is_selected ? 1.F : is_focused ? 0.5F : 0.F; // NOLINT
378 if (animator_background_[i].to() != target) {
379 animator_background_[i] = animation::Animator(
380 &animation_background_[i], target,
381 entries_option.animated_colors.background.duration,
382 entries_option.animated_colors.background.function);
383 animator_foreground_[i] = animation::Animator(
384 &animation_foreground_[i], target,
385 entries_option.animated_colors.foreground.duration,
386 entries_option.animated_colors.foreground.function);
387 }
388 }
389 }
390
391 Decorator AnimatedColorStyle(int i) {
392 Decorator style = nothing;
393 if (entries_option.animated_colors.foreground.enabled) {
394 style = style | color(Color::Interpolate(
395 animation_foreground_[i],
396 entries_option.animated_colors.foreground.inactive,
397 entries_option.animated_colors.foreground.active));
398 }
399
400 if (entries_option.animated_colors.background.enabled) {
401 style = style | bgcolor(Color::Interpolate(
402 animation_background_[i],
403 entries_option.animated_colors.background.inactive,
404 entries_option.animated_colors.background.active));
405 }
406 return style;
407 }
408
409 void UpdateUnderlineTarget() {
410 if (!underline.enabled) {
411 return;
412 }
413
414 if (FirstTarget() == animator_first_.to() &&
415 SecondTarget() == animator_second_.to()) {
416 return;
417 }
418
419 if (FirstTarget() >= animator_first_.to()) {
420 animator_first_ = animation::Animator(
421 &first_, FirstTarget(), underline.follower_duration,
422 underline.follower_function, underline.follower_delay);
423
424 animator_second_ = animation::Animator(
425 &second_, SecondTarget(), underline.leader_duration,
426 underline.leader_function, underline.leader_delay);
427 } else {
428 animator_first_ = animation::Animator(
429 &first_, FirstTarget(), underline.leader_duration,
430 underline.leader_function, underline.leader_delay);
431
432 animator_second_ = animation::Animator(
433 &second_, SecondTarget(), underline.follower_duration,
434 underline.follower_function, underline.follower_delay);
435 }
436 }
437
438 bool Focusable() const final { return entries.size(); }
439 int size() const { return int(entries.size()); }
440 float FirstTarget() {
441 if (boxes_.empty()) {
442 return 0.F;
443 }
444 const int value = IsHorizontal() ? boxes_[selected()].x_min - box_.x_min
445 : boxes_[selected()].y_min - box_.y_min;
446 return float(value);
447 }
448 float SecondTarget() {
449 if (boxes_.empty()) {
450 return 0.F;
451 }
452 const int value = IsHorizontal() ? boxes_[selected()].x_max - box_.x_min
453 : boxes_[selected()].y_max - box_.y_min;
454 return float(value);
455 }
456
457 protected:
458 int selected_previous_ = selected();
459 int selected_focus_ = selected();
460
461 // Mouse click support:
462 std::vector<Box> boxes_;
463 Box box_;
464
465 // Animation support:
466 float first_ = 0.F;
467 float second_ = 0.F;
468 animation::Animator animator_first_ = animation::Animator(&first_, 0.F);
469 animation::Animator animator_second_ = animation::Animator(&second_, 0.F);
470 std::vector<animation::Animator> animator_background_;
471 std::vector<animation::Animator> animator_foreground_;
472 std::vector<float> animation_background_;
473 std::vector<float> animation_foreground_;
474};
475
476/// @brief A list of text. The focused element is selected.
477/// @param option a structure containing all the parameters.
478/// @ingroup component
479///
480/// ### Example
481///
482/// ```cpp
483/// auto screen = App::TerminalOutput();
484/// std::vector<std::string> entries = {
485/// "entry 1",
486/// "entry 2",
487/// "entry 3",
488/// };
489/// int selected = 0;
490/// auto menu = Menu({
491/// .entries = &entries,
492/// .selected = &selected,
493/// });
494/// screen.Loop(menu);
495/// ```
496///
497/// ### Output
498///
499/// ```bash
500/// > entry 1
501/// entry 2
502/// entry 3
503/// ```
504// NOLINTNEXTLINE
505Component Menu(MenuOption option) {
506 return Make<MenuBase>(std::move(option));
507}
508
509/// @brief A list of text. The focused element is selected.
510/// @param entries The list of entries in the menu.
511/// @param selected The index of the currently selected element.
512/// @param option Additional optional parameters.
513/// @ingroup component
514///
515/// ### Example
516///
517/// ```cpp
518/// auto screen = App::TerminalOutput();
519/// std::vector<std::string> entries = {
520/// "entry 1",
521/// "entry 2",
522/// "entry 3",
523/// };
524/// int selected = 0;
525/// auto menu = Menu(&entries, &selected);
526/// screen.Loop(menu);
527/// ```
528///
529/// ### Output
530///
531/// ```bash
532/// > entry 1
533/// entry 2
534/// entry 3
535/// ```
536Component Menu(ConstStringListRef entries, int* selected, MenuOption option) {
537 option.entries = std::move(entries);
538 option.selected = selected;
539 return Menu(option);
540}
541
542/// @brief An horizontal list of elements. The user can navigate through them.
543/// @param entries The list of selectable entries to display.
544/// @param selected Reference the selected entry.
545/// See also |Menu|.
546/// @ingroup component
547Component Toggle(ConstStringListRef entries, int* selected) {
548 return Menu(std::move(entries), selected, MenuOption::Toggle());
549}
550
551/// @brief A specific menu entry. They can be put into a Container::Vertical to
552/// form a menu.
553/// @param label The text drawn representing this element.
554/// @param option Additional optional parameters.
555/// @ingroup component
556///
557/// ### Example
558///
559/// ```cpp
560/// auto screen = App::TerminalOutput();
561/// int selected = 0;
562/// auto menu = Container::Vertical({
563/// MenuEntry("entry 1"),
564/// MenuEntry("entry 2"),
565/// MenuEntry("entry 3"),
566/// }, &selected);
567/// screen.Loop(menu);
568/// ```
569///
570/// ### Output
571///
572/// ```bash
573/// > entry 1
574/// entry 2
575/// entry 3
576/// ```
577Component MenuEntry(ConstStringRef label, MenuEntryOption option) {
578 option.label = std::move(label);
579 return MenuEntry(std::move(option));
580}
581
582/// @brief A specific menu entry. They can be put into a Container::Vertical to
583/// form a menu.
584/// @param option The parameters.
585/// @ingroup component
586///
587/// ### Example
588///
589/// ```cpp
590/// auto screen = App::TerminalOutput();
591/// int selected = 0;
592/// auto menu = Container::Vertical({
593/// MenuEntry({.label = "entry 1"}),
594/// MenuEntry({.label = "entry 2"}),
595/// MenuEntry({.label = "entry 3"}),
596/// }, &selected);
597/// screen.Loop(menu);
598/// ```
599///
600/// ### Output
601///
602/// ```bash
603/// > entry 1
604/// entry 2
605/// entry 3
606/// ```
607Component MenuEntry(MenuEntryOption option) {
608 class Impl : public ComponentBase, public MenuEntryOption {
609 public:
610 explicit Impl(MenuEntryOption option)
611 : MenuEntryOption(std::move(option)) {}
612
613 private:
614 Element OnRender() override {
615 const bool is_focused = Focused();
616 UpdateAnimationTarget();
617
618 const EntryState state{
619 std::string(label()), false, hovered_, is_focused, Index(),
620 };
621
622 Element element = (transform ? transform : DefaultOptionTransform) //
623 (state);
624
625 if (is_focused) {
626 element |= focus;
627 }
628
629 return element | AnimatedColorStyle() | reflect(box_);
630 }
631
632 void UpdateAnimationTarget() {
633 const bool focused = Focused();
634 float target = focused ? 1.F : hovered_ ? 0.5F : 0.F; // NOLINT
635 if (target == animator_background_.to()) {
636 return;
637 }
638 animator_background_ = animation::Animator(
639 &animation_background_, target, animated_colors.background.duration,
640 animated_colors.background.function);
641 animator_foreground_ = animation::Animator(
642 &animation_foreground_, target, animated_colors.foreground.duration,
643 animated_colors.foreground.function);
644 }
645
646 Decorator AnimatedColorStyle() {
647 Decorator style = nothing;
648 if (animated_colors.foreground.enabled) {
649 style = style |
650 color(Color::Interpolate(animation_foreground_,
651 animated_colors.foreground.inactive,
652 animated_colors.foreground.active));
653 }
654
655 if (animated_colors.background.enabled) {
656 style = style |
657 bgcolor(Color::Interpolate(animation_background_,
658 animated_colors.background.inactive,
659 animated_colors.background.active));
660 }
661 return style;
662 }
663
664 bool Focusable() const override { return true; }
665 bool OnEvent(Event event) override {
666 if (!event.is_mouse()) {
667 return false;
668 }
669
670 hovered_ = box_.Contain(event.mouse().x, event.mouse().y);
671
672 if (!hovered_) {
673 return false;
674 }
675
676 if (event.mouse().button == Mouse::Left &&
677 event.mouse().motion == Mouse::Pressed) {
678 TakeFocus();
679 return true;
680 }
681
682 return false;
683 }
684
685 void OnAnimation(animation::Params& params) override {
686 animator_background_.OnAnimation(params);
687 animator_foreground_.OnAnimation(params);
688 }
689
690 Box box_;
691 bool hovered_ = false;
692
693 float animation_background_ = 0.F;
694 float animation_foreground_ = 0.F;
695 animation::Animator animator_background_ =
696 animation::Animator(&animation_background_, 0.F);
697 animation::Animator animator_foreground_ =
698 animation::Animator(&animation_foreground_, 0.F);
699 };
700
701 return Make<Impl>(std::move(option));
702}
703
704} // namespace ftxui
Component Toggle(ConstStringListRef entries, int *selected)
An horizontal list of elements. The user can navigate through them.
Component Menu(ConstStringListRef entries, int *selected_, MenuOption options=MenuOption::Vertical())
A list of text. The focused element is selected.
Component MenuEntry(ConstStringRef label, MenuEntryOption options={})
A specific menu entry. They can be put into a Container::Vertical to form a menu.
Element text(std::string_view text)
Display a piece of UTF8 encoded unicode text.
Element xflex(Element)
Expand/Minimize if possible/needed on the X axis.
Definition flex.cpp:129
Element nothing(Element element)
A decoration doing absolutely nothing.
Definition dom/util.cpp:28
Direction
Direction is an enumeration that represents the four cardinal directions.
Definition direction.hpp:13
Element bold(Element child)
Use a bold font, for elements with more emphasis.
Definition bold.cpp:33
Element yflex(Element)
Expand/Minimize if possible/needed on the Y axis.
Definition flex.cpp:135
Element inverted(Element child)
Add a filter that will invert the foreground and the background colors.
Definition inverted.cpp:34
Element focus(Element child)
Set the child to be the one focused among its siblings.
Definition frame.cpp:101
Element bgcolor(Color color, Element child)
Set the background color of an element.
Definition dom/color.cpp:96
Element color(Color color, Element child)
Set the foreground color of an element.
Definition dom/color.cpp:81
Element vbox(Elements children)
A container displaying elements vertically one by one.
Definition vbox.cpp:96
float Linear(float p)
Modeled after the line y = x.
Definition animation.cpp:29
constexpr const T & clamp(const T &v, const T &lo, const T &hi)
Definition util.hpp:11
The FTXUI ftxui:: namespace.
Definition animation.hpp:11
Element separatorVSelector(float up, float down, Color unselected_color, Color selected_color)
Draw an vertical bar, with the area in between up/downcolored differently.
std::shared_ptr< T > Make(Args &&... args)
Definition component.hpp:28
std::shared_ptr< Node > Element
Definition elements.hpp:24
FTXUI_EXPORT(DOM) Element separatorCharacter(std Element separatorHSelector(float left, float right, Color unselected_color, Color selected_color)
Draw a horizontal bar, with the area in between left/right colored differently.
Direction direction
Definition elements.hpp:82
Element hbox(Elements children)
A container displaying elements horizontally one by one.
Definition hbox.cpp:94
std::vector< Element > Elements
Definition elements.hpp:25
std::function< Element(Element)> Decorator
Definition elements.hpp:26
const Element & element
Definition node.hpp:95
Decorator reflect(Box &box)
Definition reflect.cpp:43
int value
Definition elements.hpp:178
std::shared_ptr< ComponentBase > Component
Definition app.hpp:23