From f81c5d94a55fac74fbdf6a1943827d5683a8f934 Mon Sep 17 00:00:00 2001 From: Arthur Sonzogni Date: Sat, 30 Mar 2024 11:01:28 +0100 Subject: [PATCH] Revert change to button example. (#835) It was introduced mistakenly by: https://github.com/ArthurSonzogni/FTXUI/commit/f495ce029cb3a9b4c8309e4456e494f8b6b09967 --- examples/component/button.cpp | 33 ++++++++++++++++++++++++++++++--- 1 file changed, 30 insertions(+), 3 deletions(-) diff --git a/examples/component/button.cpp b/examples/component/button.cpp index 27439a39..e5e0de91 100644 --- a/examples/component/button.cpp +++ b/examples/component/button.cpp @@ -12,13 +12,40 @@ using namespace ftxui; +// This is a helper function to create a button with a custom style. +// The style is defined by a lambda function that takes an EntryState and +// returns an Element. +// We are using `center` to center the text inside the button, then `border` to +// add a border around the button, and finally `flex` to make the button fill +// the available space. +ButtonOption Style() { + auto option = ButtonOption::Animated(); + option.transform = [](const EntryState& s) { + auto element = text(s.label); + if (s.focused) { + element |= bold; + } + return element | center | borderEmpty | flex; + }; + return option; +} + int main() { int value = 50; + // clang-format off + auto btn_dec_01 = Button("-1", [&] { value += 1; }, Style()); + auto btn_inc_01 = Button("+1", [&] { value -= 1; }, Style()); + auto btn_dec_10 = Button("-10", [&] { value -= 10; }, Style()); + auto btn_inc_10 = Button("+10", [&] { value += 10; }, Style()); + // clang-format on + // The tree of components. This defines how to navigate using the keyboard. - auto buttons = Container::Horizontal({ - Button("Decrease", [&] { value--; }), - Button("Increase", [&] { value++; }), + // The selected `row` is shared to get a grid layout. + int row = 0; + auto buttons = Container::Vertical({ + Container::Horizontal({btn_dec_01, btn_inc_01}, &row) | flex, + Container::Horizontal({btn_dec_10, btn_inc_10}, &row) | flex, }); // Modify the way to render them on screen: