Add menu styles.

examples/component/CMakeLists.txt

@@ -1,6 +1,5 @@
-example(color)
-example(gauge)
 example(input)
 example(menu)
 example(menu2)
+example(menu_style)
 example(toggle)

examples/component/color.cpp

@@ -1,58 +0,0 @@
-#include "ftxui/screen.hpp"
-#include "ftxui/dom/elements.hpp"
-#include <iostream>
-
-int main(int argc, const char *argv[])
-{
-  using namespace ftxui;
-  using namespace ftxui::dom;
-  auto document =
-    hbox(
-      vbox(
-        color(Color::Default, text(L"Default")),
-        color(Color::Black, text(L"Black")),
-        color(Color::GrayDark, text(L"GrayDark")),
-        color(Color::GrayLight, text(L"GrayLight")),
-        color(Color::White, text(L"White")),
-        color(Color::Blue, text(L"Blue")),
-        color(Color::BlueLight, text(L"BlueLight")),
-        color(Color::Cyan, text(L"Cyan")),
-        color(Color::CyanLight, text(L"CyanLight")),
-        color(Color::Green, text(L"Green")),
-        color(Color::GreenLight, text(L"GreenLight")),
-        color(Color::Magenta, text(L"Magenta")),
-        color(Color::MagentaLight, text(L"MagentaLight")),
-        color(Color::Red, text(L"Red")),
-        color(Color::RedLight, text(L"RedLight")),
-        color(Color::Yellow, text(L"Yellow")),
-        color(Color::YellowLight, text(L"YellowLight"))
-      ),
-      vbox(
-        bgcolor(Color::Default, text(L"Default")),
-        bgcolor(Color::Black, text(L"Black")),
-        bgcolor(Color::GrayDark, text(L"GrayDark")),
-        bgcolor(Color::GrayLight, text(L"GrayLight")),
-        bgcolor(Color::White, text(L"White")),
-        bgcolor(Color::Blue, text(L"Blue")),
-        bgcolor(Color::BlueLight, text(L"BlueLight")),
-        bgcolor(Color::Cyan, text(L"Cyan")),
-        bgcolor(Color::CyanLight, text(L"CyanLight")),
-        bgcolor(Color::Green, text(L"Green")),
-        bgcolor(Color::GreenLight, text(L"GreenLight")),
-        bgcolor(Color::Magenta, text(L"Magenta")),
-        bgcolor(Color::MagentaLight, text(L"MagentaLight")),
-        bgcolor(Color::Red, text(L"Red")),
-        bgcolor(Color::RedLight, text(L"RedLight")),
-        bgcolor(Color::Yellow, text(L"Yellow")),
-        bgcolor(Color::YellowLight, text(L"YellowLight"))
-      ),
-      flex()
-    );
-
-  auto screen = ftxui::Screen::TerminalOutput(document);
-  Render(screen, document.get());
-
-  std::cout << screen.ToString();
-
-  return 0;
-}

examples/component/gauge.cpp

@@ -1,28 +0,0 @@
-#include <chrono>
-#include <iostream>
-#include <thread>
-
-#include "ftxui/screen.hpp"
-#include "ftxui/dom/elements.hpp"
-
-int main(int argc, const char *argv[])
-{
-  for(float percentage = 0; percentage <= 1.0; percentage+=0.001) {
-    std::wstring data_downloaded =
-        std::to_wstring(int(percentage * 44100)) + L"/44100";
-    using namespace ftxui::dom;
-    auto document =
-        hbox(
-          text(L"downloading:"),
-          flex(gauge(percentage)),
-          text(L" " + data_downloaded)
-        );
-    auto screen = ftxui::Screen(100, 1);
-    Render(screen, document.get());
-    std::cout << '\r' << screen.ToString() << std::flush;
-
-    using namespace std::chrono_literals;
-    std::this_thread::sleep_for(0.01s);
-  }
-  std::cout << std::endl;
-}

examples/component/menu2.cpp

@@ -70,7 +70,7 @@ class MyComponent : ComponentHorizontal {
 
 int main(int argc, const char *argv[])
 {
-  ftxui::ScreenInteractive screen(60,17);
+  ftxui::ScreenInteractive screen(60,18);
   MyComponent component(screen.delegate());
   component.on_enter = screen.ExitLoopClosure();
   screen.Loop();

examples/component/menu_style.cpp

@@ -0,0 +1,87 @@
+#include <iostream>
+#include <thread>
+
+#include "ftxui/component/component_horizontal.hpp"
+#include "ftxui/component/menu.hpp"
+#include "ftxui/screen_interactive.hpp"
+#include "ftxui/util/string.hpp"
+
+using namespace ftxui;
+using namespace ftxui::component;
+using namespace ftxui::dom;
+
+class MyComponent : ComponentHorizontal {
+  public:
+   MyComponent(ftxui::component::Delegate* delegate)
+       : ComponentHorizontal(delegate),
+         menu_1(delegate->NewChild()),
+         menu_2(delegate->NewChild()),
+         menu_3(delegate->NewChild()),
+         menu_4(delegate->NewChild()),
+         menu_5(delegate->NewChild()),
+         menu_6(delegate->NewChild()) {
+
+     for(Menu* menu : {&menu_1, &menu_2, &menu_3, &menu_4, &menu_5, &menu_6}) {
+       menu->entries = {
+         L"Monkey",
+         L"Dog",
+         L"Cat",
+         L"Bird",
+         L"Elephant",
+       };
+       menu->on_enter = [this]() { on_enter(); };
+     }
+
+     menu_2.selected_style = color(Color::Blue);
+     menu_2.active_style = compose(bold, color(Color::Blue));
+
+     menu_3.selected_style = color(Color::Blue);
+     menu_3.active_style = bgcolor(Color::Blue);
+
+     menu_4.selected_style = bgcolor(Color::Blue);
+     menu_4.active_style = bgcolor(Color::BlueLight);
+
+     menu_5.normal_style = bgcolor(Color::Blue);
+     menu_5.selected_style = bgcolor(Color::Yellow);
+     menu_5.active_style = bgcolor(Color::Red);
+
+     menu_6.normal_style = compose(dim, color(Color::Blue));
+     menu_6.selected_style = compose(nothing, color(Color::Blue));
+     menu_6.active_style = compose(bold, color(Color::Blue));
+
+     Focus(&menu_1);
+   }
+
+   std::function<void()> on_enter = [](){};
+  private:
+   Menu menu_1;
+   Menu menu_2;
+   Menu menu_3;
+   Menu menu_4;
+   Menu menu_5;
+   Menu menu_6;
+
+   Element Render() override {
+     return
+      vbox(
+        hbox(
+          flex(frame(center(text(L" menu_1 ")), menu_1.Render())),
+          flex(frame(center(text(L" menu_2 ")), menu_2.Render())),
+          flex(frame(center(text(L" menu_3 ")), menu_3.Render()))
+        ),
+        hbox(
+          flex(frame(center(text(L" menu_4 ")), menu_4.Render())),
+          flex(frame(center(text(L" menu_5 ")), menu_5.Render())),
+          flex(frame(center(text(L" menu_6 ")), menu_6.Render()))
+        )
+      );
+   }
+};
+
+int main(int argc, const char *argv[])
+{
+  ftxui::ScreenInteractive screen(90,14);
+  MyComponent component(screen.delegate());
+  component.on_enter = screen.ExitLoopClosure();
+  screen.Loop();
+}

examples/component/toggle.cpp

@@ -18,15 +18,12 @@ class MyComponent : ComponentVertical {
       : ComponentVertical(delegate),
         toggle_1(delegate->NewChild()),
         toggle_2(delegate->NewChild()),
-        toggle_3(delegate->NewChild()) {
-    toggle_1.on = L"On";
-    toggle_1.off = L"Off";
-
-    toggle_2.on = L"Enabled";
-    toggle_2.off = L"Disabled";
-
-    toggle_3.on = L"10€";
-    toggle_3.off = L"0€";
+        toggle_3(delegate->NewChild()),
+        toggle_4(delegate->NewChild()) {
+    toggle_1.options = {L"On", L"Off"};
+    toggle_2.options = {L"Enabled", L"Disabled"};
+    toggle_3.options = {L"10€", L"0€"};
+    toggle_4.options = {L"Nothing", L"One element", L"Several elements"};
 
     Focus(&toggle_1);
   }
@@ -37,6 +34,7 @@ class MyComponent : ComponentVertical {
   Toggle toggle_1;
   Toggle toggle_2;
   Toggle toggle_3;
+  Toggle toggle_4;
 
   Element Render() override {
     return
@@ -45,7 +43,8 @@ class MyComponent : ComponentVertical {
         text(L""),
         hbox(text(L" * Poweroff on startup      : "), toggle_1.Render()),
         hbox(text(L" * Out of process           : "), toggle_2.Render()),
-        hbox(text(L" * Price of the information : "), toggle_3.Render())
+        hbox(text(L" * Price of the information : "), toggle_3.Render()),
+        hbox(text(L" * Number of elements       : "), toggle_4.Render())
       );
   }
 
@@ -63,7 +62,7 @@ class MyComponent : ComponentVertical {
 };
 
 int main(int argc, const char* argv[]) {
-  ftxui::ScreenInteractive screen(50,5);
+  ftxui::ScreenInteractive screen(70,7);
   MyComponent component(screen.delegate());
   component.on_enter = screen.ExitLoopClosure();
   screen.Loop();