Loading...
Searching...
No Matches
examples/component/input_style.cpp
// Copyright 2020 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/dom/linear_gradient.hpp> // for LinearGradient
#include <ftxui/screen/color.hpp> // for Color, Color::White, Color::Red, Color::Blue, Color::Black, Color::GrayDark, ftxui
#include <functional> // for function
#include <string> // for allocator, string
#include <utility> // for move
#include "ftxui/component/component.hpp" // for Input, Horizontal, Vertical, operator|
#include "ftxui/component/component_base.hpp" // for Component
#include "ftxui/component/component_options.hpp" // for InputState, InputOption
#include "ftxui/component/screen_interactive.hpp" // for ScreenInteractive
#include "ftxui/dom/elements.hpp" // for operator|=, Element, bgcolor, operator|, separatorEmpty, color, borderEmpty, separator, text, center, dim, hbox, vbox, border, borderDouble, borderRounded
int main() {
using namespace ftxui;
InputOption style_1 = InputOption::Default();
InputOption style_2 = InputOption::Spacious();
InputOption style_3 = InputOption::Spacious();
style_3.transform = [](InputState state) {
state.element |= borderEmpty;
if (state.is_placeholder) {
state.element |= dim;
}
if (state.focused) {
state.element |= borderDouble;
state.element |= bgcolor(Color::White);
state.element |= color(Color::Black);
} else if (state.hovered) {
state.element |= borderRounded;
state.element |= bgcolor(LinearGradient(90, Color::Blue, Color::Red));
state.element |= color(Color::White);
} else {
state.element |= border;
state.element |= bgcolor(LinearGradient(0, Color::Blue, Color::Red));
state.element |= color(Color::White);
}
return state.element;
};
InputOption style_4 = InputOption::Spacious();
style_4.transform = [](InputState state) {
state.element = hbox({
text("Theorem") | center | borderEmpty | bgcolor(Color::Red),
separatorEmpty(),
separator() | color(Color::White),
separatorEmpty(),
std::move(state.element),
});
state.element |= borderEmpty;
if (state.is_placeholder) {
state.element |= dim;
}
if (state.focused) {
state.element |= bgcolor(Color::Black);
} else {
state.element |= bgcolor(Color::Blue);
}
if (state.hovered) {
state.element |= bgcolor(Color::GrayDark);
}
return vbox({state.element, separatorEmpty()});
};
auto generateUiFromStyle = [&](InputOption style) {
auto first_name = new std::string(); // Leaked
auto middle_name = new std::string(); // Leaked
auto last_name = new std::string(); // Leaked
return Container::Vertical({
Input(first_name, "first name", style),
Input(middle_name, "middle name", style),
Input(last_name, "last name", style),
}) |
borderEmpty;
};
auto ui = Container::Horizontal({
generateUiFromStyle(style_1),
generateUiFromStyle(style_2),
generateUiFromStyle(style_3),
generateUiFromStyle(style_4),
});
auto screen = ScreenInteractive::TerminalOutput();
screen.Loop(ui);
}
ftxui::Color::White
@ White
Definition color.hpp:67
ftxui::Color::Black
@ Black
Definition color.hpp:52
ftxui::Color::Red
@ Red
Definition color.hpp:53
ftxui::Color::GrayDark
@ GrayDark
Definition color.hpp:60
ftxui::Color::Blue
@ Blue
Definition color.hpp:56
ftxui::ScreenInteractive::TerminalOutput
static ScreenInteractive TerminalOutput()
Definition screen_interactive.cpp:406
color.hpp
component.hpp
component_base.hpp
component_options.hpp
elements.hpp
linear_gradient.hpp
ftxui::Container::Horizontal
Component Horizontal(Components children)
A list of components, drawn one by one horizontally and navigated horizontally using left/right arrow...
Definition container.cpp:360
ftxui::Container::Vertical
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
ftxui
Definition animation.hpp:10
ftxui::bgcolor
Decorator bgcolor(Color)
Decorate using a background color.
Definition color.cpp:124
ftxui::borderDouble
Element borderDouble(Element)
Draw a double border around the element.
Definition border.cpp:405
ftxui::separatorEmpty
Element separatorEmpty()
Draw a vertical or horizontal separation in between two other elements, using the EMPTY style.
Definition separator.cpp:357
ftxui::borderRounded
Element borderRounded(Element)
Draw a rounded border around the element.
Definition border.cpp:440
ftxui::hbox
Element hbox(Elements)
A container displaying elements horizontally one by one.
Definition hbox.cpp:94
ftxui::center
Element center(Element)
Center an element horizontally and vertically.
Definition composite_decorator.cpp:31
ftxui::text
Element text(std::wstring text)
Display a piece of unicode text.
Definition text.cpp:160
ftxui::Input
Component Input(InputOption options={})
An input box for editing text.
Definition input.cpp:571
ftxui::separator
Element separator()
Draw a vertical or horizontal separation in between two other elements.
Definition separator.cpp:134
ftxui::dim
Element dim(Element)
Use a light font, for elements with less emphasis.
Definition dim.cpp:33
ftxui::border
Element border(Element)
Draw a border around the element.
Definition border.cpp:227
ftxui::borderEmpty
Element borderEmpty(Element)
Draw an empty border around the element.
Definition border.cpp:475
ftxui::color
Decorator color(Color)
Decorate using a foreground color.
Definition color.cpp:110
ftxui::vbox
Element vbox(Elements)
A container displaying elements vertically one by one.
Definition vbox.cpp:96
ftxui::InputState
Used to define style for the Input component.
Definition component_options.hpp:152
screen_interactive.hpp
ftxui::InputOption
Option for the Input component.
Definition component_options.hpp:162
ftxui::InputOption::Default
static InputOption Default()
Create the default input style:
Definition component_options.cpp:312
ftxui::InputOption::Spacious
static InputOption Spacious()
A white on black style with high margins:
Definition component_options.cpp:335
ftxui::InputOption::transform
std::function< Element(InputState)> transform
Definition component_options.hpp:177
ftxui::LinearGradient
A class representing the settings for linear-gradient color effect.
Definition linear_gradient.hpp:30