Mirror/FTXUI
1
0
Fork 0
mirror of https://github.com/ArthurSonzogni/FTXUI.git synced 2025-11-15 11:38:56 +08:00
Code Issues Packages Projects Releases Wiki Activity
Files
gh-pages
FTXUI/en/v6.1.7/index.html
ArthurSonzogni 4aab714d3f deploy: 229cae78b5
2025-11-12 12:56:59 +00:00

1345 lines
207 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- HTML header for doxygen 1.8.14-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="cache-control" content="max-age=86400"/>
<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
<meta name="generator" content="Doxygen 1.12.0"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>FTXUI: FTXUI</title>
<link href="tabs.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="dynsections.js"></script>
<link href="navtree.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="navtreedata.js"></script>
<script type="text/javascript" src="navtree.js"></script>
<script type="text/javascript" src="resize.js"></script>
<script type="text/javascript" src="cookie.js"></script>
<link href="search/search.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="search/searchdata.js"></script>
<script type="text/javascript" src="search/search.js"></script>
<link href="doxygen.css" rel="stylesheet" type="text/css" />
<link href="doxygen_extra.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="top"><!-- do not remove this div, it is closed by doxygen! -->
<div id="titlearea">
<table cellspacing="0" cellpadding="0">
<tbody>
<tr style="height: 56px;">
<td id="projectalign" style="padding-left: 0.5em;">
<div id="projectname">FTXUI
&#160;<span id="projectnumber">6.1.7</span>
</div>
<div id="projectbrief">C++ functional terminal UI.</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- end header part -->
<!-- Generated by Doxygen 1.12.0 -->
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
var searchBox = new SearchBox("searchBox", "search/",'.html');
/* @license-end */
</script>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function() { codefold.init(0); });
/* @license-end */
</script>
<script type="text/javascript" src="menudata.js"></script>
<script type="text/javascript" src="menu.js"></script>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function() {
initMenu('',true,false,'search.php','Search',true);
$(function() { init_search(); });
});
/* @license-end */
</script>
<div id="main-nav"></div>
</div><!-- top -->
<div id="side-nav" class="ui-resizable side-nav-resizable">
<div id="nav-tree">
<div id="nav-tree-contents">
<div id="nav-sync" class="sync"></div>
</div>
</div>
<div id="splitbar" style="-moz-user-select:none;"
class="ui-resizable-handle">
</div>
</div>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function(){initNavTree('index.html',''); initResizable(true); });
/* @license-end */
</script>
<div id="doc-content">
<!-- window showing the filter options -->
<div id="MSearchSelectWindow"
onmouseover="return searchBox.OnSearchSelectShow()"
onmouseout="return searchBox.OnSearchSelectHide()"
onkeydown="return searchBox.OnSearchSelectKey(event)">
</div>
<!-- iframe showing the search results (closed by default) -->
<div id="MSearchResultsWindow">
<div id="MSearchResults">
<div class="SRPage">
<div id="SRIndex">
<div id="SRResults"></div>
<div class="SRStatus" id="Loading">Loading...</div>
<div class="SRStatus" id="Searching">Searching...</div>
<div class="SRStatus" id="NoMatches">No Matches</div>
</div>
</div>
</div>
</div>
<div><div class="header">
<div class="headertitle"><div class="title">FTXUI </div></div>
</div><!--header-->
<div class="contents">
<div class="toc"><h3>Table of Contents</h3>
<ul>
<li class="level1">
<a href="#introduction">Introduction</a>
<ul>
<li class="level2">
<a href="#configure">Configure</a>
<ul>
<li class="level3">
<a href="#build-cmake-find-package">Using CMake and find_package</a>
</li>
<li class="level3">
<a href="#build-cmake">Using CMake and FetchContent</a>
</li>
</ul>
</li>
<li class="level2">
<a href="#autotoc_md126">Build</a>
</li>
</ul>
</li>
<li class="level1">
<a href="#modules">List of modules.</a>
</li>
<li class="level1">
<a href="#module-screen">screen</a>
</li>
<li class="level1">
<a href="#module-dom">dom</a>
<ul>
<li class="level2">
<a href="#dom-text">text</a>
</li>
<li class="level2">
<a href="#dom-vtext">vtext</a>
</li>
<li class="level2">
<a href="#dom-paragraph">paragraph </a>
</li>
<li class="level2">
<a href="#dom-border">border</a>
</li>
<li class="level2">
<a href="#dom-window">window</a>
</li>
<li class="level2">
<a href="#dom-separator">separator</a>
</li>
<li class="level2">
<a href="#dom-gauge">gauge</a>
</li>
<li class="level2">
<a href="#dom-graph">graph</a>
</li>
<li class="level2">
<a href="#dom-colors">Colors</a>
<ul>
<li class="level3">
<a href="#dom-colors-palette-16">Palette16 </a>
</li>
<li class="level3">
<a href="#dom-colors-palette-256">Palette256 </a>
</li>
<li class="level3">
<a href="#dom-colors-true-color">TrueColor</a>
</li>
</ul>
</li>
<li class="level2">
<a href="#dom-linear-gradient">LinearGradient</a>
</li>
<li class="level2">
<a href="#dom-style">Style</a>
</li>
<li class="level2">
<a href="#dom-layout">Layout</a>
</li>
<li class="level2">
<a href="#dom-table">Table</a>
</li>
<li class="level2">
<a href="#dom-canvas">Canvas</a>
</li>
</ul>
</li>
<li class="level1">
<a href="#module-component">component</a>
<ul>
<li class="level2">
<a href="#component-input">Input</a>
<ul>
<li class="level3">
<a href="#autotoc_md127">Filtered input</a>
</li>
</ul>
</li>
<li class="level2">
<a href="#component-menu">Menu</a>
</li>
<li class="level2">
<a href="#component-toggle">Toggle </a>
</li>
<li class="level2">
<a href="#component-checkbox">CheckBox</a>
</li>
<li class="level2">
<a href="#component-radiobox">RadioBox</a>
</li>
<li class="level2">
<a href="#component-dropdown">Dropdown</a>
</li>
<li class="level2">
<a href="#component-slider">Slider</a>
</li>
<li class="level2">
<a href="#component-renderer">Renderer</a>
</li>
<li class="level2">
<a href="#component-catchevent">CatchEvent</a>
</li>
<li class="level2">
<a href="#component-collapsible">Collapsible</a>
</li>
<li class="level2">
<a href="#component-maybe">Maybe</a>
</li>
<li class="level2">
<a href="#component-container">Container</a>
<ul>
<li class="level3">
<a href="#component-horizontal">Horizontal</a>
</li>
<li class="level3">
<a href="#component-vertical">Vertical</a>
</li>
<li class="level3">
<a href="#component-tab">Tab</a>
</li>
</ul>
</li>
<li class="level2">
<a href="#component-resizable-split">ResizableSplit</a>
</li>
<li class="level2">
<a href="#component-force-redraw">Force a frame redraw.</a>
</li>
</ul>
</li>
</ul>
</div>
<div class="textblock"><h1><a class="anchor" id="introduction"></a>
Introduction</h1>
<p>Welcome to the FTXUI documentation!</p>
<p>This is a brief tutorial. You are also encouraged to self-learn by reading the <a href="./examples.html">examples</a>.</p>
<p><b>Short example</b></p>
<p>To build a single frame, you need create an <code><a class="el" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">ftxui::Element</a></code>, and display it on a <code><a class="el" href="classftxui_1_1Screen.html" title="A rectangular grid of Pixel.">ftxui::Screen</a></code>.</p>
<p><b>main.cpp</b> </p><div class="fragment"><div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> main(<span class="keywordtype">void</span>) {</div>
<div class="line"> <span class="keyword">using namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a>;</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Define the document</span></div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> document =</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;left&quot;</span>) | border,</div>
<div class="line"> text(<span class="stringliteral">&quot;middle&quot;</span>) | border | flex,</div>
<div class="line"> text(<span class="stringliteral">&quot;right&quot;</span>) | border,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(</div>
<div class="line"> Dimension::Full(), <span class="comment">// Width</span></div>
<div class="line"> Dimension::Fit(document) <span class="comment">// Height</span></div>
<div class="line"> );</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> EXIT_SUCCESS;</div>
<div class="line">}</div>
<div class="ttc" id="aelements_8hpp_html"><div class="ttname"><a href="elements_8hpp.html">elements.hpp</a></div></div>
<div class="ttc" id="anamespaceftxui_html"><div class="ttname"><a href="namespaceftxui.html">ftxui</a></div><div class="ttdef"><b>Definition</b> <a href="animation_8hpp_source.html#l00010">animation.hpp:10</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a2bc31f2d685189e5c61d2293a1f51b4f"><div class="ttname"><a href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">ftxui::Element</a></div><div class="ttdeci">std::shared_ptr&lt; Node &gt; Element</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00022">elements.hpp:22</a></div></div>
<div class="ttc" id="ascreen_8hpp_html"><div class="ttname"><a href="screen_8hpp.html">screen.hpp</a></div></div>
</div><!-- fragment --><p><b>output</b> </p><div class="fragment"><div class="line">┌────┐┌────────────────────────────────────┐┌─────┐</div>
<div class="line">│left││middle ││right│</div>
<div class="line">└────┘└────────────────────────────────────┘└─────┘</div>
</div><!-- fragment --><h2><a class="anchor" id="configure"></a>
Configure</h2>
<h3><a class="anchor" id="build-cmake-find-package"></a>
Using CMake and find_package</h3>
<p>Assuming FTXUI is available or installed on the system.</p>
<p><b>CMakeLists.txt</b> </p><div class="fragment"><div class="line">cmake_minimum_required (VERSION 3.11)</div>
<div class="line">find_package(ftxui 5 REQUIRED)</div>
<div class="line">project(ftxui-starter LANGUAGES CXX VERSION 1.0.0)</div>
<div class="line">add_executable(ftxui-starter src/main.cpp)</div>
<div class="line">target_link_libraries(ftxui-starter</div>
<div class="line"> PRIVATE ftxui::screen</div>
<div class="line"> PRIVATE ftxui::dom</div>
<div class="line"> PRIVATE ftxui::component # Not needed for this example.</div>
<div class="line">)</div>
</div><!-- fragment --><h3><a class="anchor" id="build-cmake"></a>
Using CMake and FetchContent</h3>
<p>If you want to fetch FTXUI using cmake:</p>
<p><b>CMakeLists.txt</b> </p><div class="fragment"><div class="line">cmake_minimum_required (VERSION 3.11)</div>
<div class="line"> </div>
<div class="line">include(FetchContent)</div>
<div class="line">set(FETCHCONTENT_UPDATES_DISCONNECTED TRUE)</div>
<div class="line">FetchContent_Declare(ftxui</div>
<div class="line"> GIT_REPOSITORY https://github.com/ArthurSonzogni/ftxui</div>
<div class="line"> GIT_TAG main # Important: Specify a version or a commit hash here.</div>
<div class="line">)</div>
<div class="line">FetchContent_MakeAvailable(ftxui)</div>
<div class="line"> </div>
<div class="line">project(ftxui-starter LANGUAGES CXX VERSION 1.0.0)</div>
<div class="line">add_executable(ftxui-starter src/main.cpp)</div>
<div class="line">target_link_libraries(ftxui-starter</div>
<div class="line"> PRIVATE ftxui::screen</div>
<div class="line"> PRIVATE ftxui::dom</div>
<div class="line"> PRIVATE ftxui::component # Not needed for this example.</div>
<div class="line">)</div>
</div><!-- fragment --><h2><a class="anchor" id="autotoc_md126"></a>
Build</h2>
<div class="fragment"><div class="line">mkdir build &amp;&amp; cd build</div>
<div class="line">cmake ..</div>
<div class="line">make</div>
<div class="line">./main</div>
</div><!-- fragment --><h1><a class="anchor" id="modules"></a>
List of modules.</h1>
<p>The project is comprised of 3 modules:</p>
<ol type="1">
<li><b>ftxui/screen</b> defines a <code><a class="el" href="classftxui_1_1Screen.html" title="A rectangular grid of Pixel.">ftxui::Screen</a></code>, a grid of <code><a class="el" href="structftxui_1_1Pixel.html" title="A Unicode character and its associated style.">ftxui::Pixel</a></code>.</li>
<li><b>ftxui/dom</b> is the main module. It defines a hierarchical set of <code><a class="el" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">ftxui::Element</a></code>. An element draws something on the <code><a class="el" href="classftxui_1_1Screen.html" title="A rectangular grid of Pixel.">ftxui::Screen</a></code>. It is responsive to the size of its container.</li>
<li><b>ftxui/component</b> The module is required if your program needs to respond to user input. It defines a set of <code><a class="el" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">ftxui::Component</a></code>. These components can be utilized to navigate using the arrow keys <em>and/or</em> cursor. There are several builtin widgets like checkbox/inputbox/etc to interact with. You can combine them, or even define your own custom components.</li>
</ol>
<h1><a class="anchor" id="module-screen"></a>
screen</h1>
<p>This is the visual element of the program. It defines a <code><a class="el" href="classftxui_1_1Screen.html" title="A rectangular grid of Pixel.">ftxui::Screen</a></code>, which is a grid of <code><a class="el" href="structftxui_1_1Pixel.html" title="A Unicode character and its associated style.">ftxui::Pixel</a></code>. A Pixel represents a Unicode character and its associated style (bold, italic, colors, etc.). The screen can be printed as a string using <code><a class="el" href="classftxui_1_1Screen.html#a19c380b03cea21d7ac7325136a131ff0">ftxui::Screen::ToString()</a></code>. The following example highlights this process:</p>
<div class="fragment"><div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> main(<span class="keywordtype">void</span>) {</div>
<div class="line"> <span class="keyword">using namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a>;</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Fixed(32), Dimension::Fixed(10));</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span>&amp; pixel = screen.PixelAt(9,9);</div>
<div class="line"> pixel.character = U<span class="charliteral">&#39;A&#39;</span>;</div>
<div class="line"> pixel.bold = <span class="keyword">true</span>;</div>
<div class="line"> pixel.foreground_color = Color::Blue;</div>
<div class="line"> </div>
<div class="line"> std::cout &lt;&lt; screen.ToString();</div>
<div class="line"> <span class="keywordflow">return</span> EXIT_SUCCESS;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="module-dom"></a>
dom</h1>
<p>This module defines a hierarchical set of <code><a class="el" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">ftxui::Element</a></code>. An element manages the layout and can be responsive to the terminal dimension changes. Note the following example where this module is used to create a simple layout with a number of operators:</p>
<p><b>Example:</b> </p><div class="fragment"><div class="line"><span class="comment">// Define the document</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> document = vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;The window&quot;</span>) | bold | color(Color::Blue),</div>
<div class="line"> gauge(0.5)</div>
<div class="line"> text(&quot;The footer&quot;)</div>
<div class="line">});</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Add a border, by calling the `ftxui::border` decorator function.</span></div>
<div class="line">document = border(document);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Add another border, using the pipe operator.</span></div>
<div class="line">document = document | border.</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Add another border, using the |= operator.</span></div>
<div class="line">document |= border</div>
</div><!-- fragment --><p><b>List of elements</b></p>
<p>The list of all elements are included and can be accessed by including the corresponding header file: </p><div class="fragment"><div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span></div>
</div><!-- fragment --><div class="fragment"><div class="line"><span class="comment">// Copyright 2020 Arthur Sonzogni. All rights reserved.</span></div>
<div class="line"><span class="comment">// Use of this source code is governed by the MIT license that can be found in</span></div>
<div class="line"><span class="comment">// the LICENSE file.</span></div>
<div class="line"><span class="preprocessor">#ifndef FTXUI_DOM_ELEMENTS_HPP</span></div>
<div class="line"><span class="preprocessor">#define FTXUI_DOM_ELEMENTS_HPP</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &lt;functional&gt;</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="canvas_8hpp.html">ftxui/dom/canvas.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="direction_8hpp.html">ftxui/dom/direction.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="flexbox__config_8hpp.html">ftxui/dom/flexbox_config.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="linear__gradient_8hpp.html">ftxui/dom/linear_gradient.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="box_8hpp.html">ftxui/screen/box.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="terminal_8hpp.html">ftxui/screen/terminal.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="ref_8hpp.html">ftxui/util/ref.hpp</a>&quot;</span></div>
<div class="line"> </div>
<div class="line"><span class="keyword">namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a> {</div>
<div class="line"><span class="keyword">class </span>Node;</div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> = std::shared_ptr&lt;Node&gt;;</div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> = std::vector&lt;Element&gt;;</div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> = std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>)&gt;;</div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#ab07cb9a766f38fc867f8fe736ce2e6e3">GraphFunction</a> = std::function&lt;std::vector&lt;int&gt;(<span class="keywordtype">int</span>, <span class="keywordtype">int</span>)&gt;;</div>
<div class="line"> </div>
<div class="line"><span class="keyword">enum</span> <a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a> {</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9caf917d6c11c85b4ac32e30d1cc9da25eb">LIGHT</a>,</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca830310bdfd296d7cd00c59773579b892">DASHED</a>,</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca34cd68a92c52759ed9b545969a11c2da">HEAVY</a>,</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca33465d1d419b1074fb259ef444609e92">DOUBLE</a>,</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca655074b92b285adff7d18a45748bf493">ROUNDED</a>,</div>
<div class="line"> <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca2f0d18fc0d0fa4a6cd92dc328501874d">EMPTY</a>,</div>
<div class="line">};</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Pipe elements into decorator togethers.</span></div>
<div class="line"><span class="comment">// For instance the next lines are equivalents:</span></div>
<div class="line"><span class="comment">// -&gt; text(&quot;ftxui&quot;) | bold | underlined</span></div>
<div class="line"><span class="comment">// -&gt; underlined(bold(text(&quot;FTXUI&quot;)))</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">operator|</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>, <a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>&amp; <a class="code hl_function" href="namespaceftxui.html#ade35e69d695327db85be01c9787c39f8">operator|=</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>&amp;, <a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> <a class="code hl_function" href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">operator|</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>, <a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">operator|</a>(<a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a>, <a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a>);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Widget ---</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>(std::string <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a9f9f7485a45aa9d432726ca9845d1eac">vtext</a>(std::string <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a37c2b93daf557f68064bc9fbf93ebde0">separatorLight</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a81f2d3256c0cfbc70f820129286f08c6">separatorDashed</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af0649e89a9960f1c2703e48c1817645b">separatorHeavy</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#add376830fdb51b0bf52672ef17515989">separatorDouble</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1934703e56ab66f6f259b9f8da331f1b">separatorEmpty</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a13cb559cfc7e409b3f211f0bb35ea7fa">separatorStyled</a>(<a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(Pixel);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a97a10482d591aade2958da0f2f19b371">separatorCharacter</a>(std::string);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a50413065cee4757447b35c3a500667d3">separatorHSelector</a>(<span class="keywordtype">float</span> left,</div>
<div class="line"> <span class="keywordtype">float</span> right,</div>
<div class="line"> Color unselected_color,</div>
<div class="line"> Color selected_color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1a0211233bacd4eb4d31a8e3d58b5f48">separatorVSelector</a>(<span class="keywordtype">float</span> up,</div>
<div class="line"> <span class="keywordtype">float</span> down,</div>
<div class="line"> Color unselected_color,</div>
<div class="line"> Color selected_color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ae0b8041a60629fd790716038738c93ce">gauge</a>(<span class="keywordtype">float</span> progress);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a97898b9f77b3edd330eaef22fce7cf2b">gaugeLeft</a>(<span class="keywordtype">float</span> progress);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a333d781a44885ed4b5ea8444015b86f7">gaugeRight</a>(<span class="keywordtype">float</span> progress);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a6e9a97b66c14404a2b3f95f4dae414c2">gaugeUp</a>(<span class="keywordtype">float</span> progress);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#afe537f915cac5613261580bae3a8fe33">gaugeDown</a>(<span class="keywordtype">float</span> progress);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1265cc8a52448e1b98d7abe84a04681e">gaugeDirection</a>(<span class="keywordtype">float</span> progress, <a class="code hl_enumeration" href="namespaceftxui.html#a224b9163917ac32fc95a60d8c1eec3aa">Direction</a> direction);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ae8537acd423d47cf07e61bd774fb1098">border</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#aa074cdab57eeb47b99f1699bcc8addd8">borderLight</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a181c80f8ada12d1356f6bfa0ebb7219f">borderDashed</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a666c31419cc31cdadc9f8178ed63529e">borderHeavy</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a052b504344f3bc1ff86b3493cd934215">borderDouble</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a3cf2db223a5efaa370f0ca6bb405b80e">borderRounded</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af20f7d6fb275d109f0bdc01a2e4d3f3e">borderEmpty</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#abc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(<a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#abc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(<a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a>, Color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#abc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(Color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#aa97cfcfbe6df92dac085454395ec7b2f">borderWith</a>(<span class="keyword">const</span> Pixel&amp;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> title, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> content, <a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a> <a class="code hl_function" href="namespaceftxui.html#ae8537acd423d47cf07e61bd774fb1098">border</a> = <a class="code hl_enumvalue" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca655074b92b285adff7d18a45748bf493">ROUNDED</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a3b08e0030a0831d3ec3e2a505908273b">spinner</a>(<span class="keywordtype">int</span> charset_index, <span class="keywordtype">size_t</span> image_index);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">paragraph</a>(<span class="keyword">const</span> std::string&amp; <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#aa334a836eccc573e1137a1ba29d07d8a">paragraphAlignLeft</a>(<span class="keyword">const</span> std::string&amp; <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a28a69f06a88c89fe7a507e33ab486411">paragraphAlignRight</a>(<span class="keyword">const</span> std::string&amp; <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a6a105f6b0d07d7933379ff1ae9282fb8">paragraphAlignCenter</a>(<span class="keyword">const</span> std::string&amp; <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ae4de548aa67ab77cb345e4ddec6b248b">paragraphAlignJustify</a>(<span class="keyword">const</span> std::string&amp; <a class="code hl_function" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">text</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">graph</a>(<a class="code hl_typedef" href="namespaceftxui.html#ab07cb9a766f38fc867f8fe736ce2e6e3">GraphFunction</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a40451515a5b3049e7a1276cad8b9356c">emptyElement</a>();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a57d7bdf155e190de514a689abb4e9a35">canvas</a>(ConstRef&lt;Canvas&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a57d7bdf155e190de514a689abb4e9a35">canvas</a>(<span class="keywordtype">int</span> width, <span class="keywordtype">int</span> height, std::function&lt;<span class="keywordtype">void</span>(Canvas&amp;)&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a57d7bdf155e190de514a689abb4e9a35">canvas</a>(std::function&lt;<span class="keywordtype">void</span>(Canvas&amp;)&gt;);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// -- Decorator ---</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a353c769068e25303eb41fa2da565c604">bold</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ac6a3b77604739516e809369810896646">dim</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a8a8d190765de7bbd9e78f9e639c2a96d">italic</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a672456b8f2091b615a30ff755418b37b">inverted</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a5ad450c97c4d084b64ffb5b5ca942664">underlined</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a16d1b74107610750276499ddb3dde8da">underlinedDouble</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ad57613de5895e774218d91dea48d074b">blink</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a8594d70f0491def903370e86132fbf01">strikethrough</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#af61b489da39ca5e24b68e6e1a2b09c0d">color</a>(Color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a01d4c5aaf0447e862246849111782245">bgcolor</a>(Color);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#af61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<span class="keyword">const</span> LinearGradient&amp;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a01d4c5aaf0447e862246849111782245">bgcolor</a>(<span class="keyword">const</span> LinearGradient&amp;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af61b489da39ca5e24b68e6e1a2b09c0d">color</a>(Color, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a01d4c5aaf0447e862246849111782245">bgcolor</a>(Color, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<span class="keyword">const</span> LinearGradient&amp;, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a01d4c5aaf0447e862246849111782245">bgcolor</a>(<span class="keyword">const</span> LinearGradient&amp;, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a78447ba1ccb792963ad6d306f4ed1256">focusPosition</a>(<span class="keywordtype">int</span> x, <span class="keywordtype">int</span> y);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a13befad33cb4125e2143f2af3eddcc71">focusPositionRelative</a>(<span class="keywordtype">float</span> x, <span class="keywordtype">float</span> y);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#aca42bd6c44d8d366d5c1014330402086">automerge</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> child);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#ad0eac58eac9e6cd9a04879b20f8e123b">hyperlink</a>(std::string link);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ad0eac58eac9e6cd9a04879b20f8e123b">hyperlink</a>(std::string link, <a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> child);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#aa7e1317c76cefc5018503de4f6e09ea3">selectionStyleReset</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a925a73b7f0eb4b5bc11af23f4ca18019">selectionColor</a>(Color foreground);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a6c965b8f6450a50a938120b5f6ddea96">selectionBackgroundColor</a>(Color foreground);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a5d98498c51cfbc03f37e46d46ec8acf5">selectionForegroundColor</a>(Color foreground);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a4080865d947eea48cf695531f66a5160">selectionStyle</a>(std::function&lt;<span class="keywordtype">void</span>(Pixel&amp;)&gt; style);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Layout is</span></div>
<div class="line"><span class="comment">// Horizontal, Vertical or stacked set of elements.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#afd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a901ab1b6b2e0e8c295552168ab206441">dbox</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1b45cae54e7a6afcf338eb77a54e4df6">flexbox</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>, FlexboxConfig config = FlexboxConfig());</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#abcdf409d605edafd3191cd7ba47bcbd1">gridbox</a>(std::vector&lt;Elements&gt; lines);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a4c7a358e515dbd4bc1fba8c6f59fe911">hflow</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>); <span class="comment">// Helper: default flexbox with row direction.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a9a3c8f59366f1e93d79c0a9dd13e7621">vflow</a>(<a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a>); <span class="comment">// Helper: default flexbox with column direction.</span></div>
<div class="line"> </div>
<div class="line"><span class="comment">// -- Flexibility ---</span></div>
<div class="line"><span class="comment">// Define how to share the remaining space when not all of it is used inside a</span></div>
<div class="line"><span class="comment">// container.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a257acd2bd47bab7db879cca2c0e67e23">flex</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand/Minimize if possible/needed.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a81ed6b31f512e849247f13d249f6f20e">flex_grow</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand element if possible.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a4629196b5ffc280054d35f2a9977e829">flex_shrink</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Minimize element if needed.</span></div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a0dbba98e14f63f1dd5163cbdc4f42da8">xflex</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand/Minimize if possible/needed on X axis.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1618cb15307f29eb3d531e7b44c280d3">xflex_grow</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand element if possible on X axis.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a95275a9271934cf76e970c6650cc224d">xflex_shrink</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Minimize element if needed on X axis.</span></div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a42c7a33df6d890de30fc1ebb2d1b3ca6">yflex</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand/Minimize if possible/needed on Y axis.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a7eac3f709e905af8f583aed52093b7ce">yflex_grow</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Expand element if possible on Y axis.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af7d0757f5965aa579bccc125ff909256">yflex_shrink</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Minimize element if needed on Y axis.</span></div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a845b0ea50d51024aa4e050447b46e1dd">notflex</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>); <span class="comment">// Reset the flex attribute.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(); <span class="comment">// A blank expandable element.</span></div>
<div class="line"> </div>
<div class="line"><span class="comment">// -- Size override;</span></div>
<div class="line"><span class="keyword">enum</span> <a class="code hl_enumeration" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53">WidthOrHeight</a> { <a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">HEIGHT</a> };</div>
<div class="line"><span class="keyword">enum</span> <a class="code hl_enumeration" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926">Constraint</a> { <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5">LESS_THAN</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c">GREATER_THAN</a> };</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#a201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumeration" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53">WidthOrHeight</a>, <a class="code hl_enumeration" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926">Constraint</a>, <span class="keywordtype">int</span> value);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Frame ---</span></div>
<div class="line"><span class="comment">// A frame is a scrollable area. The internal area is potentially larger than</span></div>
<div class="line"><span class="comment">// the external one. The internal area is scrolled in order to make visible the</span></div>
<div class="line"><span class="comment">// focused element.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ad0d6a96f6e1fb6d67d9fa6323062a737">frame</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a2d0617c0912b732f059cf360ac951c49">xframe</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a7ea9d3ceb2a977955125c6e4a6072325">yframe</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#aa2d7d671f184f85e0f396f2610fa6c2e">focus</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a9e3e2988ed61a129d82d634ad66f7eb1">select</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> e); <span class="comment">// Deprecated - Alias for focus.</span></div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Cursor ---</span></div>
<div class="line"><span class="comment">// Those are similar to `focus`, but also change the shape of the cursor.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a509ef7e7f8913ea3de7efd45e3301ea1">focusCursorBlock</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#adda589914ba8fe863c905b6566557768">focusCursorBlockBlinking</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a4f89e72e7001064e3eb8189c8317e95b">focusCursorBar</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a085a7c997e7364c5a54e73c7b84145db">focusCursorBarBlinking</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a61e1fe02a18c2b18e31ccc9cd3943823">focusCursorUnderline</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a33637d59d1e52aa06dd2a94162adbfe9">focusCursorUnderlineBlinking</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Misc ---</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1974176e676afdb96d203e8e0f579219">vscroll_indicator</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a7f48136f949ccbde722dd93a6de4d0de">hscroll_indicator</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> <a class="code hl_function" href="namespaceftxui.html#aaff8245861617a3d9e846e99de582a63">reflect</a>(Box&amp; box);</div>
<div class="line"><span class="comment">// Before drawing the |element| clear the pixel below. This is useful in</span></div>
<div class="line"><span class="comment">// combinaison with dbox.</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a17a89519e6b87e12b1e5811a702f7847">clear_under</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> element);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// --- Util --------------------------------------------------------------------</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#af7d0d1e44c1a5424e42a5cddceacf7f7">hcenter</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#ad907a8a48bb9f9dfdb06402e9fc12316">vcenter</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a5b11656305fce8427b81daf1c35883f1">center</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a778e52afe28f1978f1f7ef065ed92d6d">align_right</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> <a class="code hl_function" href="namespaceftxui.html#a1bfd3885ac8b40dc82a1103725003c07">nothing</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> element);</div>
<div class="line"> </div>
<div class="line"><span class="keyword">namespace </span>Dimension {</div>
<div class="line">Dimensions <a class="code hl_function" href="namespaceftxui_1_1Dimension.html#aee138f0b60ddc07682a785f55eb5fda6">Fit</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>&amp;, <span class="keywordtype">bool</span> extend_beyond_screen = <span class="keyword">false</span>);</div>
<div class="line">} <span class="comment">// namespace Dimension</span></div>
<div class="line"> </div>
<div class="line">} <span class="comment">// namespace ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="comment">// Make container able to take any number of children as input.</span></div>
<div class="line"><span class="preprocessor">#include &quot;ftxui/dom/take_any_args.hpp&quot;</span></div>
<div class="line"> </div>
<div class="line"><span class="comment">// Include old definitions using wstring.</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="dom_2deprecated_8hpp.html">ftxui/dom/deprecated.hpp</a>&quot;</span></div>
<div class="line"><span class="preprocessor">#endif </span><span class="comment">// FTXUI_DOM_ELEMENTS_HPP</span></div>
<div class="ttc" id="abox_8hpp_html"><div class="ttname"><a href="box_8hpp.html">box.hpp</a></div></div>
<div class="ttc" id="acanvas_8hpp_html"><div class="ttname"><a href="canvas_8hpp.html">canvas.hpp</a></div></div>
<div class="ttc" id="acolor_8hpp_html"><div class="ttname"><a href="color_8hpp.html">color.hpp</a></div></div>
<div class="ttc" id="adirection_8hpp_html"><div class="ttname"><a href="direction_8hpp.html">direction.hpp</a></div></div>
<div class="ttc" id="adom_2deprecated_8hpp_html"><div class="ttname"><a href="dom_2deprecated_8hpp.html">deprecated.hpp</a></div></div>
<div class="ttc" id="aflexbox__config_8hpp_html"><div class="ttname"><a href="flexbox__config_8hpp.html">flexbox_config.hpp</a></div></div>
<div class="ttc" id="alinear__gradient_8hpp_html"><div class="ttname"><a href="linear__gradient_8hpp.html">linear_gradient.hpp</a></div></div>
<div class="ttc" id="anamespaceftxui_1_1Dimension_html_aee138f0b60ddc07682a785f55eb5fda6"><div class="ttname"><a href="namespaceftxui_1_1Dimension.html#aee138f0b60ddc07682a785f55eb5fda6">ftxui::Dimension::Fit</a></div><div class="ttdeci">Dimensions Fit(Element &amp;, bool extend_beyond_screen=false)</div></div>
<div class="ttc" id="anamespaceftxui_html_a01d4c5aaf0447e862246849111782245"><div class="ttname"><a href="namespaceftxui.html#a01d4c5aaf0447e862246849111782245">ftxui::bgcolor</a></div><div class="ttdeci">Decorator bgcolor(Color)</div><div class="ttdoc">Decorate using a background color.</div><div class="ttdef"><b>Definition</b> <a href="dom_2color_8cpp_source.html#l00124">color.cpp:124</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a03049def08fa7a5eaa4d5e897152bc1a"><div class="ttname"><a href="namespaceftxui.html#a03049def08fa7a5eaa4d5e897152bc1a">ftxui::window</a></div><div class="ttdeci">Element window(Element title, Element content, BorderStyle border=ROUNDED)</div><div class="ttdoc">Draw window with a title and a border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00507">border.cpp:507</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a04711c04f28aabfa0e5928a35baaec53"><div class="ttname"><a href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53">ftxui::WidthOrHeight</a></div><div class="ttdeci">WidthOrHeight</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00153">elements.hpp:153</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000"><div class="ttname"><a href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">ftxui::HEIGHT</a></div><div class="ttdeci">@ HEIGHT</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00153">elements.hpp:153</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522"><div class="ttname"><a href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">ftxui::WIDTH</a></div><div class="ttdeci">@ WIDTH</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00153">elements.hpp:153</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a052b504344f3bc1ff86b3493cd934215"><div class="ttname"><a href="namespaceftxui.html#a052b504344f3bc1ff86b3493cd934215">ftxui::borderDouble</a></div><div class="ttdeci">Element borderDouble(Element)</div><div class="ttdoc">Draw a double border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00405">border.cpp:405</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a085a7c997e7364c5a54e73c7b84145db"><div class="ttname"><a href="namespaceftxui.html#a085a7c997e7364c5a54e73c7b84145db">ftxui::focusCursorBarBlinking</a></div><div class="ttdeci">Element focusCursorBarBlinking(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a blinking bar.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00189">frame.cpp:189</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a0dbba98e14f63f1dd5163cbdc4f42da8"><div class="ttname"><a href="namespaceftxui.html#a0dbba98e14f63f1dd5163cbdc4f42da8">ftxui::xflex</a></div><div class="ttdeci">Element xflex(Element)</div><div class="ttdoc">Expand/Minimize if possible/needed on the X axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00129">flex.cpp:129</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1265cc8a52448e1b98d7abe84a04681e"><div class="ttname"><a href="namespaceftxui.html#a1265cc8a52448e1b98d7abe84a04681e">ftxui::gaugeDirection</a></div><div class="ttdeci">Element gaugeDirection(float progress, Direction direction)</div><div class="ttdoc">Draw a high definition progress bar progressing in specified direction.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00169">gauge.cpp:169</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a13befad33cb4125e2143f2af3eddcc71"><div class="ttname"><a href="namespaceftxui.html#a13befad33cb4125e2143f2af3eddcc71">ftxui::focusPositionRelative</a></div><div class="ttdeci">Decorator focusPositionRelative(float x, float y)</div><div class="ttdoc">Used inside a frame, this force the view to be scrolled toward a a given position....</div><div class="ttdef"><b>Definition</b> <a href="focus_8cpp_source.html#l00031">focus.cpp:31</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a13cb559cfc7e409b3f211f0bb35ea7fa"><div class="ttname"><a href="namespaceftxui.html#a13cb559cfc7e409b3f211f0bb35ea7fa">ftxui::separatorStyled</a></div><div class="ttdeci">Element separatorStyled(BorderStyle)</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00172">separator.cpp:172</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1618cb15307f29eb3d531e7b44c280d3"><div class="ttname"><a href="namespaceftxui.html#a1618cb15307f29eb3d531e7b44c280d3">ftxui::xflex_grow</a></div><div class="ttdeci">Element xflex_grow(Element)</div><div class="ttdoc">Expand if possible on the X axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00147">flex.cpp:147</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a164021903e9ac6f1357e4186582891e3"><div class="ttname"><a href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">ftxui::Decorator</a></div><div class="ttdeci">std::function&lt; Element(Element)&gt; Decorator</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00024">elements.hpp:24</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a16d1b74107610750276499ddb3dde8da"><div class="ttname"><a href="namespaceftxui.html#a16d1b74107610750276499ddb3dde8da">ftxui::underlinedDouble</a></div><div class="ttdeci">Element underlinedDouble(Element)</div><div class="ttdoc">Apply a underlinedDouble to text.</div><div class="ttdef"><b>Definition</b> <a href="underlined__double_8cpp_source.html#l00017">underlined_double.cpp:17</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a17a89519e6b87e12b1e5811a702f7847"><div class="ttname"><a href="namespaceftxui.html#a17a89519e6b87e12b1e5811a702f7847">ftxui::clear_under</a></div><div class="ttdeci">Element clear_under(Element element)</div><div class="ttdoc">Before drawing |child|, clear the pixels below. This is useful in.</div><div class="ttdef"><b>Definition</b> <a href="clear__under_8cpp_source.html#l00038">clear_under.cpp:38</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a181c80f8ada12d1356f6bfa0ebb7219f"><div class="ttname"><a href="namespaceftxui.html#a181c80f8ada12d1356f6bfa0ebb7219f">ftxui::borderDashed</a></div><div class="ttdeci">Element borderDashed(Element)</div><div class="ttdoc">Draw a dashed border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00300">border.cpp:300</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1934703e56ab66f6f259b9f8da331f1b"><div class="ttname"><a href="namespaceftxui.html#a1934703e56ab66f6f259b9f8da331f1b">ftxui::separatorEmpty</a></div><div class="ttdeci">Element separatorEmpty()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements, using the EMPTY style.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00357">separator.cpp:357</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1974176e676afdb96d203e8e0f579219"><div class="ttname"><a href="namespaceftxui.html#a1974176e676afdb96d203e8e0f579219">ftxui::vscroll_indicator</a></div><div class="ttdeci">Element vscroll_indicator(Element)</div><div class="ttdoc">Display a vertical scrollbar to the right. colors.</div><div class="ttdef"><b>Definition</b> <a href="scroll__indicator_8cpp_source.html#l00021">scroll_indicator.cpp:21</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1a0211233bacd4eb4d31a8e3d58b5f48"><div class="ttname"><a href="namespaceftxui.html#a1a0211233bacd4eb4d31a8e3d58b5f48">ftxui::separatorVSelector</a></div><div class="ttdeci">Element separatorVSelector(float up, float down, Color unselected_color, Color selected_color)</div><div class="ttdoc">Draw an vertical bar, with the area in between up/downcolored differently.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00512">separator.cpp:512</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a1b45cae54e7a6afcf338eb77a54e4df6"><div class="ttname"><a href="namespaceftxui.html#a1b45cae54e7a6afcf338eb77a54e4df6">ftxui::flexbox</a></div><div class="ttdeci">Element flexbox(Elements, FlexboxConfig config=FlexboxConfig())</div></div>
<div class="ttc" id="anamespaceftxui_html_a1bfd3885ac8b40dc82a1103725003c07"><div class="ttname"><a href="namespaceftxui.html#a1bfd3885ac8b40dc82a1103725003c07">ftxui::nothing</a></div><div class="ttdeci">Element nothing(Element element)</div><div class="ttdoc">A decoration doing absolutely nothing.</div><div class="ttdef"><b>Definition</b> <a href="dom_2util_8cpp_source.html#l00028">util.cpp:28</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a201220986fbdc539e42efe067985cbdb"><div class="ttname"><a href="namespaceftxui.html#a201220986fbdc539e42efe067985cbdb">ftxui::size</a></div><div class="ttdeci">Decorator size(WidthOrHeight, Constraint, int value)</div><div class="ttdoc">Apply a constraint on the size of an element.</div><div class="ttdef"><b>Definition</b> <a href="size_8cpp_source.html#l00089">size.cpp:89</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a224b9163917ac32fc95a60d8c1eec3aa"><div class="ttname"><a href="namespaceftxui.html#a224b9163917ac32fc95a60d8c1eec3aa">ftxui::Direction</a></div><div class="ttdeci">Direction</div><div class="ttdef"><b>Definition</b> <a href="direction_8hpp_source.html#l00008">direction.hpp:8</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a257acd2bd47bab7db879cca2c0e67e23"><div class="ttname"><a href="namespaceftxui.html#a257acd2bd47bab7db879cca2c0e67e23">ftxui::flex</a></div><div class="ttdeci">Element flex(Element)</div><div class="ttdoc">Make a child element to expand proportionally to the space left in a container.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00123">flex.cpp:123</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a28a69f06a88c89fe7a507e33ab486411"><div class="ttname"><a href="namespaceftxui.html#a28a69f06a88c89fe7a507e33ab486411">ftxui::paragraphAlignRight</a></div><div class="ttdeci">Element paragraphAlignRight(const std::string &amp;text)</div><div class="ttdoc">Return an element drawing the paragraph on multiple lines, aligned on the right.</div><div class="ttdef"><b>Definition</b> <a href="paragraph_8cpp_source.html#l00060">paragraph.cpp:60</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a2d0617c0912b732f059cf360ac951c49"><div class="ttname"><a href="namespaceftxui.html#a2d0617c0912b732f059cf360ac951c49">ftxui::xframe</a></div><div class="ttdeci">Element xframe(Element)</div><div class="ttdoc">Same as frame, but only on the x-axis.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00126">frame.cpp:126</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a333d781a44885ed4b5ea8444015b86f7"><div class="ttname"><a href="namespaceftxui.html#a333d781a44885ed4b5ea8444015b86f7">ftxui::gaugeRight</a></div><div class="ttdeci">Element gaugeRight(float progress)</div><div class="ttdoc">Draw a high definition progress bar progressing from left to right.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00191">gauge.cpp:191</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a33637d59d1e52aa06dd2a94162adbfe9"><div class="ttname"><a href="namespaceftxui.html#a33637d59d1e52aa06dd2a94162adbfe9">ftxui::focusCursorUnderlineBlinking</a></div><div class="ttdeci">Element focusCursorUnderlineBlinking(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a blinking underline.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00217">frame.cpp:217</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a353c769068e25303eb41fa2da565c604"><div class="ttname"><a href="namespaceftxui.html#a353c769068e25303eb41fa2da565c604">ftxui::bold</a></div><div class="ttdeci">Element bold(Element)</div><div class="ttdoc">Use a bold font, for elements with more emphasis.</div><div class="ttdef"><b>Definition</b> <a href="bold_8cpp_source.html#l00033">bold.cpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a37c2b93daf557f68064bc9fbf93ebde0"><div class="ttname"><a href="namespaceftxui.html#a37c2b93daf557f68064bc9fbf93ebde0">ftxui::separatorLight</a></div><div class="ttdeci">Element separatorLight()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements, using the LIGHT style.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00209">separator.cpp:209</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a3b08e0030a0831d3ec3e2a505908273b"><div class="ttname"><a href="namespaceftxui.html#a3b08e0030a0831d3ec3e2a505908273b">ftxui::spinner</a></div><div class="ttdeci">Element spinner(int charset_index, size_t image_index)</div><div class="ttdoc">Useful to represent the effect of time and/or events. This display an ASCII art &quot;video&quot;.</div><div class="ttdef"><b>Definition</b> <a href="spinner_8cpp_source.html#l00282">spinner.cpp:282</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a3cf2db223a5efaa370f0ca6bb405b80e"><div class="ttname"><a href="namespaceftxui.html#a3cf2db223a5efaa370f0ca6bb405b80e">ftxui::borderRounded</a></div><div class="ttdeci">Element borderRounded(Element)</div><div class="ttdoc">Draw a rounded border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00440">border.cpp:440</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a40451515a5b3049e7a1276cad8b9356c"><div class="ttname"><a href="namespaceftxui.html#a40451515a5b3049e7a1276cad8b9356c">ftxui::emptyElement</a></div><div class="ttdeci">Element emptyElement()</div><div class="ttdef"><b>Definition</b> <a href="dom_2util_8cpp_source.html#l00140">util.cpp:140</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a4080865d947eea48cf695531f66a5160"><div class="ttname"><a href="namespaceftxui.html#a4080865d947eea48cf695531f66a5160">ftxui::selectionStyle</a></div><div class="ttdeci">Decorator selectionStyle(std::function&lt; void(Pixel &amp;)&gt; style)</div><div class="ttdoc">Set the style of an element when selected.</div><div class="ttdef"><b>Definition</b> <a href="selection__style_8cpp_source.html#l00086">selection_style.cpp:86</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a42c7a33df6d890de30fc1ebb2d1b3ca6"><div class="ttname"><a href="namespaceftxui.html#a42c7a33df6d890de30fc1ebb2d1b3ca6">ftxui::yflex</a></div><div class="ttdeci">Element yflex(Element)</div><div class="ttdoc">Expand/Minimize if possible/needed on the Y axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00135">flex.cpp:135</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a4629196b5ffc280054d35f2a9977e829"><div class="ttname"><a href="namespaceftxui.html#a4629196b5ffc280054d35f2a9977e829">ftxui::flex_shrink</a></div><div class="ttdeci">Element flex_shrink(Element)</div><div class="ttdoc">Minimize if needed.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00159">flex.cpp:159</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a4c7a358e515dbd4bc1fba8c6f59fe911"><div class="ttname"><a href="namespaceftxui.html#a4c7a358e515dbd4bc1fba8c6f59fe911">ftxui::hflow</a></div><div class="ttdeci">Element hflow(Elements)</div></div>
<div class="ttc" id="anamespaceftxui_html_a4f89e72e7001064e3eb8189c8317e95b"><div class="ttname"><a href="namespaceftxui.html#a4f89e72e7001064e3eb8189c8317e95b">ftxui::focusCursorBar</a></div><div class="ttdeci">Element focusCursorBar(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a still block.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00175">frame.cpp:175</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a50413065cee4757447b35c3a500667d3"><div class="ttname"><a href="namespaceftxui.html#a50413065cee4757447b35c3a500667d3">ftxui::separatorHSelector</a></div><div class="ttdeci">Element separatorHSelector(float left, float right, Color unselected_color, Color selected_color)</div><div class="ttdoc">Draw an horizontal bar, with the area in between left/right colored differently.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00442">separator.cpp:442</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a509ef7e7f8913ea3de7efd45e3301ea1"><div class="ttname"><a href="namespaceftxui.html#a509ef7e7f8913ea3de7efd45e3301ea1">ftxui::focusCursorBlock</a></div><div class="ttdeci">Element focusCursorBlock(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a still block.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00147">frame.cpp:147</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a552ba6d33b3c9bec586b99fba4c243ac"><div class="ttname"><a href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">ftxui::hbox</a></div><div class="ttdeci">Element hbox(Elements)</div><div class="ttdoc">A container displaying elements horizontally one by one.</div><div class="ttdef"><b>Definition</b> <a href="hbox_8cpp_source.html#l00094">hbox.cpp:94</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a57d7bdf155e190de514a689abb4e9a35"><div class="ttname"><a href="namespaceftxui.html#a57d7bdf155e190de514a689abb4e9a35">ftxui::canvas</a></div><div class="ttdeci">Element canvas(ConstRef&lt; Canvas &gt;)</div><div class="ttdoc">Produce an element from a Canvas, or a reference to a Canvas.</div><div class="ttdef"><b>Definition</b> <a href="canvas_8cpp_source.html#l00891">canvas.cpp:891</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5ad450c97c4d084b64ffb5b5ca942664"><div class="ttname"><a href="namespaceftxui.html#a5ad450c97c4d084b64ffb5b5ca942664">ftxui::underlined</a></div><div class="ttdeci">Element underlined(Element)</div><div class="ttdoc">Make the underlined element to be underlined.</div><div class="ttdef"><b>Definition</b> <a href="underlined_8cpp_source.html#l00033">underlined.cpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5b11656305fce8427b81daf1c35883f1"><div class="ttname"><a href="namespaceftxui.html#a5b11656305fce8427b81daf1c35883f1">ftxui::center</a></div><div class="ttdeci">Element center(Element)</div><div class="ttdoc">Center an element horizontally and vertically.</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00031">composite_decorator.cpp:31</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5d4aa06ca6cc6a72e981bd5386f93f0a"><div class="ttname"><a href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">ftxui::Elements</a></div><div class="ttdeci">std::vector&lt; Element &gt; Elements</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00023">elements.hpp:23</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5d98498c51cfbc03f37e46d46ec8acf5"><div class="ttname"><a href="namespaceftxui.html#a5d98498c51cfbc03f37e46d46ec8acf5">ftxui::selectionForegroundColor</a></div><div class="ttdeci">Decorator selectionForegroundColor(Color foreground)</div><div class="ttdoc">Set the foreground color of an element when selected. Note that the style is applied on top of the ex...</div><div class="ttdef"><b>Definition</b> <a href="selection__style_8cpp_source.html#l00069">selection_style.cpp:69</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a61e1fe02a18c2b18e31ccc9cd3943823"><div class="ttname"><a href="namespaceftxui.html#a61e1fe02a18c2b18e31ccc9cd3943823">ftxui::focusCursorUnderline</a></div><div class="ttdeci">Element focusCursorUnderline(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a still underline.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00203">frame.cpp:203</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a65a2e15f64ae3bc205c485abc3a5aeb9"><div class="ttname"><a href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">ftxui::operator|</a></div><div class="ttdeci">Component operator|(Component component, ComponentDecorator decorator)</div><div class="ttdef"><b>Definition</b> <a href="component_2util_8cpp_source.html#l00012">util.cpp:12</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a666c31419cc31cdadc9f8178ed63529e"><div class="ttname"><a href="namespaceftxui.html#a666c31419cc31cdadc9f8178ed63529e">ftxui::borderHeavy</a></div><div class="ttdeci">Element borderHeavy(Element)</div><div class="ttdoc">Draw a heavy border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00370">border.cpp:370</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a672456b8f2091b615a30ff755418b37b"><div class="ttname"><a href="namespaceftxui.html#a672456b8f2091b615a30ff755418b37b">ftxui::inverted</a></div><div class="ttdeci">Element inverted(Element)</div><div class="ttdoc">Add a filter that will invert the foreground and the background colors.</div><div class="ttdef"><b>Definition</b> <a href="inverted_8cpp_source.html#l00034">inverted.cpp:34</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a6a105f6b0d07d7933379ff1ae9282fb8"><div class="ttname"><a href="namespaceftxui.html#a6a105f6b0d07d7933379ff1ae9282fb8">ftxui::paragraphAlignCenter</a></div><div class="ttdeci">Element paragraphAlignCenter(const std::string &amp;text)</div><div class="ttdoc">Return an element drawing the paragraph on multiple lines, aligned on the center.</div><div class="ttdef"><b>Definition</b> <a href="paragraph_8cpp_source.html#l00072">paragraph.cpp:72</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a6c965b8f6450a50a938120b5f6ddea96"><div class="ttname"><a href="namespaceftxui.html#a6c965b8f6450a50a938120b5f6ddea96">ftxui::selectionBackgroundColor</a></div><div class="ttdeci">Decorator selectionBackgroundColor(Color foreground)</div><div class="ttdoc">Set the background color of an element when selected. Note that the style is applied on top of the ex...</div><div class="ttdef"><b>Definition</b> <a href="selection__style_8cpp_source.html#l00061">selection_style.cpp:61</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a6e9a97b66c14404a2b3f95f4dae414c2"><div class="ttname"><a href="namespaceftxui.html#a6e9a97b66c14404a2b3f95f4dae414c2">ftxui::gaugeUp</a></div><div class="ttdeci">Element gaugeUp(float progress)</div><div class="ttdoc">Draw a high definition progress bar progressing from bottom to top.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00242">gauge.cpp:242</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a75baaa2734ed76a9f478beaafa87ae57"><div class="ttname"><a href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57">ftxui::text</a></div><div class="ttdeci">Element text(std::wstring text)</div><div class="ttdoc">Display a piece of unicode text.</div><div class="ttdef"><b>Definition</b> <a href="text_8cpp_source.html#l00160">text.cpp:160</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a778e52afe28f1978f1f7ef065ed92d6d"><div class="ttname"><a href="namespaceftxui.html#a778e52afe28f1978f1f7ef065ed92d6d">ftxui::align_right</a></div><div class="ttdeci">Element align_right(Element)</div><div class="ttdoc">Align an element on the right side.</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00039">composite_decorator.cpp:39</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a78447ba1ccb792963ad6d306f4ed1256"><div class="ttname"><a href="namespaceftxui.html#a78447ba1ccb792963ad6d306f4ed1256">ftxui::focusPosition</a></div><div class="ttdeci">Decorator focusPosition(int x, int y)</div><div class="ttdoc">Used inside a frame, this force the view to be scrolled toward a a given position....</div><div class="ttdef"><b>Definition</b> <a href="focus_8cpp_source.html#l00069">focus.cpp:69</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a7ea9d3ceb2a977955125c6e4a6072325"><div class="ttname"><a href="namespaceftxui.html#a7ea9d3ceb2a977955125c6e4a6072325">ftxui::yframe</a></div><div class="ttdeci">Element yframe(Element)</div><div class="ttdoc">Same as frame, but only on the y-axis.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00134">frame.cpp:134</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a7eac3f709e905af8f583aed52093b7ce"><div class="ttname"><a href="namespaceftxui.html#a7eac3f709e905af8f583aed52093b7ce">ftxui::yflex_grow</a></div><div class="ttdeci">Element yflex_grow(Element)</div><div class="ttdoc">Expand if possible on the Y axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00153">flex.cpp:153</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a7f48136f949ccbde722dd93a6de4d0de"><div class="ttname"><a href="namespaceftxui.html#a7f48136f949ccbde722dd93a6de4d0de">ftxui::hscroll_indicator</a></div><div class="ttdeci">Element hscroll_indicator(Element)</div><div class="ttdoc">Display an horizontal scrollbar to the bottom. colors.</div><div class="ttdef"><b>Definition</b> <a href="scroll__indicator_8cpp_source.html#l00076">scroll_indicator.cpp:76</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a81ed6b31f512e849247f13d249f6f20e"><div class="ttname"><a href="namespaceftxui.html#a81ed6b31f512e849247f13d249f6f20e">ftxui::flex_grow</a></div><div class="ttdeci">Element flex_grow(Element)</div><div class="ttdoc">Expand if possible.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00141">flex.cpp:141</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a81f2d3256c0cfbc70f820129286f08c6"><div class="ttname"><a href="namespaceftxui.html#a81f2d3256c0cfbc70f820129286f08c6">ftxui::separatorDashed</a></div><div class="ttdeci">Element separatorDashed()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements, using the DASHED style.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00246">separator.cpp:246</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a845b0ea50d51024aa4e050447b46e1dd"><div class="ttname"><a href="namespaceftxui.html#a845b0ea50d51024aa4e050447b46e1dd">ftxui::notflex</a></div><div class="ttdeci">Element notflex(Element)</div><div class="ttdoc">Make the element not flexible.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00177">flex.cpp:177</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a8594d70f0491def903370e86132fbf01"><div class="ttname"><a href="namespaceftxui.html#a8594d70f0491def903370e86132fbf01">ftxui::strikethrough</a></div><div class="ttdeci">Element strikethrough(Element)</div><div class="ttdoc">Apply a strikethrough to text.</div><div class="ttdef"><b>Definition</b> <a href="strikethrough_8cpp_source.html#l00017">strikethrough.cpp:17</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a8a8d190765de7bbd9e78f9e639c2a96d"><div class="ttname"><a href="namespaceftxui.html#a8a8d190765de7bbd9e78f9e639c2a96d">ftxui::italic</a></div><div class="ttdeci">Element italic(Element)</div><div class="ttdoc">Apply a underlinedDouble to text.</div><div class="ttdef"><b>Definition</b> <a href="italic_8cpp_source.html#l00017">italic.cpp:17</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a901ab1b6b2e0e8c295552168ab206441"><div class="ttname"><a href="namespaceftxui.html#a901ab1b6b2e0e8c295552168ab206441">ftxui::dbox</a></div><div class="ttdeci">Element dbox(Elements)</div><div class="ttdoc">Stack several element on top of each other.</div><div class="ttdef"><b>Definition</b> <a href="dbox_8cpp_source.html#l00108">dbox.cpp:108</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a925a73b7f0eb4b5bc11af23f4ca18019"><div class="ttname"><a href="namespaceftxui.html#a925a73b7f0eb4b5bc11af23f4ca18019">ftxui::selectionColor</a></div><div class="ttdeci">Decorator selectionColor(Color foreground)</div><div class="ttdoc">Set the color of an element when selected.</div><div class="ttdef"><b>Definition</b> <a href="selection__style_8cpp_source.html#l00078">selection_style.cpp:78</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a95275a9271934cf76e970c6650cc224d"><div class="ttname"><a href="namespaceftxui.html#a95275a9271934cf76e970c6650cc224d">ftxui::xflex_shrink</a></div><div class="ttdeci">Element xflex_shrink(Element)</div><div class="ttdoc">Minimize if needed on the X axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00165">flex.cpp:165</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a97898b9f77b3edd330eaef22fce7cf2b"><div class="ttname"><a href="namespaceftxui.html#a97898b9f77b3edd330eaef22fce7cf2b">ftxui::gaugeLeft</a></div><div class="ttdeci">Element gaugeLeft(float progress)</div><div class="ttdoc">Draw a high definition progress bar progressing from right to left.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00213">gauge.cpp:213</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a97a10482d591aade2958da0f2f19b371"><div class="ttname"><a href="namespaceftxui.html#a97a10482d591aade2958da0f2f19b371">ftxui::separatorCharacter</a></div><div class="ttdeci">Element separatorCharacter(std::string)</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00395">separator.cpp:395</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a9a3c8f59366f1e93d79c0a9dd13e7621"><div class="ttname"><a href="namespaceftxui.html#a9a3c8f59366f1e93d79c0a9dd13e7621">ftxui::vflow</a></div><div class="ttdeci">Element vflow(Elements)</div></div>
<div class="ttc" id="anamespaceftxui_html_a9e3e2988ed61a129d82d634ad66f7eb1"><div class="ttname"><a href="namespaceftxui.html#a9e3e2988ed61a129d82d634ad66f7eb1">ftxui::select</a></div><div class="ttdeci">Element select(Element e)</div><div class="ttdoc">Set the child to be the one focused among its siblings.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00108">frame.cpp:108</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a9f9f7485a45aa9d432726ca9845d1eac"><div class="ttname"><a href="namespaceftxui.html#a9f9f7485a45aa9d432726ca9845d1eac">ftxui::vtext</a></div><div class="ttdeci">Element vtext(std::wstring text)</div><div class="ttdoc">Display a piece unicode text vertically.</div><div class="ttdef"><b>Definition</b> <a href="text_8cpp_source.html#l00220">text.cpp:220</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa074cdab57eeb47b99f1699bcc8addd8"><div class="ttname"><a href="namespaceftxui.html#aa074cdab57eeb47b99f1699bcc8addd8">ftxui::borderLight</a></div><div class="ttdeci">Element borderLight(Element)</div><div class="ttdoc">Draw a light border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00335">border.cpp:335</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa2d7d671f184f85e0f396f2610fa6c2e"><div class="ttname"><a href="namespaceftxui.html#aa2d7d671f184f85e0f396f2610fa6c2e">ftxui::focus</a></div><div class="ttdeci">Element focus(Element)</div><div class="ttdoc">Set the child to be the one focused among its siblings.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00101">frame.cpp:101</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa334a836eccc573e1137a1ba29d07d8a"><div class="ttname"><a href="namespaceftxui.html#aa334a836eccc573e1137a1ba29d07d8a">ftxui::paragraphAlignLeft</a></div><div class="ttdeci">Element paragraphAlignLeft(const std::string &amp;text)</div><div class="ttdoc">Return an element drawing the paragraph on multiple lines, aligned on the left.</div><div class="ttdef"><b>Definition</b> <a href="paragraph_8cpp_source.html#l00049">paragraph.cpp:49</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa7e1317c76cefc5018503de4f6e09ea3"><div class="ttname"><a href="namespaceftxui.html#aa7e1317c76cefc5018503de4f6e09ea3">ftxui::selectionStyleReset</a></div><div class="ttdeci">Element selectionStyleReset(Element)</div><div class="ttdoc">Reset the selection style of an element.</div><div class="ttdef"><b>Definition</b> <a href="selection__style_8cpp_source.html#l00055">selection_style.cpp:55</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa97cfcfbe6df92dac085454395ec7b2f"><div class="ttname"><a href="namespaceftxui.html#aa97cfcfbe6df92dac085454395ec7b2f">ftxui::borderWith</a></div><div class="ttdeci">Decorator borderWith(const Pixel &amp;)</div><div class="ttdoc">Same as border but with a constant Pixel around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00234">border.cpp:234</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aaff8245861617a3d9e846e99de582a63"><div class="ttname"><a href="namespaceftxui.html#aaff8245861617a3d9e846e99de582a63">ftxui::reflect</a></div><div class="ttdeci">Decorator reflect(Box &amp;box)</div><div class="ttdef"><b>Definition</b> <a href="reflect_8cpp_source.html#l00043">reflect.cpp:43</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ab07cb9a766f38fc867f8fe736ce2e6e3"><div class="ttname"><a href="namespaceftxui.html#ab07cb9a766f38fc867f8fe736ce2e6e3">ftxui::GraphFunction</a></div><div class="ttdeci">std::function&lt; std::vector&lt; int &gt;(int, int)&gt; GraphFunction</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00025">elements.hpp:25</a></div></div>
<div class="ttc" id="anamespaceftxui_html_abc9db79957d4dd36deb8ca79938e4c41"><div class="ttname"><a href="namespaceftxui.html#abc9db79957d4dd36deb8ca79938e4c41">ftxui::borderStyled</a></div><div class="ttdeci">Decorator borderStyled(BorderStyle)</div><div class="ttdoc">Same as border but with different styles.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00243">border.cpp:243</a></div></div>
<div class="ttc" id="anamespaceftxui_html_abcdf409d605edafd3191cd7ba47bcbd1"><div class="ttname"><a href="namespaceftxui.html#abcdf409d605edafd3191cd7ba47bcbd1">ftxui::gridbox</a></div><div class="ttdeci">Element gridbox(std::vector&lt; Elements &gt; lines)</div><div class="ttdoc">A container displaying a grid of elements.</div><div class="ttdef"><b>Definition</b> <a href="gridbox_8cpp_source.html#l00173">gridbox.cpp:173</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ac1ef1cf6bf7cd0759ffa195071edb2a0"><div class="ttname"><a href="namespaceftxui.html#ac1ef1cf6bf7cd0759ffa195071edb2a0">ftxui::separator</a></div><div class="ttdeci">Element separator()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00134">separator.cpp:134</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ac2a9ed2d22ec3c8811b61f4a901ed367"><div class="ttname"><a href="namespaceftxui.html#ac2a9ed2d22ec3c8811b61f4a901ed367">ftxui::filler</a></div><div class="ttdeci">Element filler()</div><div class="ttdoc">An element that will take expand proportionally to the space left in a container.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00098">flex.cpp:98</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ac54cdd05db30871ce082a8fa650545da"><div class="ttname"><a href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">ftxui::paragraph</a></div><div class="ttdeci">Elements paragraph(std::wstring text)</div></div>
<div class="ttc" id="anamespaceftxui_html_ac6a3b77604739516e809369810896646"><div class="ttname"><a href="namespaceftxui.html#ac6a3b77604739516e809369810896646">ftxui::dim</a></div><div class="ttdeci">Element dim(Element)</div><div class="ttdoc">Use a light font, for elements with less emphasis.</div><div class="ttdef"><b>Definition</b> <a href="dim_8cpp_source.html#l00033">dim.cpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aca42bd6c44d8d366d5c1014330402086"><div class="ttname"><a href="namespaceftxui.html#aca42bd6c44d8d366d5c1014330402086">ftxui::automerge</a></div><div class="ttdeci">Element automerge(Element child)</div><div class="ttdoc">Enable character to be automatically merged with others nearby.</div><div class="ttdef"><b>Definition</b> <a href="automerge_8cpp_source.html#l00017">automerge.cpp:17</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ad0d6a96f6e1fb6d67d9fa6323062a737"><div class="ttname"><a href="namespaceftxui.html#ad0d6a96f6e1fb6d67d9fa6323062a737">ftxui::frame</a></div><div class="ttdeci">Element frame(Element)</div><div class="ttdoc">Allow an element to be displayed inside a 'virtual' area. It size can be larger than its container....</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00118">frame.cpp:118</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ad0eac58eac9e6cd9a04879b20f8e123b"><div class="ttname"><a href="namespaceftxui.html#ad0eac58eac9e6cd9a04879b20f8e123b">ftxui::hyperlink</a></div><div class="ttdeci">Decorator hyperlink(std::string link)</div><div class="ttdoc">Decorate using an hyperlink. The link will be opened when the user click on it. This is supported onl...</div><div class="ttdef"><b>Definition</b> <a href="hyperlink_8cpp_source.html#l00070">hyperlink.cpp:70</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ad57613de5895e774218d91dea48d074b"><div class="ttname"><a href="namespaceftxui.html#ad57613de5895e774218d91dea48d074b">ftxui::blink</a></div><div class="ttdeci">Element blink(Element)</div><div class="ttdoc">The text drawn alternates in between visible and hidden.</div><div class="ttdef"><b>Definition</b> <a href="blink_8cpp_source.html#l00033">blink.cpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ad907a8a48bb9f9dfdb06402e9fc12316"><div class="ttname"><a href="namespaceftxui.html#ad907a8a48bb9f9dfdb06402e9fc12316">ftxui::vcenter</a></div><div class="ttdeci">Element vcenter(Element)</div><div class="ttdoc">Center an element vertically.</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00023">composite_decorator.cpp:23</a></div></div>
<div class="ttc" id="anamespaceftxui_html_add376830fdb51b0bf52672ef17515989"><div class="ttname"><a href="namespaceftxui.html#add376830fdb51b0bf52672ef17515989">ftxui::separatorDouble</a></div><div class="ttdeci">Element separatorDouble()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements, using the DOUBLE style.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00320">separator.cpp:320</a></div></div>
<div class="ttc" id="anamespaceftxui_html_adda589914ba8fe863c905b6566557768"><div class="ttname"><a href="namespaceftxui.html#adda589914ba8fe863c905b6566557768">ftxui::focusCursorBlockBlinking</a></div><div class="ttdeci">Element focusCursorBlockBlinking(Element)</div><div class="ttdoc">Same as focus, but set the cursor shape to be a blinking block.</div><div class="ttdef"><b>Definition</b> <a href="frame_8cpp_source.html#l00161">frame.cpp:161</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ade35e69d695327db85be01c9787c39f8"><div class="ttname"><a href="namespaceftxui.html#ade35e69d695327db85be01c9787c39f8">ftxui::operator|=</a></div><div class="ttdeci">Component &amp; operator|=(Component &amp;component, ComponentDecorator decorator)</div><div class="ttdef"><b>Definition</b> <a href="component_2util_8cpp_source.html#l00022">util.cpp:22</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926">ftxui::Constraint</a></div><div class="ttdeci">Constraint</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00154">elements.hpp:154</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5">ftxui::LESS_THAN</a></div><div class="ttdeci">@ LESS_THAN</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00154">elements.hpp:154</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">ftxui::EQUAL</a></div><div class="ttdeci">@ EQUAL</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00154">elements.hpp:154</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c">ftxui::GREATER_THAN</a></div><div class="ttdeci">@ GREATER_THAN</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00154">elements.hpp:154</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae0b8041a60629fd790716038738c93ce"><div class="ttname"><a href="namespaceftxui.html#ae0b8041a60629fd790716038738c93ce">ftxui::gauge</a></div><div class="ttdeci">Element gauge(float progress)</div><div class="ttdoc">Draw a high definition progress bar.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00293">gauge.cpp:293</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae4de548aa67ab77cb345e4ddec6b248b"><div class="ttname"><a href="namespaceftxui.html#ae4de548aa67ab77cb345e4ddec6b248b">ftxui::paragraphAlignJustify</a></div><div class="ttdeci">Element paragraphAlignJustify(const std::string &amp;text)</div><div class="ttdoc">Return an element drawing the paragraph on multiple lines, aligned using a justified alignment....</div><div class="ttdef"><b>Definition</b> <a href="paragraph_8cpp_source.html#l00085">paragraph.cpp:85</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae78c2b2b147e65701493465f8e3f4d89"><div class="ttname"><a href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">ftxui::graph</a></div><div class="ttdeci">Element graph(GraphFunction)</div><div class="ttdoc">Draw a graph using a GraphFunction.</div><div class="ttdef"><b>Definition</b> <a href="graph_8cpp_source.html#l00071">graph.cpp:71</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae8537acd423d47cf07e61bd774fb1098"><div class="ttname"><a href="namespaceftxui.html#ae8537acd423d47cf07e61bd774fb1098">ftxui::border</a></div><div class="ttdeci">Element border(Element)</div><div class="ttdoc">Draw a border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00227">border.cpp:227</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af0649e89a9960f1c2703e48c1817645b"><div class="ttname"><a href="namespaceftxui.html#af0649e89a9960f1c2703e48c1817645b">ftxui::separatorHeavy</a></div><div class="ttdeci">Element separatorHeavy()</div><div class="ttdoc">Draw a vertical or horizontal separation in between two other elements, using the HEAVY style.</div><div class="ttdef"><b>Definition</b> <a href="separator_8cpp_source.html#l00283">separator.cpp:283</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af20f7d6fb275d109f0bdc01a2e4d3f3e"><div class="ttname"><a href="namespaceftxui.html#af20f7d6fb275d109f0bdc01a2e4d3f3e">ftxui::borderEmpty</a></div><div class="ttdeci">Element borderEmpty(Element)</div><div class="ttdoc">Draw an empty border around the element.</div><div class="ttdef"><b>Definition</b> <a href="border_8cpp_source.html#l00475">border.cpp:475</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af61b489da39ca5e24b68e6e1a2b09c0d"><div class="ttname"><a href="namespaceftxui.html#af61b489da39ca5e24b68e6e1a2b09c0d">ftxui::color</a></div><div class="ttdeci">Decorator color(Color)</div><div class="ttdoc">Decorate using a foreground color.</div><div class="ttdef"><b>Definition</b> <a href="dom_2color_8cpp_source.html#l00110">color.cpp:110</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af7d0757f5965aa579bccc125ff909256"><div class="ttname"><a href="namespaceftxui.html#af7d0757f5965aa579bccc125ff909256">ftxui::yflex_shrink</a></div><div class="ttdeci">Element yflex_shrink(Element)</div><div class="ttdoc">Minimize if needed on the Y axis.</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00171">flex.cpp:171</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af7d0d1e44c1a5424e42a5cddceacf7f7"><div class="ttname"><a href="namespaceftxui.html#af7d0d1e44c1a5424e42a5cddceacf7f7">ftxui::hcenter</a></div><div class="ttdeci">Element hcenter(Element)</div><div class="ttdoc">Center an element horizontally.</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00015">composite_decorator.cpp:15</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afd28058f0ccbbdf34691a85a7cc9b2e3"><div class="ttname"><a href="namespaceftxui.html#afd28058f0ccbbdf34691a85a7cc9b2e3">ftxui::vbox</a></div><div class="ttdeci">Element vbox(Elements)</div><div class="ttdoc">A container displaying elements vertically one by one.</div><div class="ttdef"><b>Definition</b> <a href="vbox_8cpp_source.html#l00096">vbox.cpp:96</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9c"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">ftxui::BorderStyle</a></div><div class="ttdeci">BorderStyle</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00027">elements.hpp:27</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9ca2f0d18fc0d0fa4a6cd92dc328501874d"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca2f0d18fc0d0fa4a6cd92dc328501874d">ftxui::EMPTY</a></div><div class="ttdeci">@ EMPTY</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00033">elements.hpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9ca33465d1d419b1074fb259ef444609e92"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca33465d1d419b1074fb259ef444609e92">ftxui::DOUBLE</a></div><div class="ttdeci">@ DOUBLE</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00031">elements.hpp:31</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9ca34cd68a92c52759ed9b545969a11c2da"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca34cd68a92c52759ed9b545969a11c2da">ftxui::HEAVY</a></div><div class="ttdeci">@ HEAVY</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00030">elements.hpp:30</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9ca655074b92b285adff7d18a45748bf493"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca655074b92b285adff7d18a45748bf493">ftxui::ROUNDED</a></div><div class="ttdeci">@ ROUNDED</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00032">elements.hpp:32</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9ca830310bdfd296d7cd00c59773579b892"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9ca830310bdfd296d7cd00c59773579b892">ftxui::DASHED</a></div><div class="ttdeci">@ DASHED</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00029">elements.hpp:29</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe3103dd0b8240c5443892484ef5af9caf917d6c11c85b4ac32e30d1cc9da25eb"><div class="ttname"><a href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9caf917d6c11c85b4ac32e30d1cc9da25eb">ftxui::LIGHT</a></div><div class="ttdeci">@ LIGHT</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00028">elements.hpp:28</a></div></div>
<div class="ttc" id="anamespaceftxui_html_afe537f915cac5613261580bae3a8fe33"><div class="ttname"><a href="namespaceftxui.html#afe537f915cac5613261580bae3a8fe33">ftxui::gaugeDown</a></div><div class="ttdeci">Element gaugeDown(float progress)</div><div class="ttdoc">Draw a high definition progress bar progressing from top to bottom.</div><div class="ttdef"><b>Definition</b> <a href="gauge_8cpp_source.html#l00271">gauge.cpp:271</a></div></div>
<div class="ttc" id="anode_8hpp_html"><div class="ttname"><a href="node_8hpp.html">node.hpp</a></div></div>
<div class="ttc" id="aref_8hpp_html"><div class="ttname"><a href="ref_8hpp.html">ref.hpp</a></div></div>
<div class="ttc" id="aterminal_8hpp_html"><div class="ttname"><a href="terminal_8hpp.html">terminal.hpp</a></div></div>
</div><!-- fragment --><h2><a class="anchor" id="dom-text"></a>
text</h2>
<p>The most simple widget. It displays a text. </p><div class="fragment"><div class="line">text(<span class="stringliteral">&quot;I am a piece of text&quot;</span>);</div>
</div><!-- fragment --> <div class="fragment"><div class="line">I am a piece of text.</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-vtext"></a>
vtext</h2>
<p>Identical to <code><a class="el" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57" title="Display a piece of unicode text.">ftxui::text</a></code>, but displayed vertically.</p>
<p>Code: </p><div class="fragment"><div class="line">vtext(<span class="stringliteral">&quot;HELLO&quot;</span>);</div>
</div><!-- fragment --><p>Terminal output: </p><div class="fragment"><div class="line">H</div>
<div class="line">E</div>
<div class="line">L</div>
<div class="line">L</div>
<div class="line">O</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-paragraph"></a>
paragraph </h2>
<p>Similar to <code><a class="el" href="namespaceftxui.html#a75baaa2734ed76a9f478beaafa87ae57" title="Display a piece of unicode text.">ftxui::text</a></code>, but the individual word are wrapped along multiple lines, depending on the width of its container.</p>
<p>Sample Code: </p><div class="fragment"><div class="line">paragraph(<span class="stringliteral">&quot;A very long text&quot;</span>)</div>
</div><!-- fragment --><p><img src="https://user-images.githubusercontent.com/4759106/147251370-983a06e7-6f41-4113-92b8-942f43d34d06.gif" alt="ezgif com-gif-maker (4)" class="inline"/></p>
<p>For a more detailed example refer to <a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2paragraph_8cpp-example.html">detailed example</a>. Paragraph also includes a number of other variants as shown below: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> paragraph(std::string text);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> paragraphAlignLeft(std::string text);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> paragraphAlignRight(std::string text);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> paragraphAlignCenter(std::string text);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> paragraphAlignJustify(std::string text);</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-border"></a>
border</h2>
<p>Adds a border around an element.</p>
<p>Code: </p><div class="fragment"><div class="line">border(text(<span class="stringliteral">&quot;The element&quot;</span>))</div>
</div><!-- fragment --><p>Terminal output: </p><div class="fragment"><div class="line">┌───────────┐</div>
<div class="line">│The element│</div>
<div class="line">└───────────┘</div>
</div><!-- fragment --><p>You can achieve the same behavior by using the pipe operator.</p>
<p>Code: </p><div class="fragment"><div class="line">text(<span class="stringliteral">&quot;The element&quot;</span>) | border</div>
</div><!-- fragment --><p>Border also comes in a variety of styles as shown below: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> border(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> borderLight(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> borderHeavy(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> borderDouble(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> borderRounded(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> borderEmpty(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> borderStyled(<a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> borderWith(<a class="code hl_struct" href="structftxui_1_1Pixel.html">Pixel</a>);</div>
<div class="ttc" id="astructftxui_1_1Pixel_html"><div class="ttname"><a href="structftxui_1_1Pixel.html">ftxui::Pixel</a></div><div class="ttdoc">A Unicode character and its associated style.</div><div class="ttdef"><b>Definition</b> <a href="pixel_8hpp_source.html#l00015">pixel.hpp:15</a></div></div>
</div><!-- fragment --><h2><a class="anchor" id="dom-window"></a>
window</h2>
<p>A <code><a class="el" href="namespaceftxui.html#a03049def08fa7a5eaa4d5e897152bc1a" title="Draw window with a title and a border around the element.">ftxui::window</a></code> is a <code><a class="el" href="namespaceftxui.html#ae8537acd423d47cf07e61bd774fb1098" title="Draw a border around the element.">ftxui::border</a></code>, but with an additional header. To add a window around an element, wrap it and specify a string as the header. Code: </p><div class="fragment"><div class="line">window(<span class="stringliteral">&quot;The window&quot;</span>, text(<span class="stringliteral">&quot;The element&quot;</span>))</div>
</div><!-- fragment --><p>Terminal output: </p><div class="fragment"><div class="line">┌The window─┐</div>
<div class="line">│The element│</div>
<div class="line">└───────────┘</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-separator"></a>
separator</h2>
<p>Displays a vertical/horizontal line to visually split the content of a container in two.</p>
<p>Code: </p><div class="fragment"><div class="line">border(</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;Left&quot;</span>), </div>
<div class="line"> separator(),</div>
<div class="line"> text(<span class="stringliteral">&quot;Right&quot;</span>)</div>
<div class="line"> })</div>
<div class="line">)</div>
</div><!-- fragment --><p>Terminal output: </p><div class="fragment"><div class="line">┌────┬─────┐</div>
<div class="line">│left│right│</div>
<div class="line">└────┴─────┘</div>
</div><!-- fragment --><p>Separators come in a variety of flavors as shown below: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separator(<span class="keywordtype">void</span>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorLight();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorHeavy();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorDouble();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorEmpty();</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorStyled(<a class="code hl_enumeration" href="namespaceftxui.html#afe3103dd0b8240c5443892484ef5af9c">BorderStyle</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separator(<a class="code hl_struct" href="structftxui_1_1Pixel.html">Pixel</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorCharacter(std::string);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorHSelector(<span class="keywordtype">float</span> left,</div>
<div class="line"> <span class="keywordtype">float</span> right,</div>
<div class="line"> <a class="code hl_class" href="classftxui_1_1Color.html">Color</a> background,</div>
<div class="line"> <a class="code hl_class" href="classftxui_1_1Color.html">Color</a> foreground);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> separatorVSelector(<span class="keywordtype">float</span> up,</div>
<div class="line"> <span class="keywordtype">float</span> down,</div>
<div class="line"> <a class="code hl_class" href="classftxui_1_1Color.html">Color</a> background,</div>
<div class="line"> <a class="code hl_class" href="classftxui_1_1Color.html">Color</a> foreground);</div>
<div class="ttc" id="aclassftxui_1_1Color_html"><div class="ttname"><a href="classftxui_1_1Color.html">ftxui::Color</a></div><div class="ttdoc">A class representing terminal colors.</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00020">color.hpp:20</a></div></div>
</div><!-- fragment --><h2><a class="anchor" id="dom-gauge"></a>
gauge</h2>
<p>It constitutes a gauge. It can be used to represent a progress bar.</p>
<p>Code: </p><div class="fragment"><div class="line">border(gauge(0.5))</div>
</div><!-- fragment --><p>Teminal output: </p><div class="fragment"><div class="line">┌────────────────────────────────────────────────────────────────────────────┐</div>
<div class="line">│██████████████████████████████████████ │</div>
<div class="line">└────────────────────────────────────────────────────────────────────────────┘</div>
</div><!-- fragment --><p>Gauges can be displayed in many orientations as shown below: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gauge(<span class="keywordtype">float</span> ratio);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gaugeLeft(<span class="keywordtype">float</span> ratio);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gaugeRight(<span class="keywordtype">float</span> ratio);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gaugeUp(<span class="keywordtype">float</span> ratio);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gaugeDown(<span class="keywordtype">float</span> ratio);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> gaugeDirection(<span class="keywordtype">float</span> ratio, GaugeDirection);</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-graph"></a>
graph</h2>
<p>
<script id="asciicast-223726" src="https://asciinema.org/a/223726.js" async></script>
</p>
<p>See: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> graph(<a class="code hl_typedef" href="namespaceftxui.html#ab07cb9a766f38fc867f8fe736ce2e6e3">GraphFunction</a>);</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-colors"></a>
Colors</h2>
<p>Most terminal consoles can display colored text and colored backgrounds. FTXUI supports every color palette: </p><div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> color(<a class="code hl_class" href="classftxui_1_1Color.html">Color</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> bgcolor(<a class="code hl_class" href="classftxui_1_1Color.html">Color</a>);</div>
</div><!-- fragment --><p>Color <a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2color_gallery_8cpp-example.html">gallery</a>: <img src="https://user-images.githubusercontent.com/4759106/147248595-04c7245a-5b85-4544-809d-a5984fc6f9e7.png" alt="image" class="inline"/></p>
<h3><a class="anchor" id="dom-colors-palette-16"></a>
Palette16 </h3>
<p>On most terminals the following colors are supported:</p><ul>
<li>Default</li>
<li>Black</li>
<li>GrayDark</li>
<li>GrayLight</li>
<li>White</li>
<li>Blue</li>
<li>BlueLight</li>
<li>Cyan</li>
<li>CyanLight</li>
<li>Green</li>
<li>GreenLight</li>
<li>Magenta</li>
<li>MagentaLight</li>
<li>Red</li>
<li>RedLight</li>
<li>Yellow</li>
<li>YellowLight</li>
</ul>
<p>Example use of the above colors using the pipe operator: </p><div class="fragment"><div class="line">text(<span class="stringliteral">&quot;Blue foreground&quot;</span>) | color(Color::Blue);</div>
<div class="line">text(<span class="stringliteral">&quot;Blue background&quot;</span>) | bgcolor(Color::Blue);</div>
<div class="line">text(<span class="stringliteral">&quot;Black on white&quot;</span>) | color(Color::Black) | bgcolor(Color::White);</div>
</div><!-- fragment --><h3><a class="anchor" id="dom-colors-palette-256"></a>
Palette256 </h3>
<p>On terminal supporting 256 colors.
<script id="asciicast-OAUc3n6QrkmrLt7XEEb8AzbLt" src="https://asciinema.org/a/OAUc3n6QrkmrLt7XEEb8AzbLt.js" async></script>
</p>
<div class="fragment"><div class="line">text(<span class="stringliteral">&quot;HotPink&quot;</span>) | color(Color::HotPink);</div>
</div><!-- fragment --><h3><a class="anchor" id="dom-colors-true-color"></a>
TrueColor</h3>
<p>On terminal supporting trueColor, you can directly use the 24bit RGB color space:</p>
<p>Use the constructors below to specify the <b>RGB</b> or <b>HSV</b> values for your color:</p>
<p>There are two constructors: </p><div class="fragment"><div class="line"><a class="code hl_function" href="classftxui_1_1Color.html#aacec69e0aa1063fbec2cc305e7b076dd">ftxui::Color::RGB</a>(uint8_t red, uint8_t green, uint8_t blue);</div>
<div class="line"><a class="code hl_function" href="classftxui_1_1Color.html#a1a119fd00beafc7d2aa5f94518e38fc5">ftxui::Color::HSV</a>(uint8_t hue, uint8_t saturation, uint8_t value);</div>
<div class="ttc" id="aclassftxui_1_1Color_html_a1a119fd00beafc7d2aa5f94518e38fc5"><div class="ttname"><a href="classftxui_1_1Color.html#a1a119fd00beafc7d2aa5f94518e38fc5">ftxui::Color::HSV</a></div><div class="ttdeci">static Color HSV(uint8_t hue, uint8_t saturation, uint8_t value)</div><div class="ttdoc">Build a Color from its HSV representation. https://en.wikipedia.org/wiki/HSL_and_HSV.</div><div class="ttdef"><b>Definition</b> <a href="screen_2color_8cpp_source.html#l00207">color.cpp:207</a></div></div>
<div class="ttc" id="aclassftxui_1_1Color_html_aacec69e0aa1063fbec2cc305e7b076dd"><div class="ttname"><a href="classftxui_1_1Color.html#aacec69e0aa1063fbec2cc305e7b076dd">ftxui::Color::RGB</a></div><div class="ttdeci">static Color RGB(uint8_t red, uint8_t green, uint8_t blue)</div><div class="ttdoc">Build a Color from its RGB representation. https://en.wikipedia.org/wiki/RGB_color_model.</div><div class="ttdef"><b>Definition</b> <a href="screen_2color_8cpp_source.html#l00153">color.cpp:153</a></div></div>
</div><!-- fragment --><p>
<script id="asciicast-dk5r8IcCH0aFIIgWG0keSEHMG" src="https://asciinema.org/a/dk5r8IcCH0aFIIgWG0keSEHMG.js" async></script>
<script id="asciicast-xwzzghmqcqzIuyLwCpQFEqbEu" src="https://asciinema.org/a/xwzzghmqcqzIuyLwCpQFEqbEu.js" async></script>
</p>
<h2><a class="anchor" id="dom-linear-gradient"></a>
LinearGradient</h2>
<p>FTXUI supports linear gradient. Either on the foreground or the background.</p>
<div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> color(<span class="keyword">const</span> <a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>&amp;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> bgcolor(<span class="keyword">const</span> <a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>&amp;);</div>
<div class="ttc" id="astructftxui_1_1LinearGradient_html"><div class="ttname"><a href="structftxui_1_1LinearGradient.html">ftxui::LinearGradient</a></div><div class="ttdoc">A class representing the settings for linear-gradient color effect.</div><div class="ttdef"><b>Definition</b> <a href="linear__gradient_8hpp_source.html#l00030">linear_gradient.hpp:30</a></div></div>
</div><!-- fragment --><p>A <code><a class="el" href="structftxui_1_1LinearGradient.html" title="A class representing the settings for linear-gradient color effect.">ftxui::LinearGradient</a></code> is defined by an angle in degree, and a list of color stops. </p><div class="fragment"><div class="line"><span class="keyword">auto</span> gradient = <a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>()</div>
<div class="line"> .<a class="code hl_function" href="structftxui_1_1LinearGradient.html#a251d447c54f49914a2cbf5dc16fc8b5b">Angle</a>(45)</div>
<div class="line"> .AddStop(0.0, Color::Red)</div>
<div class="line"> .AddStop(0.5, Color::Green)</div>
<div class="line"> .AddStop(1.0, Color::Blue);</div>
<div class="ttc" id="astructftxui_1_1LinearGradient_html_a251d447c54f49914a2cbf5dc16fc8b5b"><div class="ttname"><a href="structftxui_1_1LinearGradient.html#a251d447c54f49914a2cbf5dc16fc8b5b">ftxui::LinearGradient::Angle</a></div><div class="ttdeci">LinearGradient &amp; Angle(float angle)</div><div class="ttdoc">Set the angle of the gradient.</div><div class="ttdef"><b>Definition</b> <a href="linear__gradient_8cpp_source.html#l00216">linear_gradient.cpp:216</a></div></div>
</div><!-- fragment --><p>You can also use simplified constructors: </p><div class="fragment"><div class="line"><a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>(Color::Red, Color::Blue);</div>
</div><!-- fragment --> <div class="fragment"><div class="line"><a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>(45, Color::Red, Color::Blue);</div>
</div><!-- fragment --><p>See <a href="https://arthursonzogni.github.io/FTXUI/examples/?file=component/linear_gradient_gallery">demo</a>.</p>
<h2><a class="anchor" id="dom-style"></a>
Style</h2>
<p>In addition to colored text and colored backgrounds. Many terminals support text effects such as: <code>bold</code>, <code>italic</code>, <code>dim</code>, <code>underlined</code>, <code>inverted</code>, <code>blink</code>.</p>
<div class="fragment"><div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> bold(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> italic(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> dim(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> inverted(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> underlined(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> underlinedDouble(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> strikethrough(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> blink(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> color(<a class="code hl_class" href="classftxui_1_1Color.html">Color</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> bgcolor(<a class="code hl_class" href="classftxui_1_1Color.html">Color</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> colorgrad(<a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#a164021903e9ac6f1357e4186582891e3">Decorator</a> bgcolorgrad(<a class="code hl_struct" href="structftxui_1_1LinearGradient.html">LinearGradient</a>);</div>
</div><!-- fragment --><p><a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2style_gallery_8cpp-example.html">Example</a></p>
<p><img src="https://user-images.githubusercontent.com/4759106/147244118-380bf834-9e33-40df-9ff0-07c10f2598ef.png" alt="image" class="inline"/></p>
<p>To use these effects, simply wrap your elements with your desired effect: </p><div class="fragment"><div class="line">underlined(bold(text(<span class="stringliteral">&quot;This text is bold and underlined&quot;</span>)))</div>
</div><!-- fragment --><p>Alternatively, use the pipe operator to chain it on your element: </p><div class="fragment"><div class="line">text(<span class="stringliteral">&quot;This text is bold&quot;</span>) | bold | underlined</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-layout"></a>
Layout</h2>
<p>Enables elements to be arranged in the following ways:</p><ul>
<li><b>Horizontally</b> with <code><a class="el" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac" title="A container displaying elements horizontally one by one.">ftxui::hbox</a></code></li>
<li><b>Vertically</b> with <code><a class="el" href="namespaceftxui.html#afd28058f0ccbbdf34691a85a7cc9b2e3" title="A container displaying elements vertically one by one.">ftxui::vbox</a></code></li>
<li><b>Inside a grid</b> with <code><a class="el" href="namespaceftxui.html#abcdf409d605edafd3191cd7ba47bcbd1" title="A container displaying a grid of elements.">ftxui::gridbox</a></code></li>
<li><b>Wrapped along one direction</b> using the <code><a class="el" href="namespaceftxui.html#a1b45cae54e7a6afcf338eb77a54e4df6">ftxui::flexbox</a></code>.</li>
</ul>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2vbox_hbox_8cpp-example.html">Example</a> using <code><a class="el" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac" title="A container displaying elements horizontally one by one.">ftxui::hbox</a></code>, <code><a class="el" href="namespaceftxui.html#afd28058f0ccbbdf34691a85a7cc9b2e3" title="A container displaying elements vertically one by one.">ftxui::vbox</a></code> and <code><a class="el" href="namespaceftxui.html#ac2a9ed2d22ec3c8811b61f4a901ed367" title="An element that will take expand proportionally to the space left in a container.">ftxui::filler</a></code>.</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147242524-7103b5d9-1a92-4e2d-ac70-b3d6740061e3.png" alt="image" class="inline"/></p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2gridbox_8cpp-example.htmlp">Example</a> using <code><a class="el" href="namespaceftxui.html#abcdf409d605edafd3191cd7ba47bcbd1" title="A container displaying a grid of elements.">ftxui::gridbox</a></code>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147242972-0db1f2e9-0790-496f-86e6-ed2c604f7a73.png" alt="image" class="inline"/></p>
<p><a href="https://github.com/ArthurSonzogni/FTXUI/blob/master/examples/dom/hflow.cpp">Example</a> using flexbox:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147243064-780ac7cc-605b-475f-94b8-cf7c4aed03a5.png" alt="image" class="inline"/></p>
<p>Checkout this <a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2hflow_8cpp-example.html">example</a> and the associated <a href="https://arthursonzogni.github.io/FTXUI/examples/?file=component/flexbox">demo</a>.</p>
<p>Element can also become flexible using the the <code><a class="el" href="namespaceftxui.html#a257acd2bd47bab7db879cca2c0e67e23" title="Make a child element to expand proportionally to the space left in a container.">ftxui::flex</a></code> decorator.</p>
<p>Code: </p><div class="fragment"><div class="line">hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;left&quot;</span>) | border ,</div>
<div class="line"> text(<span class="stringliteral">&quot;middle&quot;</span>) | border | flex,</div>
<div class="line"> text(<span class="stringliteral">&quot;right&quot;</span>) | border,</div>
<div class="line">});</div>
</div><!-- fragment --><p> Terminal output: </p><div class="fragment"><div class="line">┌────┐┌─────────────────────────────────────────────────────┐┌─────┐</div>
<div class="line">│left││middle ││right│</div>
<div class="line">└────┘└─────────────────────────────────────────────────────┘└─────┘</div>
</div><!-- fragment --><p>Code: </p><div class="fragment"><div class="line">hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;left&quot;</span>) | border ,</div>
<div class="line"> text(<span class="stringliteral">&quot;middle&quot;</span>) | border | flex,</div>
<div class="line"> text(<span class="stringliteral">&quot;right&quot;</span>) | border | flex,</div>
<div class="line">});</div>
</div><!-- fragment --><p>Terminal output: </p><div class="fragment"><div class="line">┌────┐┌───────────────────────────────┐┌───────────────────────────────┐</div>
<div class="line">│left││middle ││right │</div>
<div class="line">└────┘└───────────────────────────────┘└───────────────────────────────┘</div>
</div><!-- fragment --><h2><a class="anchor" id="dom-table"></a>
Table</h2>
<p>Enables easy formatting of data into a neat table like visual form.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2dom_2table_8cpp-example.html">Code example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147250766-77d8ec9e-cf2b-486d-9866-1fd9f1bd2e6b.png" alt="image" class="inline"/></p>
<h2><a class="anchor" id="dom-canvas"></a>
Canvas</h2>
<p>See the API <a href="./canvas_8hpp_source.html">&lt;ftxui/dom/canvas.hpp&gt;</a></p>
<div class="fragment"><div class="line"><span class="keyword">auto</span> c = <a class="code hl_struct" href="structftxui_1_1Canvas.html">Canvas</a>(100, 100);</div>
<div class="line">c.DrawPointLine(10, 10, 80, 10, Color::Red);</div>
<div class="line"><span class="keyword">auto</span> element = canvas(c);</div>
<div class="ttc" id="astructftxui_1_1Canvas_html"><div class="ttname"><a href="structftxui_1_1Canvas.html">ftxui::Canvas</a></div><div class="ttdef"><b>Definition</b> <a href="canvas_8hpp_source.html#l00023">canvas.hpp:23</a></div></div>
</div><!-- fragment --><p>Drawing can be performed on a <code><a class="el" href="structftxui_1_1Canvas.html">ftxui::Canvas</a></code>, using braille, block, or simple characters:</p>
<p>Simple <a href="https://github.com/ArthurSonzogni/FTXUI/blob/master/examples/dom/canvas.cpp">example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147245843-76cc62fb-ccb4-421b-aacf-939f9afb42fe.png" alt="image" class="inline"/></p>
<p>Complex <a href="https://github.com/ArthurSonzogni/FTXUI/blob/master/examples/component/canvas_animated.cpp">example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147250538-783a8246-98e0-4a25-b032-3bd3710549d1.gif" alt="ezgif com-gif-maker (3)" class="inline"/> </p>
<h1><a class="anchor" id="module-component"></a>
component</h1>
<p>The <code>ftxui::component</code> module defines the logic that produces interactive components that respond to user events (keyboard, mouse, etc.).</p>
<p>A <code><a class="el" href="classftxui_1_1ScreenInteractive.html">ftxui::ScreenInteractive</a></code> defines a main loop that renders a component.</p>
<p>A <code><a class="el" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">ftxui::Component</a></code> is a shared pointer to a <code><a class="el" href="classftxui_1_1ComponentBase.html" title="It implement rendering itself as ftxui::Element. It implement keyboard navigation by responding to ft...">ftxui::ComponentBase</a></code>. The latter defines:</p><ul>
<li><code><a class="el" href="classftxui_1_1ComponentBase.html#a28d41d6113c5b29c8dd45846582b3299" title="Draw the component. Build a ftxui::Element to be drawn on the ftxui::Screen representing this ftxui::...">ftxui::ComponentBase::Render()</a></code>: How to render the interface.</li>
<li><code><a class="el" href="classftxui_1_1ComponentBase.html#ab84629a8fecad2e1cdd426b7ddc72277" title="Called in response to an event.">ftxui::ComponentBase::OnEvent()</a></code>: How to react to events.</li>
<li><code><a class="el" href="classftxui_1_1ComponentBase.html#a21f040bec9104e164bfa6c3ad45be3a1" title="Add a child. @param child The child to be attached.">ftxui::ComponentBase::Add()</a></code>: Construct a parent/child relationship between two components. The tree of component is used to define how to navigate using the keyboard.</li>
</ul>
<p><code><a class="el" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">ftxui::Element</a></code> are used to render a single frame.</p>
<p><code><a class="el" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">ftxui::Component</a></code> are used to render dynamic user interface, producing multiple frame, and updating its state on events.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2gallery_8cpp-example.html">Gallery</a> of multiple components. (<a href="https://arthursonzogni.github.io/FTXUI/examples/?file=component/gallery">demo</a>)</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147247330-b60beb9f-e665-48b4-81c0-4b01ee95bc66.png" alt="image" class="inline"/></p>
<p>All predefined components are available in <a href="./component_8hpp.html">"ftxui/dom/component.hpp"</a></p>
<div class="fragment"><div class="line"><span class="comment">// Copyright 2021 Arthur Sonzogni. All rights reserved.</span></div>
<div class="line"><span class="comment">// Use of this source code is governed by the MIT license that can be found in</span></div>
<div class="line"><span class="comment">// the LICENSE file.</span></div>
<div class="line"><span class="preprocessor">#ifndef FTXUI_COMPONENT_HPP</span></div>
<div class="line"><span class="preprocessor">#define FTXUI_COMPONENT_HPP</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &lt;functional&gt;</span> <span class="comment">// for function</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for make_shared, shared_ptr</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for forward</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="component__base_8hpp.html">ftxui/component/component_base.hpp</a>&quot;</span> <span class="comment">// for Component, Components</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="component__options_8hpp.html">ftxui/component/component_options.hpp</a>&quot;</span> <span class="comment">// for ButtonOption, CheckboxOption, MenuOption</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&quot;</span> <span class="comment">// for Element</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="ref_8hpp.html">ftxui/util/ref.hpp</a>&quot;</span> <span class="comment">// for ConstRef, Ref, ConstStringRef, ConstStringListRef, StringRef</span></div>
<div class="line"> </div>
<div class="line"><span class="keyword">namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a> {</div>
<div class="line"><span class="keyword">struct </span>ButtonOption;</div>
<div class="line"><span class="keyword">struct </span>CheckboxOption;</div>
<div class="line"><span class="keyword">struct </span>Event;</div>
<div class="line"><span class="keyword">struct </span>InputOption;</div>
<div class="line"><span class="keyword">struct </span>MenuOption;</div>
<div class="line"><span class="keyword">struct </span>RadioboxOption;</div>
<div class="line"><span class="keyword">struct </span>MenuEntryOption;</div>
<div class="line"> </div>
<div class="line"><span class="keyword">template</span> &lt;<span class="keyword">class </span>T, <span class="keyword">class</span>... Args&gt;</div>
<div class="line">std::shared_ptr&lt;T&gt; <a class="code hl_function" href="namespaceftxui.html#a2b8973dc71334f1d98e2e6f55de8b5ae">Make</a>(Args&amp;&amp;... args) {</div>
<div class="line"> <span class="keywordflow">return</span> std::make_shared&lt;T&gt;(std::forward&lt;Args&gt;(args)...);</div>
<div class="line">}</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Pipe operator to decorate components.</span></div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> = std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>)&gt;;</div>
<div class="line"><span class="keyword">using </span><a class="code hl_typedef" href="namespaceftxui.html#a2d5012891073dbf196bfada5f702f382">ElementDecorator</a> = std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>)&gt;;</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">operator|</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> component, <a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> decorator);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a65a2e15f64ae3bc205c485abc3a5aeb9">operator|</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> component, <a class="code hl_typedef" href="namespaceftxui.html#a2d5012891073dbf196bfada5f702f382">ElementDecorator</a> decorator);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>&amp; <a class="code hl_function" href="namespaceftxui.html#ade35e69d695327db85be01c9787c39f8">operator|=</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>&amp; component, <a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> decorator);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>&amp; <a class="code hl_function" href="namespaceftxui.html#ade35e69d695327db85be01c9787c39f8">operator|=</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>&amp; component, <a class="code hl_typedef" href="namespaceftxui.html#a2d5012891073dbf196bfada5f702f382">ElementDecorator</a> decorator);</div>
<div class="line"> </div>
<div class="line"><span class="keyword">namespace </span>Container {</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#a6471e39f5664d059144746c5801d37e6">Vertical</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#a6471e39f5664d059144746c5801d37e6">Vertical</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children, <span class="keywordtype">int</span>* selector);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#a01563bae9454fe64c0b29b0eb3755e68">Horizontal</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#a01563bae9454fe64c0b29b0eb3755e68">Horizontal</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children, <span class="keywordtype">int</span>* selector);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#aea9fe244eeeb420276bcc5760b46953d">Tab</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children, <span class="keywordtype">int</span>* selector);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui_1_1Container.html#aafd394665b0c231380a143b810339d8e">Stacked</a>(<a class="code hl_typedef" href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">Components</a> children);</div>
<div class="line">} <span class="comment">// namespace Container</span></div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a4e8295ec77dd31b0acc5063b134473e7">Button</a>(ButtonOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a4e8295ec77dd31b0acc5063b134473e7">Button</a>(ConstStringRef label,</div>
<div class="line"> std::function&lt;<span class="keywordtype">void</span>()&gt; on_click,</div>
<div class="line"> ButtonOption options = <a class="code hl_function" href="structftxui_1_1ButtonOption.html#a553fe18f102e8e62aec516d4d3213eac">ButtonOption::Simple</a>());</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#ae0d441d2c83740f187f62db566bbefcd">Checkbox</a>(CheckboxOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#ae0d441d2c83740f187f62db566bbefcd">Checkbox</a>(ConstStringRef label,</div>
<div class="line"> <span class="keywordtype">bool</span>* checked,</div>
<div class="line"> CheckboxOption options = <a class="code hl_function" href="structftxui_1_1CheckboxOption.html#a41b17a916980353033366c01b15d3cb1">CheckboxOption::Simple</a>());</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a7f285fcbc4dd0a0767b89a255fd062dc">Input</a>(InputOption options = {});</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a7f285fcbc4dd0a0767b89a255fd062dc">Input</a>(StringRef content, InputOption options = {});</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a7f285fcbc4dd0a0767b89a255fd062dc">Input</a>(StringRef content,</div>
<div class="line"> StringRef placeholder,</div>
<div class="line"> InputOption options = {});</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a27828fc39da10a18478ba84b1b162039">Menu</a>(MenuOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a27828fc39da10a18478ba84b1b162039">Menu</a>(ConstStringListRef entries,</div>
<div class="line"> <span class="keywordtype">int</span>* selected_,</div>
<div class="line"> MenuOption options = <a class="code hl_function" href="structftxui_1_1MenuOption.html#a617c59fdb94db99100d0e7a569c31d75">MenuOption::Vertical</a>());</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a2c0a27959e6a5d90109f6d4506e00f69">MenuEntry</a>(MenuEntryOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a2c0a27959e6a5d90109f6d4506e00f69">MenuEntry</a>(ConstStringRef label, MenuEntryOption options = {});</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a3e7a44f321fa910f07aef5879e67af95">Radiobox</a>(RadioboxOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a3e7a44f321fa910f07aef5879e67af95">Radiobox</a>(ConstStringListRef entries,</div>
<div class="line"> <span class="keywordtype">int</span>* selected_,</div>
<div class="line"> RadioboxOption options = {});</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa22bddff4aeed66e20f30d0715596999">Dropdown</a>(ConstStringListRef entries, <span class="keywordtype">int</span>* selected);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa22bddff4aeed66e20f30d0715596999">Dropdown</a>(DropdownOption options);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a3537fccac66b07cd792874c9a6086811">Toggle</a>(ConstStringListRef entries, <span class="keywordtype">int</span>* selected);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// General slider constructor:</span></div>
<div class="line"><span class="keyword">template</span> &lt;<span class="keyword">typename</span> T&gt;</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727">Slider</a>(SliderOption&lt;T&gt; options);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Shorthand without the `SliderOption` constructor:</span></div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727">Slider</a>(ConstStringRef label,</div>
<div class="line"> Ref&lt;int&gt; value,</div>
<div class="line"> ConstRef&lt;int&gt; min = 0,</div>
<div class="line"> ConstRef&lt;int&gt; max = 100,</div>
<div class="line"> ConstRef&lt;int&gt; increment = 5);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727">Slider</a>(ConstStringRef label,</div>
<div class="line"> Ref&lt;float&gt; value,</div>
<div class="line"> ConstRef&lt;float&gt; min = 0.f,</div>
<div class="line"> ConstRef&lt;float&gt; max = 100.f,</div>
<div class="line"> ConstRef&lt;float&gt; increment = 5.f);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727">Slider</a>(ConstStringRef label,</div>
<div class="line"> Ref&lt;long&gt; value,</div>
<div class="line"> ConstRef&lt;long&gt; min = 0L,</div>
<div class="line"> ConstRef&lt;long&gt; max = 100L,</div>
<div class="line"> ConstRef&lt;long&gt; increment = 5L);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a5ce41caeafc35dedc5c7da5347386e80">ResizableSplit</a>(ResizableSplitOption options);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#ae2205fc172615b43e1e3307bb614be4c">ResizableSplitLeft</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> main, <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> back, <span class="keywordtype">int</span>* main_size);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a9030d0beb64f653603cab382b02750a8">ResizableSplitRight</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> main, <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> back, <span class="keywordtype">int</span>* main_size);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a238b4b650aca14716b82b2198695e008">ResizableSplitTop</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> main, <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> back, <span class="keywordtype">int</span>* main_size);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#acb75e6e61a021829893f7b57aeb7e3a2">ResizableSplitBottom</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> main, <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> back, <span class="keywordtype">int</span>* main_size);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361">Renderer</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> child, std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>()&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361">Renderer</a>(std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>()&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361">Renderer</a>(std::function&lt;<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a>(<span class="keywordtype">bool</span> <span class="comment">/* focused */</span>)&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361">Renderer</a>(<a class="code hl_typedef" href="namespaceftxui.html#a2d5012891073dbf196bfada5f702f382">ElementDecorator</a>);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">CatchEvent</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> child, std::function&lt;<span class="keywordtype">bool</span>(Event)&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">CatchEvent</a>(std::function&lt;<span class="keywordtype">bool</span>(Event)&gt; on_event);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4">Maybe</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>, <span class="keyword">const</span> <span class="keywordtype">bool</span>* show);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4">Maybe</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a>, std::function&lt;<span class="keywordtype">bool</span>()&gt;);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4">Maybe</a>(<span class="keyword">const</span> <span class="keywordtype">bool</span>* show);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4">Maybe</a>(std::function&lt;<span class="keywordtype">bool</span>()&gt;);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a5185342fbba215496cb8a6805f36089c">Modal</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> main, <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> modal, <span class="keyword">const</span> <span class="keywordtype">bool</span>* show_modal);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a5185342fbba215496cb8a6805f36089c">Modal</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> modal, <span class="keyword">const</span> <span class="keywordtype">bool</span>* show_modal);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#af75c40d83714ba0748a68d11ff5e25dd">Collapsible</a>(ConstStringRef label,</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> child,</div>
<div class="line"> Ref&lt;bool&gt; show = <span class="keyword">false</span>);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> component, <span class="keywordtype">bool</span>* hover);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> component,</div>
<div class="line"> std::function&lt;<span class="keywordtype">void</span>()&gt; on_enter,</div>
<div class="line"> std::function&lt;<span class="keywordtype">void</span>()&gt; on_leave);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(<a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> component, <span class="comment">//</span></div>
<div class="line"> std::function&lt;<span class="keywordtype">void</span>(<span class="keywordtype">bool</span>)&gt; on_change);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(<span class="keywordtype">bool</span>* hover);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(std::function&lt;<span class="keywordtype">void</span>()&gt; on_enter,</div>
<div class="line"> std::function&lt;<span class="keywordtype">void</span>()&gt; on_leave);</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ComponentDecorator</a> <a class="code hl_function" href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">Hoverable</a>(std::function&lt;<span class="keywordtype">void</span>(<span class="keywordtype">bool</span>)&gt; on_change);</div>
<div class="line"> </div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_function" href="namespaceftxui.html#a638693abef9289912f5fa39606390b20">Window</a>(WindowOptions option);</div>
<div class="line"> </div>
<div class="line">} <span class="comment">// namespace ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#endif </span><span class="comment">/* end of include guard: FTXUI_COMPONENT_HPP */</span><span class="preprocessor"></span></div>
<div class="ttc" id="acomponent__base_8hpp_html"><div class="ttname"><a href="component__base_8hpp.html">component_base.hpp</a></div></div>
<div class="ttc" id="acomponent__options_8hpp_html"><div class="ttname"><a href="component__options_8hpp.html">component_options.hpp</a></div></div>
<div class="ttc" id="anamespaceftxui_1_1Container_html_a01563bae9454fe64c0b29b0eb3755e68"><div class="ttname"><a href="namespaceftxui_1_1Container.html#a01563bae9454fe64c0b29b0eb3755e68">ftxui::Container::Horizontal</a></div><div class="ttdeci">Component Horizontal(Components children)</div><div class="ttdoc">A list of components, drawn one by one horizontally and navigated horizontally using left/right arrow...</div><div class="ttdef"><b>Definition</b> <a href="container_8cpp_source.html#l00360">container.cpp:360</a></div></div>
<div class="ttc" id="anamespaceftxui_1_1Container_html_a6471e39f5664d059144746c5801d37e6"><div class="ttname"><a href="namespaceftxui_1_1Container.html#a6471e39f5664d059144746c5801d37e6">ftxui::Container::Vertical</a></div><div class="ttdeci">Component Vertical(Components children)</div><div class="ttdoc">A list of components, drawn one by one vertically and navigated vertically using up/down arrow key or...</div><div class="ttdef"><b>Definition</b> <a href="container_8cpp_source.html#l00317">container.cpp:317</a></div></div>
<div class="ttc" id="anamespaceftxui_1_1Container_html_aafd394665b0c231380a143b810339d8e"><div class="ttname"><a href="namespaceftxui_1_1Container.html#aafd394665b0c231380a143b810339d8e">ftxui::Container::Stacked</a></div><div class="ttdeci">Component Stacked(Components children)</div><div class="ttdoc">A list of components to be stacked on top of each other. Events are propagated to the first component...</div><div class="ttdef"><b>Definition</b> <a href="container_8cpp_source.html#l00432">container.cpp:432</a></div></div>
<div class="ttc" id="anamespaceftxui_1_1Container_html_aea9fe244eeeb420276bcc5760b46953d"><div class="ttname"><a href="namespaceftxui_1_1Container.html#aea9fe244eeeb420276bcc5760b46953d">ftxui::Container::Tab</a></div><div class="ttdeci">Component Tab(Components children, int *selector)</div><div class="ttdoc">A list of components, where only one is drawn and interacted with at a time. The |selector| gives the...</div><div class="ttdef"><b>Definition</b> <a href="container_8cpp_source.html#l00405">container.cpp:405</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a20b66a70c1cd4ff3f0ff571a4507d2b4"><div class="ttname"><a href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4">ftxui::Maybe</a></div><div class="ttdeci">Component Maybe(Component, const bool *show)</div><div class="ttdoc">Decorate a component |child|. It is shown only when |show| is true.</div><div class="ttdef"><b>Definition</b> <a href="maybe_8cpp_source.html#l00074">maybe.cpp:74</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a238b4b650aca14716b82b2198695e008"><div class="ttname"><a href="namespaceftxui.html#a238b4b650aca14716b82b2198695e008">ftxui::ResizableSplitTop</a></div><div class="ttdeci">Component ResizableSplitTop(Component main, Component back, int *main_size)</div><div class="ttdoc">An vertical split in between two components, configurable using the mouse.</div><div class="ttdef"><b>Definition</b> <a href="resizable__split_8cpp_source.html#l00283">resizable_split.cpp:283</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a27828fc39da10a18478ba84b1b162039"><div class="ttname"><a href="namespaceftxui.html#a27828fc39da10a18478ba84b1b162039">ftxui::Menu</a></div><div class="ttdeci">Component Menu(MenuOption options)</div><div class="ttdoc">A list of text. The focused element is selected.</div><div class="ttdef"><b>Definition</b> <a href="menu_8cpp_source.html#l00512">menu.cpp:512</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a2b8973dc71334f1d98e2e6f55de8b5ae"><div class="ttname"><a href="namespaceftxui.html#a2b8973dc71334f1d98e2e6f55de8b5ae">ftxui::Make</a></div><div class="ttdeci">std::shared_ptr&lt; T &gt; Make(Args &amp;&amp;... args)</div><div class="ttdef"><b>Definition</b> <a href="component_8hpp_source.html#l00026">component.hpp:26</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a2c0a27959e6a5d90109f6d4506e00f69"><div class="ttname"><a href="namespaceftxui.html#a2c0a27959e6a5d90109f6d4506e00f69">ftxui::MenuEntry</a></div><div class="ttdeci">Component MenuEntry(MenuEntryOption options)</div><div class="ttdoc">A specific menu entry. They can be put into a Container::Vertical to form a menu.</div><div class="ttdef"><b>Definition</b> <a href="menu_8cpp_source.html#l00614">menu.cpp:614</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a2d5012891073dbf196bfada5f702f382"><div class="ttname"><a href="namespaceftxui.html#a2d5012891073dbf196bfada5f702f382">ftxui::ElementDecorator</a></div><div class="ttdeci">std::function&lt; Element(Element)&gt; ElementDecorator</div><div class="ttdef"><b>Definition</b> <a href="component_8hpp_source.html#l00032">component.hpp:32</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a3537fccac66b07cd792874c9a6086811"><div class="ttname"><a href="namespaceftxui.html#a3537fccac66b07cd792874c9a6086811">ftxui::Toggle</a></div><div class="ttdeci">Component Toggle(ConstStringListRef entries, int *selected)</div><div class="ttdoc">An horizontal list of elements. The user can navigate through them.</div><div class="ttdef"><b>Definition</b> <a href="menu_8cpp_source.html#l00554">menu.cpp:554</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a3d4ccad0c8a07d5b0cb4b2e690ffc90c"><div class="ttname"><a href="namespaceftxui.html#a3d4ccad0c8a07d5b0cb4b2e690ffc90c">ftxui::Components</a></div><div class="ttdeci">std::vector&lt; Component &gt; Components</div><div class="ttdef"><b>Definition</b> <a href="component__base_8hpp_source.html#l00025">component_base.hpp:25</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a3e7a44f321fa910f07aef5879e67af95"><div class="ttname"><a href="namespaceftxui.html#a3e7a44f321fa910f07aef5879e67af95">ftxui::Radiobox</a></div><div class="ttdeci">Component Radiobox(RadioboxOption options)</div><div class="ttdoc">A list of element, where only one can be selected.</div><div class="ttdef"><b>Definition</b> <a href="radiobox_8cpp_source.html#l00204">radiobox.cpp:204</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a4e8295ec77dd31b0acc5063b134473e7"><div class="ttname"><a href="namespaceftxui.html#a4e8295ec77dd31b0acc5063b134473e7">ftxui::Button</a></div><div class="ttdeci">Component Button(ButtonOption options)</div><div class="ttdoc">Draw a button. Execute a function when clicked.</div><div class="ttdef"><b>Definition</b> <a href="button_8cpp_source.html#l00176">button.cpp:176</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5185342fbba215496cb8a6805f36089c"><div class="ttname"><a href="namespaceftxui.html#a5185342fbba215496cb8a6805f36089c">ftxui::Modal</a></div><div class="ttdeci">Component Modal(Component main, Component modal, const bool *show_modal)</div><div class="ttdef"><b>Definition</b> <a href="modal_8cpp_source.html#l00018">modal.cpp:18</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a533e883e2aeea28de2b60564fcaf0361"><div class="ttname"><a href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361">ftxui::Renderer</a></div><div class="ttdeci">Component Renderer(Component child, std::function&lt; Element()&gt;)</div><div class="ttdoc">Return a new Component, similar to |child|, but using |render| as the Component::Render() event.</div><div class="ttdef"><b>Definition</b> <a href="renderer_8cpp_source.html#l00061">renderer.cpp:61</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a562d984d3830d63285643565cd55d16f"><div class="ttname"><a href="namespaceftxui.html#a562d984d3830d63285643565cd55d16f">ftxui::Hoverable</a></div><div class="ttdeci">Component Hoverable(Component component, bool *hover)</div><div class="ttdoc">Wrap a component. Gives the ability to know if it is hovered by the mouse.</div><div class="ttdef"><b>Definition</b> <a href="hoverable_8cpp_source.html#l00043">hoverable.cpp:43</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5ce41caeafc35dedc5c7da5347386e80"><div class="ttname"><a href="namespaceftxui.html#a5ce41caeafc35dedc5c7da5347386e80">ftxui::ResizableSplit</a></div><div class="ttdeci">Component ResizableSplit(ResizableSplitOption options)</div><div class="ttdoc">A split in between two components.</div><div class="ttdef"><b>Definition</b> <a href="resizable__split_8cpp_source.html#l00186">resizable_split.cpp:186</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a638693abef9289912f5fa39606390b20"><div class="ttname"><a href="namespaceftxui.html#a638693abef9289912f5fa39606390b20">ftxui::Window</a></div><div class="ttdeci">Component Window(WindowOptions option)</div><div class="ttdoc">A draggeable / resizeable window. To use multiple of them, they must be stacked using Container::Stac...</div><div class="ttdef"><b>Definition</b> <a href="window_8cpp_source.html#l00312">window.cpp:312</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a7f285fcbc4dd0a0767b89a255fd062dc"><div class="ttname"><a href="namespaceftxui.html#a7f285fcbc4dd0a0767b89a255fd062dc">ftxui::Input</a></div><div class="ttdeci">Component Input(InputOption options={})</div><div class="ttdoc">An input box for editing text.</div><div class="ttdef"><b>Definition</b> <a href="input_8cpp_source.html#l00571">input.cpp:571</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a9030d0beb64f653603cab382b02750a8"><div class="ttname"><a href="namespaceftxui.html#a9030d0beb64f653603cab382b02750a8">ftxui::ResizableSplitRight</a></div><div class="ttdeci">Component ResizableSplitRight(Component main, Component back, int *main_size)</div><div class="ttdoc">An horizontal split in between two components, configurable using the mouse.</div><div class="ttdef"><b>Definition</b> <a href="resizable__split_8cpp_source.html#l00249">resizable_split.cpp:249</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa22bddff4aeed66e20f30d0715596999"><div class="ttname"><a href="namespaceftxui.html#aa22bddff4aeed66e20f30d0715596999">ftxui::Dropdown</a></div><div class="ttdeci">Component Dropdown(ConstStringListRef entries, int *selected)</div><div class="ttdoc">A dropdown menu.</div><div class="ttdef"><b>Definition</b> <a href="dropdown_8cpp_source.html#l00022">dropdown.cpp:22</a></div></div>
<div class="ttc" id="anamespaceftxui_html_aa3558d992a72679e5e9c9c7b67abd727"><div class="ttname"><a href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727">ftxui::Slider</a></div><div class="ttdeci">Component Slider(SliderOption&lt; T &gt; options)</div><div class="ttdoc">A slider in any direction.</div><div class="ttdef"><b>Definition</b> <a href="slider_8cpp_source.html#l00346">slider.cpp:346</a></div></div>
<div class="ttc" id="anamespaceftxui_html_acb75e6e61a021829893f7b57aeb7e3a2"><div class="ttname"><a href="namespaceftxui.html#acb75e6e61a021829893f7b57aeb7e3a2">ftxui::ResizableSplitBottom</a></div><div class="ttdeci">Component ResizableSplitBottom(Component main, Component back, int *main_size)</div><div class="ttdoc">An vertical split in between two components, configurable using the mouse.</div><div class="ttdef"><b>Definition</b> <a href="resizable__split_8cpp_source.html#l00317">resizable_split.cpp:317</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae0d441d2c83740f187f62db566bbefcd"><div class="ttname"><a href="namespaceftxui.html#ae0d441d2c83740f187f62db566bbefcd">ftxui::Checkbox</a></div><div class="ttdeci">Component Checkbox(CheckboxOption options)</div><div class="ttdoc">Draw checkable element.</div><div class="ttdef"><b>Definition</b> <a href="checkbox_8cpp_source.html#l00108">checkbox.cpp:108</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae2205fc172615b43e1e3307bb614be4c"><div class="ttname"><a href="namespaceftxui.html#ae2205fc172615b43e1e3307bb614be4c">ftxui::ResizableSplitLeft</a></div><div class="ttdeci">Component ResizableSplitLeft(Component main, Component back, int *main_size)</div><div class="ttdoc">An horizontal split in between two components, configurable using the mouse.</div><div class="ttdef"><b>Definition</b> <a href="resizable__split_8cpp_source.html#l00215">resizable_split.cpp:215</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af07b496fe512e3a4863ee546f19e9a6c"><div class="ttname"><a href="namespaceftxui.html#af07b496fe512e3a4863ee546f19e9a6c">ftxui::ComponentDecorator</a></div><div class="ttdeci">std::function&lt; Component(Component)&gt; ComponentDecorator</div><div class="ttdef"><b>Definition</b> <a href="component_8hpp_source.html#l00031">component.hpp:31</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af1479ede01dbf087342534ab4ada11d3"><div class="ttname"><a href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">ftxui::Component</a></div><div class="ttdeci">std::shared_ptr&lt; ComponentBase &gt; Component</div><div class="ttdef"><b>Definition</b> <a href="component__base_8hpp_source.html#l00024">component_base.hpp:24</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af75c40d83714ba0748a68d11ff5e25dd"><div class="ttname"><a href="namespaceftxui.html#af75c40d83714ba0748a68d11ff5e25dd">ftxui::Collapsible</a></div><div class="ttdeci">Component Collapsible(ConstStringRef label, Component child, Ref&lt; bool &gt; show=false)</div></div>
<div class="ttc" id="anamespaceftxui_html_afa5872ba3f9889c7487e57e745e56857"><div class="ttname"><a href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">ftxui::CatchEvent</a></div><div class="ttdeci">Component CatchEvent(Component child, std::function&lt; bool(Event)&gt;)</div></div>
<div class="ttc" id="astructftxui_1_1ButtonOption_html_a553fe18f102e8e62aec516d4d3213eac"><div class="ttname"><a href="structftxui_1_1ButtonOption.html#a553fe18f102e8e62aec516d4d3213eac">ftxui::ButtonOption::Simple</a></div><div class="ttdeci">static ButtonOption Simple()</div><div class="ttdoc">Create a ButtonOption, inverted when focused.</div><div class="ttdef"><b>Definition</b> <a href="component__options_8cpp_source.html#l00177">component_options.cpp:177</a></div></div>
<div class="ttc" id="astructftxui_1_1CheckboxOption_html_a41b17a916980353033366c01b15d3cb1"><div class="ttname"><a href="structftxui_1_1CheckboxOption.html#a41b17a916980353033366c01b15d3cb1">ftxui::CheckboxOption::Simple</a></div><div class="ttdeci">static CheckboxOption Simple()</div><div class="ttdoc">Option for standard Checkbox.</div><div class="ttdef"><b>Definition</b> <a href="component__options_8cpp_source.html#l00262">component_options.cpp:262</a></div></div>
<div class="ttc" id="astructftxui_1_1MenuOption_html_a617c59fdb94db99100d0e7a569c31d75"><div class="ttname"><a href="structftxui_1_1MenuOption.html#a617c59fdb94db99100d0e7a569c31d75">ftxui::MenuOption::Vertical</a></div><div class="ttdeci">static MenuOption Vertical()</div><div class="ttdoc">Standard options for a vertical menu. This can be useful to implement a list of selectable items.</div><div class="ttdef"><b>Definition</b> <a href="component__options_8cpp_source.html#l00110">component_options.cpp:110</a></div></div>
</div><!-- fragment --><h2><a class="anchor" id="component-input"></a>
Input</h2>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2input_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147247671-f1d6f606-1845-4e94-a4a0-d4273e9ae6bd.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a7f285fcbc4dd0a0767b89a255fd062dc" title="An input box for editing text.">ftxui::Input()</a></code> from "ftxui/component/component.hpp"</p>
<p>
<script id="asciicast-223719" src="https://asciinema.org/a/223719.js" async></script>
</p>
<h3><a class="anchor" id="autotoc_md127"></a>
Filtered input</h3>
<p>On can filter out the characters received by the input component, using <code><a class="el" href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">ftxui::CatchEvent</a></code>.</p>
<div class="fragment"><div class="line">std::string phone_number;</div>
<div class="line"><a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> input = Input(&amp;phone_number, <span class="stringliteral">&quot;phone number&quot;</span>);</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Filter out non-digit characters.</span></div>
<div class="line">input |= CatchEvent([&amp;](<a class="code hl_struct" href="structftxui_1_1Event.html">Event</a> event) {</div>
<div class="line"> <span class="keywordflow">return</span> <span class="keyword">event</span>.is_character() &amp;&amp; !std::isdigit(event.<a class="code hl_function" href="structftxui_1_1Event.html#a07022c6e92b9144a0e5b337b562f9892">character</a>()[0]);</div>
<div class="line">});</div>
<div class="line"> </div>
<div class="line"><span class="comment">// Filter out characters past the 10th one.</span></div>
<div class="line">input |= CatchEvent([&amp;](<a class="code hl_struct" href="structftxui_1_1Event.html">Event</a> event) {</div>
<div class="line"> <span class="keywordflow">return</span> <span class="keyword">event</span>.is_character() &amp;&amp; phone_number.size() &gt;= 10;</div>
<div class="line">});</div>
<div class="ttc" id="astructftxui_1_1Event_html"><div class="ttname"><a href="structftxui_1_1Event.html">ftxui::Event</a></div><div class="ttdoc">Represent an event. It can be key press event, a terminal resize, or more ...</div><div class="ttdef"><b>Definition</b> <a href="event_8hpp_source.html#l00027">event.hpp:27</a></div></div>
<div class="ttc" id="astructftxui_1_1Event_html_a07022c6e92b9144a0e5b337b562f9892"><div class="ttname"><a href="structftxui_1_1Event.html#a07022c6e92b9144a0e5b337b562f9892">ftxui::Event::character</a></div><div class="ttdeci">std::string character() const</div><div class="ttdef"><b>Definition</b> <a href="event_8hpp_source.html#l00105">event.hpp:105</a></div></div>
</div><!-- fragment --><h2><a class="anchor" id="component-menu"></a>
Menu</h2>
<p>Defines a menu object. It contains a list of entries, one of them is selected.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2menu_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147247822-0035fd6f-bb13-4b3a-b057-77eb9291582f.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a27828fc39da10a18478ba84b1b162039" title="A list of text. The focused element is selected.">ftxui::Menu()</a></code> from "ftxui/component/component.hpp"</p>
<p>
<script id="asciicast-223720" src="https://asciinema.org/a/223720.js" async></script>
</p>
<h2><a class="anchor" id="component-toggle"></a>
Toggle </h2>
<p>A special kind of menu. The entries are displayed horizontally.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2toggle_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147249383-e2201cf1-b7b8-4a5a-916f-d761e3e7ae40.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a3537fccac66b07cd792874c9a6086811" title="An horizontal list of elements. The user can navigate through them.">ftxui::Toggle()</a></code> from "ftxui/component/component.hpp"</p>
<p>
<script id="asciicast-223722" src="https://asciinema.org/a/223722.js" async></script>
</p>
<h2><a class="anchor" id="component-checkbox"></a>
CheckBox</h2>
<p>This component defines a checkbox. It is a single entry that can be turned on/off.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2checkbox_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147246646-b86926a9-1ef9-4efb-af98-48a9b62acd81.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#ae0d441d2c83740f187f62db566bbefcd" title="Draw checkable element.">ftxui::Checkbox()</a></code> from "ftxui/component/component.hpp"</p>
<p>
<script id="asciicast-223724" src="https://asciinema.org/a/223724.js" async></script>
</p>
<h2><a class="anchor" id="component-radiobox"></a>
RadioBox</h2>
<p>A radiobutton component. This is a list of entries, where one can be turned on.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2radiobox_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147246401-809d14a5-6621-4e36-8dd9-a2d75ef2a94e.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a3e7a44f321fa910f07aef5879e67af95" title="A list of element, where only one can be selected.">ftxui::Radiobox()</a></code> from "ftxui/component/component.hpp"</p>
<p>
<script id="asciicast-223725" src="https://asciinema.org/a/223725.js" async></script>
</p>
<h2><a class="anchor" id="component-dropdown"></a>
Dropdown</h2>
<p>A drop down menu is a component that when checked display a list of element for the user to select one.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2dropdown_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147246982-1e821751-531c-4e1f-bc37-2fa290e143cd.gif" alt="youtube-video-gif (3)" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#aa22bddff4aeed66e20f30d0715596999" title="A dropdown menu.">ftxui::Dropdown()</a></code> from "ftxui/component/component.hpp"</p>
<h2><a class="anchor" id="component-slider"></a>
Slider</h2>
<p>Represents a slider object that consists of a range with binned intermediate intervals. It can be created by <code><a class="el" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727" title="A slider in any direction.">ftxui::Slider()</a></code>.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2slider_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147249265-7e2cad75-082c-436e-affe-44a550c480ab.png" alt="image" class="inline"/></p>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#aa3558d992a72679e5e9c9c7b67abd727" title="A slider in any direction.">ftxui::Slider()</a></code> from "ftxui/component/component.hpp"</p>
<h2><a class="anchor" id="component-renderer"></a>
Renderer</h2>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361" title="Return a new Component, similar to |child|, but using |render| as the Component::Render() event.">ftxui::Renderer()</a></code> from <a class="el" href="component_8hpp.html">ftxui/component/component.hpp</a>. This component decorate another one by using a different function to render an interface.</p>
<p>Example: </p><div class="fragment"><div class="line"><span class="keyword">auto</span> inner = [...]</div>
<div class="line"> </div>
<div class="line"><span class="keyword">auto</span> renderer = Renderer(inner, [&amp;] {</div>
<div class="line"> <span class="keywordflow">return</span> inner-&gt;Render() | border</div>
<div class="line">});</div>
</div><!-- fragment --><p><code><a class="el" href="namespaceftxui.html#a533e883e2aeea28de2b60564fcaf0361" title="Return a new Component, similar to |child|, but using |render| as the Component::Render() event.">ftxui::Renderer</a></code> also supports the component decorator pattern: </p><div class="fragment"><div class="line"><span class="keyword">auto</span> component = [...]</div>
<div class="line">component = component</div>
<div class="line"> | Renderer([](<a class="code hl_typedef" href="namespaceftxui.html#a2bc31f2d685189e5c61d2293a1f51b4f">Element</a> e) { <span class="keywordflow">return</span> e | border))</div>
<div class="line"> | Renderer(bold)</div>
</div><!-- fragment --><p>As a short hand, you can also compose a component with an element decorator: </p><div class="fragment"><div class="line"><span class="keyword">auto</span> component = [...]</div>
<div class="line">component = component | border | bold;</div>
</div><!-- fragment --><h2><a class="anchor" id="component-catchevent"></a>
CatchEvent</h2>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">ftxui::CatchEvent()</a></code> from <a class="el" href="component_8hpp.html">ftxui/component/component.hpp</a>. This component decorate others, catching events before the underlying component.</p>
<p>Examples: </p><div class="fragment"><div class="line"><span class="keyword">auto</span> screen = ScreenInteractive::TerminalOutput();</div>
<div class="line"><span class="keyword">auto</span> renderer = Renderer([] {</div>
<div class="line"> <span class="keywordflow">return</span> text(<span class="stringliteral">&quot;My interface&quot;</span>);</div>
<div class="line">});</div>
<div class="line"><span class="keyword">auto</span> component = CatchEvent(renderer, [&amp;](<a class="code hl_struct" href="structftxui_1_1Event.html">Event</a> event) {</div>
<div class="line"> <span class="keywordflow">if</span> (event == Event::Character(<span class="charliteral">&#39;q&#39;</span>)) {</div>
<div class="line"> screen.ExitLoopClosure()();</div>
<div class="line"> <span class="keywordflow">return</span> <span class="keyword">true</span>;</div>
<div class="line"> }</div>
<div class="line"> <span class="keywordflow">return</span> <span class="keyword">false</span>;</div>
<div class="line">});</div>
<div class="line">screen.Loop(component);</div>
</div><!-- fragment --><p>The <code><a class="el" href="namespaceftxui.html#afa5872ba3f9889c7487e57e745e56857">ftxui::CatchEvent</a></code> can also be used as a decorator: </p><div class="fragment"><div class="line">component = component</div>
<div class="line"> | CatchEvent(handler_1)</div>
<div class="line"> | CatchEvent(handler_2)</div>
<div class="line"> | CatchEvent(handler_3)</div>
<div class="line"> ;</div>
</div><!-- fragment --><h2><a class="anchor" id="component-collapsible"></a>
Collapsible</h2>
<p>Useful for visual elements whose visibility can be toggle on/off by the user. Essentially, this the combination of the <code><a class="el" href="namespaceftxui.html#ae0d441d2c83740f187f62db566bbefcd" title="Draw checkable element.">ftxui::Checkbox()</a></code> and <code><a class="el" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4" title="Decorate a component |child|. It is shown only when |show| is true.">ftxui::Maybe()</a></code> components.</p>
<div class="fragment"><div class="line"><span class="keyword">auto</span> collabsible = Collapsible(<span class="stringliteral">&quot;Show more&quot;</span>, inner_element);</div>
</div><!-- fragment --><h2><a class="anchor" id="component-maybe"></a>
Maybe</h2>
<p>Produced by: <code><a class="el" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4" title="Decorate a component |child|. It is shown only when |show| is true.">ftxui::Maybe()</a></code> from <a class="el" href="component_8hpp.html">ftxui/component/component.hpp</a>. This component can be utilized to show/hide any other component via a boolean or a predicate.</p>
<p>Example with a boolean: </p><div class="fragment"><div class="line"><span class="keywordtype">bool</span> show = <span class="keyword">true</span>;</div>
<div class="line"><span class="keyword">auto</span> component = Renderer([]{ <span class="keywordflow">return</span> <span class="stringliteral">&quot;Hello World!&quot;</span>; });</div>
<div class="line"><span class="keyword">auto</span> maybe_component = Maybe(component, &amp;show)</div>
</div><!-- fragment --><p>Example with a predicate: </p><div class="fragment"><div class="line"><span class="keyword">auto</span> component = Renderer([]{ <span class="keywordflow">return</span> <span class="stringliteral">&quot;Hello World!&quot;</span>; });</div>
<div class="line"><span class="keyword">auto</span> maybe_component = Maybe(component, [&amp;] { <span class="keywordflow">return</span> time &gt; 10; })</div>
</div><!-- fragment --><p>As usual, <code><a class="el" href="namespaceftxui.html#a20b66a70c1cd4ff3f0ff571a4507d2b4" title="Decorate a component |child|. It is shown only when |show| is true.">ftxui::Maybe</a></code> can also be used as a decorator: </p><div class="fragment"><div class="line">component = component</div>
<div class="line"> | Maybe(&amp;a_boolean)</div>
<div class="line"> | Maybe([&amp;] { <span class="keywordflow">return</span> time &gt; 10; })</div>
<div class="line"> ;</div>
</div><!-- fragment --><h2><a class="anchor" id="component-container"></a>
Container</h2>
<h3><a class="anchor" id="component-horizontal"></a>
Horizontal</h3>
<p>Produced by: <code><a class="el" href="namespaceftxui_1_1Container.html#a01563bae9454fe64c0b29b0eb3755e68" title="A list of components, drawn one by one horizontally and navigated horizontally using left/right arrow...">ftxui::Container::Horizontal()</a></code> from "ftxui/component/component.hpp". It displays a list of components horizontally and handle keyboard/mouse navigation.</p>
<h3><a class="anchor" id="component-vertical"></a>
Vertical</h3>
<p>Produced by: <code><a class="el" href="namespaceftxui_1_1Container.html#a6471e39f5664d059144746c5801d37e6" title="A list of components, drawn one by one vertically and navigated vertically using up/down arrow key or...">ftxui::Container::Vertical()</a></code> from "ftxui/component/component.hpp". It displays a list of components vertically and handles keyboard/mouse navigation.</p>
<h3><a class="anchor" id="component-tab"></a>
Tab</h3>
<p>Produced by: <code><a class="el" href="namespaceftxui_1_1Container.html#aea9fe244eeeb420276bcc5760b46953d" title="A list of components, where only one is drawn and interacted with at a time. The |selector| gives the...">ftxui::Container::Tab()</a></code> from "ftxui/component/component.hpp". It take a list of component and display only one of them. This is useful for implementing a tab bar.</p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2tab_vertical_8cpp-example.html">Vertical</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147250144-22ff044a-4773-4ff7-a49c-12ba4034acb4.gif" alt="ezgif com-gif-maker (1)" class="inline"/></p>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2tab_horizontal_8cpp-example.html">Horizontal</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147250217-fe447e0f-7a99-4e08-948a-995087d9b40e.gif" alt="ezgif com-gif-maker (2)" class="inline"/></p>
<h2><a class="anchor" id="component-resizable-split"></a>
ResizableSplit</h2>
<p>It defines a horizontal or vertical separation between two children components. The position of the split is variable and controllable using the mouse. There are four possible splits:</p><ul>
<li><code><a class="el" href="namespaceftxui.html#ae2205fc172615b43e1e3307bb614be4c" title="An horizontal split in between two components, configurable using the mouse.">ftxui::ResizableSplitLeft()</a></code></li>
<li><code><a class="el" href="namespaceftxui.html#a9030d0beb64f653603cab382b02750a8" title="An horizontal split in between two components, configurable using the mouse.">ftxui::ResizableSplitRight()</a></code></li>
<li><code><a class="el" href="namespaceftxui.html#a238b4b650aca14716b82b2198695e008" title="An vertical split in between two components, configurable using the mouse.">ftxui::ResizableSplitTop()</a></code></li>
<li><code><a class="el" href="namespaceftxui.html#acb75e6e61a021829893f7b57aeb7e3a2" title="An vertical split in between two components, configurable using the mouse.">ftxui::ResizableSplitBottom()</a></code> from "ftxui/component/component.hpp"</li>
</ul>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples_2component_2resizable_split_8cpp-example.html">Example</a>:</p>
<p><img src="https://user-images.githubusercontent.com/4759106/147248372-c55512fe-9b96-4b08-a1df-d05cf2cae431.gif" alt="ezgif com-gif-maker" class="inline"/> <br />
</p>
<p>
<script id="asciicast-tprMH2EdkUoMb7D2YxgMGgpzx" src="https://asciinema.org/a/tprMH2EdkUoMb7D2YxgMGgpzx.js" async></script>
</p>
<h2><a class="anchor" id="component-force-redraw"></a>
Force a frame redraw.</h2>
<p>Typically, <code><a class="el" href="classftxui_1_1ScreenInteractive.html#a6f7095d721dd1dbd490d97c028eb676f">ftxui::ScreenInteractive::Loop()</a></code> is responsible for drawing a new frame whenever a new group of events (e.g keyboard, mouse, window resize, etc.) has been processed. However, you might want to react to arbitrary events that are unknown to FTXUI. To accomplish this, you must post events using <code><a class="el" href="classftxui_1_1ScreenInteractive.html#a29e75bdaa1d5465518787ec014b2c3bf" title="Add an event to the main loop. It will be executed later, after every other scheduled events.">ftxui::ScreenInteractive::PostEvent</a></code> (<b>this is thread safe</b>) via a thread. You will have to post the event <code><a class="el" href="structftxui_1_1Event.html#a699872f2a6d8607d714be174e9435290">ftxui::Event::Custom</a></code>.</p>
<p>Example: </p><div class="fragment"><div class="line">screen-&gt;PostEvent(Event::Custom);</div>
</div><!-- fragment --> </div></div><!-- PageDoc -->
<a href="doxygen_crawl.html"></a>
</div><!-- contents -->
</div><!-- doc-content -->
<!-- HTML footer for doxygen 1.8.14-->
<!-- start footer part -->
<div id="nav-path" class="navpath"><!-- id is needed for treeview function! -->
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const projectNumber = document.getElementById('projectnumber');
if (!projectNumber) {
console.warn('Doxygen element with ID "projectnumber" not found. Cannot add version switcher.');
return;
}
const versions = ["main", "v6.1.9", "v6.1.8", "v6.1.7", "v6.1.6", "v6.1.5", "v6.1.4", "v6.1.3", "v6.1.2", "v6.1.1", "v6.1.0", "v6.0.2", "v6.0.1", "v6.0.0", "v5.0.0", "v4.1.1", "v4.1.0", "v4.0.0", "v3.0.0", "v2.0.0", "v0.9", "v0.11", "v0.10"];
const version_paths = {"main": "../../index.html", "v6.1.9": "../v6.1.9/index.html", "v6.1.8": "../v6.1.8/index.html", "v6.1.7": "index.html", "v6.1.6": "../v6.1.6/index.html", "v6.1.5": "../v6.1.5/index.html", "v6.1.4": "../v6.1.4/index.html", "v6.1.3": "../v6.1.3/index.html", "v6.1.2": "../v6.1.2/index.html", "v6.1.1": "../v6.1.1/index.html", "v6.1.0": "../v6.1.0/index.html", "v6.0.2": "../v6.0.2/index.html", "v6.0.1": "../v6.0.1/index.html", "v6.0.0": "../v6.0.0/index.html", "v5.0.0": "../v5.0.0/index.html", "v4.1.1": "../v4.1.1/index.html", "v4.1.0": "../v4.1.0/index.html", "v4.0.0": "../v4.0.0/index.html", "v3.0.0": "../v3.0.0/index.html", "v2.0.0": "../v2.0.0/index.html", "v0.9": "../v0.9/index.html", "v0.11": "../v0.11/index.html", "v0.10": "../v0.10/index.html"};
const currentVersion = "v6.1.7";
// Sort versions: 'main' first, then others numerically descending.
versions.sort((a, b) => {
if (a === 'main') return -1;
if (b === 'main') return 1;
return b.localeCompare(a, undefined, { numeric: true, sensitivity: 'base' });
});
const select = document.createElement('select');
select.onchange = function() {
const selectedVersion = this.value;
// Navigate directly to the pre-calculated relative path.
if (selectedVersion !== currentVersion) {
window.location.href = version_paths[selectedVersion];
}
};
versions.forEach(v => {
const option = document.createElement('option');
option.value = v;
option.textContent = v;
if (v === currentVersion) {
option.selected = true;
}
select.appendChild(option);
});
// Replace the Doxygen project number element with our dropdown.
projectNumber.replaceWith(select);
// Apply some styling to make it look good.
Object.assign(select.style, {
backgroundColor: 'rgba(0, 0, 0, 0.8)',
color: 'white',
border: '1px solid rgba(255, 255, 255, 0.2)',
padding: '5px',
borderRadius: '5px',
fontSize: '14px',
fontFamily: 'inherit',
marginLeft: '10px',
cursor: 'pointer'
});
});
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink