FTXUI 7.0.3
C++ functional terminal UI.
Loading...
Searching...
No Matches
homescreen.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 <stddef.h> // for size_t
5#include <array> // for array
6#include <atomic> // for atomic
7#include <chrono> // for operator""s, chrono_literals
8#include <cmath> // for sin
10#include <functional> // for ref, reference_wrapper, function
11#include <memory> // for allocator, shared_ptr, __shared_ptr_access
12#include <string> // for string, basic_string, char_traits, operator+, to_string
13#include <thread> // for sleep_for, thread
14#include <utility> // for move
15#include <vector>
16
17#include "ftxui/component/app.hpp" // for Component, App
18
19#include "ftxui/component/component.hpp" // for Checkbox, Renderer, Horizontal, Vertical, Input, Menu, Radiobox, ResizableSplitLeft, Tab
20#include "ftxui/component/component_base.hpp" // for ComponentBase, Component
21#include "ftxui/component/component_options.hpp" // for MenuOption, InputOption
22#include "ftxui/component/event.hpp" // for Event, Event::Custom
23#include "ftxui/dom/elements.hpp" // for text, color, operator|, bgcolor, filler, Element, vbox, size, hbox, separator, flex, window, graph, EQUAL, paragraph, WIDTH, hcenter, Elements, bold, vscroll_indicator, HEIGHT, flexbox, hflow, border, frame, flex_grow, gauge, paragraphAlignCenter, paragraphAlignJustify, paragraphAlignLeft, paragraphAlignRight, dim, spinner, LESS_THAN, center, yframe, GREATER_THAN
24#include "ftxui/dom/flexbox_config.hpp" // for FlexboxConfig
25#include "ftxui/screen/color.hpp" // for Color, Color::BlueLight, Color::RedLight, Color::Black, Color::Blue, Color::Cyan, Color::CyanLight, Color::GrayDark, Color::GrayLight, Color::Green, Color::GreenLight, Color::Magenta, Color::MagentaLight, Color::Red, Color::White, Color::Yellow, Color::YellowLight, Color::Default, Color::Palette256, ftxui
26#include "ftxui/screen/color_info.hpp" // for ColorInfo
27#include "ftxui/screen/terminal.hpp" // for Size, Dimensions
28
29using namespace ftxui;
30
31int main() {
32 auto screen = App::Fullscreen();
33
34 // ---------------------------------------------------------------------------
35 // HTOP
36 // ---------------------------------------------------------------------------
37 int shift = 0;
38
39 auto my_graph = [&shift](int width, int height) {
40 std::vector<int> output(width);
41 for (int i = 0; i < width; ++i) {
42 float v = 0.5f;
43 v += 0.1f * sin((i + shift) * 0.1f);
44 v += 0.2f * sin((i + shift + 10) * 0.15f);
45 v += 0.1f * sin((i + shift) * 0.03f);
46 v *= height;
47 output[i] = (int)v;
48 }
49 return output;
50 };
51
52 auto htop = Renderer([&] {
53 auto frequency = vbox({
54 text("Frequency [Mhz]") | hcenter,
55 hbox({
56 vbox({
57 text("2400 "),
58 filler(),
59 text("1200 "),
60 filler(),
61 text("0 "),
62 }),
63 graph(std::ref(my_graph)) | flex,
64 }) | flex,
65 });
66
67 auto utilization = vbox({
68 text("Utilization [%]") | hcenter,
69 hbox({
70 vbox({
71 text("100 "),
72 filler(),
73 text("50 "),
74 filler(),
75 text("0 "),
76 }),
77 graph(std::ref(my_graph)) | color(Color::RedLight),
78 }) | flex,
79 });
80
81 auto ram = vbox({
82 text("Ram [Mo]") | hcenter,
83 hbox({
84 vbox({
85 text("8192"),
86 filler(),
87 text("4096 "),
88 filler(),
89 text("0 "),
90 }),
91 graph(std::ref(my_graph)) | color(Color::BlueLight),
92 }) | flex,
93 });
94
95 return hbox({
96 vbox({
97 frequency | flex,
98 separator(),
99 utilization | flex,
100 }) | flex,
101 separator(),
102 ram | flex,
103 }) |
104 flex;
105 });
106
107 // ---------------------------------------------------------------------------
108 // Compilateur
109 // ---------------------------------------------------------------------------
110
111 const std::vector<std::string> compiler_entries = {
112 "gcc",
113 "clang",
114 "emcc",
115 "game_maker",
116 "Ada compilers",
117 "ALGOL 60 compilers",
118 "ALGOL 68 compilers",
119 "Assemblers (Intel *86)",
120 "Assemblers (Motorola 68*)",
121 "Assemblers (Zilog Z80)",
122 "Assemblers (other)",
123 "BASIC Compilers",
124 "BASIC interpreters",
125 "Batch compilers",
126 "C compilers",
127 "Source-to-source compilers",
128 "C++ compilers",
129 "C# compilers",
130 "COBOL compilers",
131 "Common Lisp compilers",
132 "D compilers",
133 "DIBOL/DBL compilers",
134 "ECMAScript interpreters",
135 "Eiffel compilers",
136 "Fortran compilers",
137 "Go compilers",
138 "Haskell compilers",
139 "Java compilers",
140 "Pascal compilers",
141 "Perl Interpreters",
142 "PHP compilers",
143 "PL/I compilers",
144 "Python compilers",
145 "Scheme compilers and interpreters",
146 "Smalltalk compilers",
147 "Tcl Interpreters",
148 "VMS Interpreters",
149 "Rexx Interpreters",
150 "CLI compilers",
151 };
152
153 int compiler_selected = 0;
154 Component compiler = Radiobox(&compiler_entries, &compiler_selected);
155
156 std::array<std::string, 8> options_label = {
157 "-Wall",
158 "-Werror",
159 "-lpthread",
160 "-O3",
161 "-Wabi-tag",
162 "-Wno-class-conversion",
163 "-Wcomma-subscript",
164 "-Wno-conversion-null",
165 };
166 std::array<bool, 8> options_state = {
167 false, false, false, false, false, false, false, false,
168 };
169
170 std::vector<std::string> input_entries;
171 int input_selected = 0;
172 Component input = Menu(&input_entries, &input_selected);
173
174 auto input_option = InputOption();
175 std::string input_add_content;
176 input_option.on_enter = [&] {
177 input_entries.push_back(input_add_content);
178 input_add_content = "";
179 };
180 Component input_add = Input(&input_add_content, "input files", input_option);
181
182 std::string executable_content_ = "";
183 Component executable_ = Input(&executable_content_, "executable");
184
185 Component flags = Container::Vertical({
186 Checkbox(&options_label[0], &options_state[0]),
187 Checkbox(&options_label[1], &options_state[1]),
188 Checkbox(&options_label[2], &options_state[2]),
189 Checkbox(&options_label[3], &options_state[3]),
190 Checkbox(&options_label[4], &options_state[4]),
191 Checkbox(&options_label[5], &options_state[5]),
192 Checkbox(&options_label[6], &options_state[6]),
193 Checkbox(&options_label[7], &options_state[7]),
194 });
195
196 auto compiler_component = Container::Horizontal({
197 compiler,
198 flags,
199 Container::Vertical({
200 executable_,
201 Container::Horizontal({
202 input_add,
203 input,
204 }),
205 }),
206 });
207
208 auto render_command = [&] {
209 Elements line;
210 // Compilateur
211 line.push_back(text(compiler_entries[compiler_selected]) | bold);
212 // drapeaux
213 for (int i = 0; i < 8; ++i) {
214 if (options_state[i]) {
215 line.push_back(text(" "));
216 line.push_back(text(options_label[i]) | dim);
217 }
218 }
219 // Exécutable
220 if (!executable_content_.empty()) {
221 line.push_back(text(" -o ") | bold);
222 line.push_back(text(executable_content_) | color(Color::BlueLight) |
223 bold);
224 }
225 // Entrée
226 for (auto& it : input_entries) {
227 line.push_back(text(" " + it) | color(Color::RedLight));
228 }
229 return line;
230 };
231
232 auto compiler_renderer = Renderer(compiler_component, [&] {
233 auto compiler_win = window(text("Compiler"),
234 compiler->Render() | vscroll_indicator | frame);
235 auto flags_win =
236 window(text("Flags"), flags->Render() | vscroll_indicator | frame);
237 auto executable_win = window(text("Executable:"), executable_->Render());
238 auto input_win =
239 window(text("Input"), hbox({
240 vbox({
241 hbox({
242 text("Add: "),
243 input_add->Render(),
244 }) | size(WIDTH, EQUAL, 20) |
245 size(HEIGHT, EQUAL, 1),
246 filler(),
247 }),
248 separator(),
249 input->Render() | vscroll_indicator | frame |
250 size(HEIGHT, EQUAL, 3) | flex,
251 }));
252 return vbox({
253 hbox({
254 compiler_win,
255 flags_win,
256 vbox({
257 executable_win | size(WIDTH, EQUAL, 20),
258 input_win | size(WIDTH, EQUAL, 60),
259 }),
260 filler(),
261 }) | size(HEIGHT, LESS_THAN, 8),
262 hflow(render_command()) | flex_grow,
263 }) |
264 flex_grow;
265 });
266
267 // ---------------------------------------------------------------------------
268 // Spinner
269 // ---------------------------------------------------------------------------
270 auto spinner_tab_renderer = Renderer([&] {
271 Elements entries;
272 for (int i = 0; i < 22; ++i) {
273 entries.push_back(spinner(i, shift / 5) | bold |
274 size(WIDTH, GREATER_THAN, 2) | border);
275 }
276 return hflow(std::move(entries));
277 });
278
279 // ---------------------------------------------------------------------------
280 // Couleurs
281 // ---------------------------------------------------------------------------
282 auto color_tab_renderer = Renderer([] {
283 auto basic_color_display =
284 vbox({
285 text("16 color palette:"),
286 separator(),
287 hbox({
288 vbox({
289 color(Color::Default, text("Default")),
290 color(Color::Black, text("Black")),
291 color(Color::GrayDark, text("GrayDark")),
292 color(Color::GrayLight, text("GrayLight")),
293 color(Color::White, text("White")),
294 color(Color::Blue, text("Blue")),
295 color(Color::BlueLight, text("BlueLight")),
296 color(Color::Cyan, text("Cyan")),
297 color(Color::CyanLight, text("CyanLight")),
298 color(Color::Green, text("Green")),
299 color(Color::GreenLight, text("GreenLight")),
300 color(Color::Magenta, text("Magenta")),
301 color(Color::MagentaLight, text("MagentaLight")),
302 color(Color::Red, text("Red")),
303 color(Color::RedLight, text("RedLight")),
304 color(Color::Yellow, text("Yellow")),
305 color(Color::YellowLight, text("YellowLight")),
306 }),
307 vbox({
308 bgcolor(Color::Default, text("Default")),
309 bgcolor(Color::Black, text("Black")),
310 bgcolor(Color::GrayDark, text("GrayDark")),
311 bgcolor(Color::GrayLight, text("GrayLight")),
312 bgcolor(Color::White, text("White")),
313 bgcolor(Color::Blue, text("Blue")),
314 bgcolor(Color::BlueLight, text("BlueLight")),
315 bgcolor(Color::Cyan, text("Cyan")),
316 bgcolor(Color::CyanLight, text("CyanLight")),
317 bgcolor(Color::Green, text("Green")),
318 bgcolor(Color::GreenLight, text("GreenLight")),
319 bgcolor(Color::Magenta, text("Magenta")),
320 bgcolor(Color::MagentaLight, text("MagentaLight")),
321 bgcolor(Color::Red, text("Red")),
322 bgcolor(Color::RedLight, text("RedLight")),
323 bgcolor(Color::Yellow, text("Yellow")),
324 bgcolor(Color::YellowLight, text("YellowLight")),
325 }),
326 }),
327 }) |
328 border;
329
330 auto palette_256_color_display = text("256 colors palette:");
331 {
332 std::vector<std::vector<ColorInfo>> info_columns = ColorInfoSorted2D();
333 Elements columns;
334 for (auto& column : info_columns) {
335 Elements column_elements;
336 for (auto& it : column) {
337 column_elements.push_back(
338 text(" ") | bgcolor(Color(Color::Palette256(it.index_256))));
339 }
340 columns.push_back(hbox(std::move(column_elements)));
341 }
342 palette_256_color_display = vbox({
343 palette_256_color_display,
344 separator(),
345 vbox(columns),
346 }) |
347 border;
348 }
349
350 // Affichage des vraies couleurs.
351 auto true_color_display = text("TrueColors: 24bits:");
352 {
353 int saturation = 255;
354 Elements array;
355 for (int value = 0; value < 255; value += 16) {
356 Elements line;
357 for (int hue = 0; hue < 255; hue += 6) {
358 line.push_back(text("▀") //
359 | color(Color::HSV(hue, saturation, value)) //
360 | bgcolor(Color::HSV(hue, saturation, value + 8)));
361 }
362 array.push_back(hbox(std::move(line)));
363 }
364 true_color_display = vbox({
365 true_color_display,
366 separator(),
367 vbox(std::move(array)),
368 }) |
369 border;
370 }
371
372 return flexbox(
373 {
374 basic_color_display,
375 palette_256_color_display,
376 true_color_display,
377 },
378 FlexboxConfig().SetGap(1, 1));
379 });
380
381 // ---------------------------------------------------------------------------
382 // Jauges
383 // ---------------------------------------------------------------------------
384 auto render_gauge = [&shift](int delta) {
385 float progress = (shift + delta) % 500 / 500.f;
386 return hbox({
387 text(std::to_string(int(progress * 100)) + "% ") |
388 size(WIDTH, EQUAL, 5),
389 gauge(progress),
390 });
391 };
392
393 auto gauge_component = Renderer([render_gauge] {
394 return vbox({
395 render_gauge(0) | color(Color::Black),
396 render_gauge(100) | color(Color::GrayDark),
397 render_gauge(50) | color(Color::GrayLight),
398 render_gauge(6894) | color(Color::White),
399 separator(),
400 render_gauge(6841) | color(Color::Blue),
401 render_gauge(9813) | color(Color::BlueLight),
402 render_gauge(98765) | color(Color::Cyan),
403 render_gauge(98) | color(Color::CyanLight),
404 render_gauge(9846) | color(Color::Green),
405 render_gauge(1122) | color(Color::GreenLight),
406 render_gauge(84) | color(Color::Magenta),
407 render_gauge(645) | color(Color::MagentaLight),
408 render_gauge(568) | color(Color::Red),
409 render_gauge(2222) | color(Color::RedLight),
410 render_gauge(220) | color(Color::Yellow),
411 render_gauge(348) | color(Color::YellowLight),
412 });
413 });
414
415 // ---------------------------------------------------------------------------
416 // Paragraphe
417 // ---------------------------------------------------------------------------
418 auto make_box = [](size_t dimx, size_t dimy) {
419 std::string title = std::to_string(dimx) + "x" + std::to_string(dimy);
420 return window(text(title) | hcenter | bold,
421 text("content") | hcenter | dim) |
422 size(WIDTH, EQUAL, dimx) | size(HEIGHT, EQUAL, dimy);
423 };
424
425 auto paragraph_renderer_left = Renderer([&] {
426 std::string str =
427 "Lorem Ipsum is simply dummy text of the printing and typesetting "
428 "industry.\nLorem Ipsum has been the industry's standard dummy text "
429 "ever since the 1500s, when an unknown printer took a galley of type "
430 "and scrambled it to make a type specimen book.";
431 return vbox({
432 window(text("Align left:"), paragraphAlignLeft(str)),
433 window(text("Align center:"), paragraphAlignCenter(str)),
434 window(text("Align right:"), paragraphAlignRight(str)),
435 window(text("Align justify:"), paragraphAlignJustify(str)),
436 window(text("Side by side"), hbox({
437 paragraph(str),
438 separator(),
439 paragraph(str),
440 })),
441 window(text("Elements with different size:"),
442 flexbox({
443 make_box(10, 5),
444 make_box(9, 4),
445 make_box(8, 4),
446 make_box(6, 3),
447 make_box(10, 5),
448 make_box(9, 4),
449 make_box(8, 4),
450 make_box(6, 3),
451 make_box(10, 5),
452 make_box(9, 4),
453 make_box(8, 4),
454 make_box(6, 3),
455 })),
456 }) |
457 vscroll_indicator | yframe | flex;
458 });
459
460 auto paragraph_renderer_right = Renderer([] {
461 return paragraph("<--- This vertical bar is resizable using the mouse") |
462 center;
463 });
464
465 int paragraph_renderer_split_position = Terminal::Size().dimx / 2;
466 auto paragraph_renderer_group =
467 ResizableSplitLeft(paragraph_renderer_left, paragraph_renderer_right,
468 &paragraph_renderer_split_position);
469 auto paragraph_renderer_group_renderer =
470 Renderer(paragraph_renderer_group,
471 [&] { return paragraph_renderer_group->Render(); });
472
473 // ---------------------------------------------------------------------------
474 // Onglets
475 // ---------------------------------------------------------------------------
476
477 int tab_index = 0;
478 std::vector<std::string> tab_entries = {
479 "htop", "color", "spinner", "gauge", "compiler", "paragraph",
480 };
481 auto tab_selection =
482 Menu(&tab_entries, &tab_index, MenuOption::HorizontalAnimated());
483 auto tab_content = Container::Tab(
484 {
485 htop,
486 color_tab_renderer,
487 spinner_tab_renderer,
488 gauge_component,
489 compiler_renderer,
490 paragraph_renderer_group_renderer,
491 },
492 &tab_index);
493
494 auto exit_button =
495 Button("Exit", [&] { screen.Exit(); }, ButtonOption::Animated());
496
497 auto main_container = Container::Vertical({
498 Container::Horizontal({
499 tab_selection,
500 exit_button,
501 }),
502 tab_content,
503 });
504
505 auto main_renderer = Renderer(main_container, [&] {
506 return vbox({
507 text("FTXUI Demo") | bold | hcenter,
508 hbox({
509 tab_selection->Render() | flex,
510 exit_button->Render(),
511 }),
512 tab_content->Render() | flex,
513 });
514 });
515
516 Loop loop(&screen, main_renderer);
517 while (!loop.HasQuitted()) {
518 // Mettre à jour l'état de l'application.
519 shift++;
520
521 // Demander un nouveau cadre à dessiner.
522 screen.RequestAnimationFrame();
523
524 // Exécuter les événements et dessiner le cadre suivant.
525 loop.RunOnce();
526
527 // Dormir pendant une courte durée pour contrôler la fréquence d'images (60 FPS).
528 std::this_thread::sleep_for(std::chrono::milliseconds(1000 / 60));
529 }
530
531 return 0;
532}
Element make_box(int x, int y)
Component Button(ConstStringRef label, std::function< void()> on_click, ButtonOption options=ButtonOption::Simple())
Dessine un bouton. Exécute une fonction lorsqu'il est cliqué.
Component Renderer(Component child, std::function< Element()>)
Retourne un nouveau Component, similaire à |child|, mais utilisant |render| comme événement Component...
Component Checkbox(ConstStringRef label, bool *checked, CheckboxOption options=CheckboxOption::Simple())
Dessine un élément cochable.
Component Input(StringRef content, InputOption options={})
Une boîte de saisie pour éditer du texte.
Component Radiobox(ConstStringListRef entries, int *selected_, RadioboxOption options={})
Une liste d'éléments, où un seul peut être sélectionné.
Component Menu(ConstStringListRef entries, int *selected_, MenuOption options=MenuOption::Vertical())
Une liste de texte. L'élément focalisé est sélectionné.
Component ResizableSplitLeft(Component main, Component back, int *main_size)
Une division horizontale entre deux composants, configurable en utilisant la souris.
Element window(Element title, Element content, BorderStyle border=ROUNDED)
Dessine une fenêtre avec un titre et une bordure autour de l'élément.
Element text(std::string_view text)
Affiche un morceau de texte unicode encodé en UTF8.
Element paragraphAlignLeft(std::string_view the_text)
Renvoie un élément affichant le paragraphe sur plusieurs lignes, aligné à gauche.
Decorator size(WidthOrHeight direction, Constraint constraint, int value)
Applique une contrainte sur la taille d'un élément.
Element flex(Element child)
Permet à un élément enfant de s'étendre proportionnellement à l'espace restant dans un conteneur.
Definition flex.cpp:95
Element spinner(int charset_index, size_t image_index)
Utile pour représenter l'effet du temps et/ou des événements. Cela affiche une "vidéo" en art ASCII.
Element center(Element child)
Centre un élément horizontalement et verticalement.
Element paragraphAlignJustify(std::string_view the_text)
Renvoie un élément affichant le paragraphe sur plusieurs lignes, aligné en utilisant un alignement ju...
Element flex_grow(Element child)
S'étend si possible.
Definition flex.cpp:113
Element paragraphAlignCenter(std::string_view the_text)
Renvoie un élément affichant le paragraphe sur plusieurs lignes, aligné au centre.
Element paragraph(std::string_view the_text)
Renvoie un élément affichant le paragraphe sur plusieurs lignes.
Element bgcolor(Color color, Element child)
Définit la couleur d'arrière-plan d'un élément.
Definition dom/color.cpp:96
Element paragraphAlignRight(std::string_view the_text)
Renvoie un élément affichant le paragraphe sur plusieurs lignes, aligné à droite.
Element separator()
Dessine une séparation verticale ou horizontale entre deux autres éléments.
Element filler()
Un élément qui s'étendra proportionnellement à l'espace restant dans un conteneur.
Definition flex.cpp:70
Element color(Color color, Element child)
Définit la couleur de premier plan d'un élément.
Definition dom/color.cpp:81
Element gauge(float progress)
Dessine une barre de progression haute définition.
Element hcenter(Element child)
Centre un élément horizontalement.
Element vbox(Elements children)
Un conteneur affichant les éléments verticalement un par un.
Definition vbox.cpp:96
int main()
L'espace de noms FTXUI ftxui::
Definition animation.hpp:11
@ LESS_THAN
Definition elements.hpp:194
@ GREATER_THAN
Definition elements.hpp:194
Element flexbox(Elements, FlexboxConfig config=FlexboxConfig())
Un conteneur affichant des éléments sur des lignes/colonnes et capable de passer à la colonne/ligne s...
Definition flexbox.cpp:252
FTXUI_EXPORT(DOM) Element gridbox(std Element hflow(Elements)
Un conteneur affichant des éléments en lignes de gauche à droite. Quand il est rempli,...
Definition flexbox.cpp:270
Element hbox(Elements children)
Un conteneur affichant les éléments horizontalement un par un.
Definition hbox.cpp:94
std::vector< Element > Elements
Definition elements.hpp:26
std::vector< std::vector< ColorInfo > > ColorInfoSorted2D()
Color
Construit une couleur transparente.
Definition elements.hpp:99
int value
Definition elements.hpp:195
Element graph(GraphFunction graph_function)
Dessine un graphique en utilisant une GraphFunction.
std::shared_ptr< ComponentBase > Component
Definition app.hpp:23