FTXUI  5.0.0
C++ functional terminal UI.
examples/component/modal_dialog.cpp
// Copyright 2022 Arthur Sonzogni. All rights reserved.
// Use of this source code is governed by the MIT license that can be found in
// the LICENSE file.
#include <ftxui/component/component_options.hpp> // for ButtonOption
#include <ftxui/component/mouse.hpp> // for ftxui
#include <functional> // for function
#include <memory> // for allocator, shared_ptr
#include "ftxui/component/component.hpp" // for Button, operator|=, Renderer, Vertical, Modal
#include "ftxui/component/screen_interactive.hpp" // for ScreenInteractive, Component
#include "ftxui/dom/elements.hpp" // for operator|, separator, text, size, Element, vbox, border, GREATER_THAN, WIDTH, center, HEIGHT
using namespace ftxui;
auto button_style = ButtonOption::Animated();
// Definition of the main component. The details are not important.
Component MainComponent(std::function<void()> show_modal,
std::function<void()> exit) {
auto component = Container::Vertical({
Button("Show modal", show_modal, button_style),
Button("Quit", exit, button_style),
});
// Polish how the two buttons are rendered:
component |= Renderer([&](Element inner) {
return vbox({
text("Main component"),
inner,
}) //
| size(WIDTH, GREATER_THAN, 15) //
| border //
| center; //
});
return component;
}
// Definition of the modal component. The details are not important.
Component ModalComponent(std::function<void()> do_nothing,
std::function<void()> hide_modal) {
auto component = Container::Vertical({
Button("Do nothing", do_nothing, button_style),
Button("Quit modal", hide_modal, button_style),
});
// Polish how the two buttons are rendered:
component |= Renderer([&](Element inner) {
return vbox({
text("Modal component "),
inner,
}) //
| size(WIDTH, GREATER_THAN, 30) //
| border; //
});
return component;
}
int main(int argc, const char* argv[]) {
auto screen = ScreenInteractive::TerminalOutput();
// State of the application:
bool modal_shown = false;
// Some actions modifying the state:
auto show_modal = [&] { modal_shown = true; };
auto hide_modal = [&] { modal_shown = false; };
auto exit = screen.ExitLoopClosure();
auto do_nothing = [&] {};
// Instanciate the main and modal components:
auto main_component = MainComponent(show_modal, exit);
auto modal_component = ModalComponent(do_nothing, hide_modal);
// Use the `Modal` function to use together the main component and its modal
// window. The |modal_shown| boolean controls whether the modal is shown or
// not.
main_component |= Modal(modal_component, &modal_shown);
screen.Loop(main_component);
return 0;
}
Component Vertical(Components children)
A list of components, drawn one by one vertically and navigated vertically using up/down arrow key or...
Definition: container.cpp:317
@ HEIGHT
Definition: elements.hpp:148
@ WIDTH
Definition: elements.hpp:148
Decorator size(WidthOrHeight, Constraint, int value)
Apply a constraint on the size of an element.
Definition: size.cpp:90
std::shared_ptr< Node > Element
Definition: elements.hpp:23
std::shared_ptr< ComponentBase > Component
Component Button(ButtonOption options)
Draw a button. Execute a function when clicked.
Definition: button.cpp:175
Component Modal(Component main, Component modal, const bool *show_modal)
Definition: modal.cpp:18
Component Renderer(Component child, std::function< Element()>)
Return a new Component, similar to |child|, but using |render| as the Component::Render() event.
Definition: renderer.cpp:63
Element center(Element)
Center an element horizontally and vertically.
Element text(std::wstring text)
Display a piece of unicode text.
Definition: text.cpp:120
Element separator()
Draw a vertical or horizontal separation in between two other elements.
Definition: separator.cpp:132
@ GREATER_THAN
Definition: elements.hpp:149
Element border(Element)
Draw a border around the element.
Definition: border.cpp:227
Element vbox(Elements)
A container displaying elements vertically one by one.
Definition: vbox.cpp:83