Files
FTXUI/module-dom-examples.html
2025-09-09 05:48:11 +00:00

2090 lines
192 KiB
HTML

<!-- HTML header for doxygen 1.9.8-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=11"/>
<meta name="generator" content="Doxygen 1.12.0"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>FTXUI: Example</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>
<script type="text/javascript" src="doxygen-awesome-fragment-copy-button.js"></script>
<script type="text/javascript" src="doxygen-awesome-paragraph-link.js"></script>
<script type="text/javascript" src="doxygen-awesome-interactive-toc.js"></script>
<script type="text/javascript" src="doxygen-awesome-tabs.js"></script>
<script type="module">
DoxygenAwesomeFragmentCopyButton.init()
DoxygenAwesomeParagraphLink.init()
DoxygenAwesomeInteractiveToc.init()
DoxygenAwesomeTabs.init()
await new Promise(r => window.addEventListener('DOMContentLoaded', r));
// Remove title when a img[alt='title-img'] is present.
// Find an image with the alt "img-title".
const img = document.querySelector("img[alt='title-img']");
const header = document.querySelector(".headertitle");
if (img && header) {
// Hide the header title progressively.
header.style.display = "none";
// Show progressively the image.
img.style.maxHeight = "40vh";
img.style.maxWidth = "100%";
img.style.objectFit = "contain";
}
// In the "examples.html" page. Turn every link with text
// "examples/<...>
//
// Add a "demo" link toward.
// https://arthursonzogni.github.io/FTXUI/examples/?file=<...>
const examples = document.querySelectorAll("a")
examples.forEach((example) => {
if (!example.textContent.startsWith("examples/")) {
return;
}
// Remove the ".cpp" extension from the example name.
const exampleName = example.textContent.replace("examples/", "").replace(".cpp", "");
const a = document.createElement("a");
a.textContent = "[demo]";
a.href = "https://arthursonzogni.github.io/FTXUI/examples/?file=" + exampleName;
a.style.marginRight= "1em";
a.style.fontWeight = "bold";
example.parentElement.insertBefore(a, example)
});
// If the current URL ends with -example.html, we can add a link to the demo
// as well using the div.title textContent.
const url = new URL(window.location.href);
if (url.pathname.endsWith("-example.html")) {
// Get the title text.
const title = document.querySelector("div.title").textContent;
const example = title.replace("examples/", "").replace(".cpp", "");
// Create a link to the demo.
const a = document.createElement("a");
a.textContent = "[demo]";
a.href = "https://arthursonzogni.github.io/FTXUI/examples/?file=" + example;
a.style.marginLeft = "1em";
a.style.fontWeight = "bold";
a.style.display = "inline-block";
// Insert the link after the title.
const titleDiv = document.querySelector("div.title");
if (titleDiv) {
titleDiv.insertBefore(a, titleDiv.nextSibling);
}
}
</script>
<script type="module">
// Click on the navtree, except for the main page where this is already done
// automatically.
let delay = 0;
while(true) {
const navtree = document.querySelector("div.item.selected");
if (!navtree) {
delay *= 2;
delay += 1;
await new Promise(resolve => setTimeout(resolve, delay));
continue;
}
// Include only selected navtree items.
console.log("navtree.textContent", navtree.textContent);
if (!navtree.textContent.includes("Getting Started") &&
!navtree.textContent.includes("Installation") &&
!navtree.textContent.includes("ftxui / screen") &&
!navtree.textContent.includes("ftxui / dom") &&
!navtree.textContent.includes("ftxui / component") &&
!navtree.textContent.includes("Reference")) {
break;
}
// Find the first link inside the navtree.
const link = navtree.querySelector("a");
if (link) {
// Simulate a click on the link.
link.click();
break;
}
}
</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-awesome.css" rel="stylesheet" type="text/css"/>
<link href="stylesheet.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 id="projectrow">
<td id="projectalign">
<div id="projectname">FTXUI<span id="projectnumber">&#160;6.1.9</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('module-dom-examples.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">Example</div></div>
</div><!--header-->
<div class="contents">
<div class="toc"><h3>Table of Contents</h3>
<ul>
<li class="level1">
<a href="#border">border</a>
</li>
<li class="level1">
<a href="#border_colored">border_colored</a>
</li>
<li class="level1">
<a href="#border_style">border_style</a>
</li>
<li class="level1">
<a href="#canvas">canvas</a>
</li>
<li class="level1">
<a href="#color_gallery">color_gallery</a>
</li>
<li class="level1">
<a href="#color_info_palette256">color_info_palette256</a>
</li>
<li class="level1">
<a href="#color_truecolor_hsv">color_truecolor_HSV</a>
</li>
<li class="level1">
<a href="#color_truecolor_rgb">color_truecolor_RGB</a>
</li>
<li class="level1">
<a href="#dbox">dbox</a>
</li>
<li class="level1">
<a href="#gauge">gauge</a>
</li>
<li class="level1">
<a href="#gauge_direction">gauge_direction</a>
</li>
<li class="level1">
<a href="#graph">graph</a>
</li>
<li class="level1">
<a href="#gridbox">gridbox</a>
</li>
<li class="level1">
<a href="#hflow">hflow</a>
</li>
<li class="level1">
<a href="#html_like">html_like</a>
</li>
<li class="level1">
<a href="#linear_gradient">linear_gradient</a>
</li>
<li class="level1">
<a href="#package_manager">package_manager</a>
</li>
<li class="level1">
<a href="#paragraph">paragraph</a>
</li>
<li class="level1">
<a href="#separator">separator</a>
</li>
<li class="level1">
<a href="#separator_style">separator_style</a>
</li>
<li class="level1">
<a href="#size">size</a>
</li>
<li class="level1">
<a href="#spinner">spinner</a>
</li>
<li class="level1">
<a href="#style_blink">style_blink</a>
</li>
<li class="level1">
<a href="#style_bold">style_bold</a>
</li>
<li class="level1">
<a href="#style_color">style_color</a>
</li>
<li class="level1">
<a href="#style_dim">style_dim</a>
</li>
<li class="level1">
<a href="#style_gallery">style_gallery</a>
</li>
<li class="level1">
<a href="#style_hyperlink">style_hyperlink</a>
</li>
<li class="level1">
<a href="#style_inverted">style_inverted</a>
</li>
<li class="level1">
<a href="#style_italic">style_italic</a>
</li>
<li class="level1">
<a href="#style_strikethrough">style_strikethrough</a>
</li>
<li class="level1">
<a href="#style_underlined">style_underlined</a>
</li>
<li class="level1">
<a href="#style_underlined_double">style_underlined_double</a>
</li>
<li class="level1">
<a href="#table">table</a>
</li>
<li class="level1">
<a href="#vbox_hbox">vbox_hbox</a>
</li>
<li class="level1">
<a href="#vflow">vflow</a>
</li>
</ul>
</div>
<div class="textblock"><h1><a class="anchor" id="border"></a>
border</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/border">Demo</a> </p><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">#include &lt;stdlib.h&gt;</span> <span class="comment">// for EXIT_SUCCESS</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, vbox, border, Element, Fit, hbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 1&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 2&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 3&quot;</span>),</div>
<div class="line"> }) | border,</div>
<div class="line"> </div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 4&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 5&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 6&quot;</span>),</div>
<div class="line"> }) | border,</div>
<div class="line"> </div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 7&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 8&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;Line 9&quot;</span>),</div>
<div class="line"> }) | border,</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> <span class="keywordflow">return</span> EXIT_SUCCESS;</div>
<div class="line">}</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="aelements_8hpp_html"><div class="ttname"><a href="elements_8hpp.html">elements.hpp</a></div></div>
<div class="ttc" id="aexamples_2component_2button_8cpp_html_ae66f6b31b5ad750f1fe042a706a4e3d4"><div class="ttname"><a href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a></div><div class="ttdeci">int main()</div><div class="ttdef"><b>Definition</b> <a href="examples_2component_2button_8cpp_source.html#l00033">examples/component/button.cpp:33</a></div></div>
<div class="ttc" id="anamespaceftxui_html"><div class="ttname"><a href="namespaceftxui.html">ftxui</a></div><div class="ttdoc">The FTXUI ftxui:: namespace.</div><div class="ttdef"><b>Definition</b> <a href="animation_8hpp_source.html#l00010">animation.hpp:10</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="ascreen_8hpp_html"><div class="ttname"><a href="screen_8hpp.html">screen.hpp</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="border_colored"></a>
border_colored</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/border_colored">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, text, Element, Fit, borderDouble, borderHeavy, borderLight, borderRounded, vbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for endl, cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">auto</span> make_boxed = [] {</div>
<div class="line"> <span class="keywordflow">return</span> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;borderLight&quot;</span>) | borderStyled(LIGHT, Color::Red),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDashed&quot;</span>) | borderStyled(DASHED, Color::Green),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderHeavy&quot;</span>) | borderStyled(HEAVY, Color::Blue),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDouble&quot;</span>) | borderStyled(DOUBLE, Color::Yellow),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderRounded&quot;</span>) | borderStyled(ROUNDED, Color::Cyan),</div>
<div class="line"> });</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = hbox({</div>
<div class="line"> make_boxed(),</div>
<div class="line"> separator() | color(Color::Red),</div>
<div class="line"> make_boxed(),</div>
<div class="line"> separator() | color(Color::Red),</div>
<div class="line"> make_boxed(),</div>
<div class="line"> }) |</div>
<div class="line"> borderStyled(ROUNDED, Color::Red);</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen =</div>
<div class="line"> Screen::Create(Dimension::Fit(document), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="border_style"></a>
border_style</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/border_style">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, text, Element, Fit, borderDouble, borderHeavy, borderLight, borderRounded, vbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for endl, cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">auto</span> document = vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;borderLight&quot;</span>) | borderLight,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDashed&quot;</span>) | borderDashed,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderHeavy&quot;</span>) | borderHeavy,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDouble&quot;</span>) | borderDouble,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderRounded&quot;</span>) | borderRounded,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen =</div>
<div class="line"> Screen::Create(Dimension::Fit(document), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="canvas"></a>
canvas</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/canvas">Demo</a> </p><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">#include &lt;stdio.h&gt;</span> <span class="comment">// for getchar</span></div>
<div class="line"><span class="preprocessor">#include &lt;cmath&gt;</span> <span class="comment">// for cos</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for Fit, canvas, operator|, border, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Pixel, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector, allocator</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> <span class="comment">// for Canvas</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Red, Color::Blue, Color::Green, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">auto</span> c = <a class="code hl_struct" href="group__dom.html#structftxui_1_1Canvas">Canvas</a>(100, 100);</div>
<div class="line"> </div>
<div class="line"> c.DrawText(0, 0, <span class="stringliteral">&quot;This is a canvas&quot;</span>, [](<a class="code hl_struct" href="group__screen.html#structftxui_1_1Pixel">Pixel</a>&amp; p) {</div>
<div class="line"> p.<a class="code hl_variable" href="group__screen.html#a2ce82adc1d02baf22df658b903dcb351">foreground_color</a> = Color::Red;</div>
<div class="line"> p.<a class="code hl_variable" href="group__screen.html#a7c8849e8321ea248cd4991ea8ef198eb">underlined</a> = <span class="keyword">true</span>;</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Triangle:</span></div>
<div class="line"> c.DrawPointLine(10, 10, 80, 10, Color::Red);</div>
<div class="line"> c.DrawPointLine(80, 10, 80, 40, Color::Blue);</div>
<div class="line"> c.DrawPointLine(80, 40, 10, 10, Color::Green);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Circle, not filled and filled:</span></div>
<div class="line"> c.DrawPointCircle(30, 50, 20);</div>
<div class="line"> c.DrawPointCircleFilled(40, 40, 10);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Plot a function:</span></div>
<div class="line"> std::vector&lt;int&gt; ys(100);</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> x = 0; x &lt; 100; x++) {</div>
<div class="line"> ys[x] = int(80 + 20 * cos(x * 0.2));</div>
<div class="line"> }</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> x = 0; x &lt; 99; x++) {</div>
<div class="line"> c.DrawPointLine(x, ys[x], x + 1, ys[x + 1], Color::Red);</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = canvas(&amp;c) | border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> getchar();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</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="agroup__dom_html_structftxui_1_1Canvas"><div class="ttname"><a href="group__dom.html#structftxui_1_1Canvas">ftxui::Canvas</a></div><div class="ttdoc">Canvas is a drawable buffer associated with drawing operations.</div><div class="ttdef"><b>Definition</b> <a href="canvas_8hpp_source.html#l00038">canvas.hpp:38</a></div></div>
<div class="ttc" id="agroup__screen_html_a2ce82adc1d02baf22df658b903dcb351"><div class="ttname"><a href="group__screen.html#a2ce82adc1d02baf22df658b903dcb351">ftxui::Pixel::foreground_color</a></div><div class="ttdeci">Color foreground_color</div><div class="ttdef"><b>Definition</b> <a href="pixel_8hpp_source.html#l00049">pixel.hpp:49</a></div></div>
<div class="ttc" id="agroup__screen_html_a7c8849e8321ea248cd4991ea8ef198eb"><div class="ttname"><a href="group__screen.html#a7c8849e8321ea248cd4991ea8ef198eb">ftxui::Pixel::underlined</a></div><div class="ttdeci">bool underlined</div><div class="ttdef"><b>Definition</b> <a href="pixel_8hpp_source.html#l00033">pixel.hpp:33</a></div></div>
<div class="ttc" id="agroup__screen_html_structftxui_1_1Pixel"><div class="ttname"><a href="group__screen.html#structftxui_1_1Pixel">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 --><h1><a class="anchor" id="color_gallery"></a>
color_gallery</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/color_gallery">Demo</a> </p><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">#include &lt;<a class="code" href="color__info_8hpp.html">ftxui/screen/color_info.hpp</a>&gt;</span> <span class="comment">// for ColorInfo</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="terminal_8hpp.html">ftxui/screen/terminal.hpp</a>&gt;</span> <span class="comment">// for ColorSupport, Color, Palette16, Palette256, TrueColor</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"> </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 text, bgcolor, color, vbox, hbox, separator, operator|, Elements, Element, Fit, border</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Black, Color::Blue, Color::BlueLight, Color::Cyan, Color::CyanLight, Color::Default, Color::GrayDark, Color::GrayLight, Color::Green, Color::GreenLight, Color::Magenta, Color::MagentaLight, Color::Red, Color::RedLight, Color::White, Color::Yellow, Color::YellowLight, Color::Palette256, ftxui</span></div>
<div class="line"> </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="preprocessor">#include &quot;<a class="code" href="color__info__sorted__2d_8ipp.html">./color_info_sorted_2d.ipp</a>&quot;</span> <span class="comment">// for ColorInfoSorted2D</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</div>
<div class="line"> <span class="comment">// clang-format off</span></div>
<div class="line"> <span class="keyword">auto</span> basic_color_display =</div>
<div class="line"> vbox(</div>
<div class="line"> text(<span class="stringliteral">&quot;16 color palette:&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> hbox(</div>
<div class="line"> vbox(</div>
<div class="line"> color(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> color(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> color(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> color(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> color(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> color(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> color(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> color(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> color(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> color(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> color(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> color(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> color(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> color(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> color(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> color(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> color(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>))</div>
<div class="line"> ),</div>
<div class="line"> vbox(</div>
<div class="line"> bgcolor(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> bgcolor(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> bgcolor(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> bgcolor(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> bgcolor(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> bgcolor(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>))</div>
<div class="line"> )</div>
<div class="line"> )</div>
<div class="line"> );</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// clang-format on</span></div>
<div class="line"> <span class="keyword">auto</span> palette_256_color_display = text(<span class="stringliteral">&quot;256 colors palette:&quot;</span>);</div>
<div class="line"> {</div>
<div class="line"> std::vector&lt;std::vector&lt;ColorInfo&gt;&gt; info_columns = <a class="code hl_function" href="color__info__sorted__2d_8ipp.html#a0f08918d6064cd2a0e56cb9ec74033ca">ColorInfoSorted2D</a>();</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> columns;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; column : info_columns) {</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> column_elements;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; it : column) {</div>
<div class="line"> column_elements.push_back(</div>
<div class="line"> text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(<a class="code hl_class" href="group__screen.html#classftxui_1_1Color">Color</a>(<a class="code hl_enumeration" href="group__screen.html#abd07c48f62cc507fafa2486a43130fcf">Color::Palette256</a>(it.index_256))));</div>
<div class="line"> }</div>
<div class="line"> columns.push_back(hbox(std::move(column_elements)));</div>
<div class="line"> }</div>
<div class="line"> palette_256_color_display = vbox({</div>
<div class="line"> palette_256_color_display,</div>
<div class="line"> separator(),</div>
<div class="line"> vbox(columns),</div>
<div class="line"> });</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// True color display.</span></div>
<div class="line"> <span class="keyword">auto</span> true_color_display = text(<span class="stringliteral">&quot;TrueColors: 24bits:&quot;</span>);</div>
<div class="line"> {</div>
<div class="line"> <span class="keyword">const</span> <span class="keywordtype">int</span> max_value = 255;</div>
<div class="line"> <span class="keyword">const</span> <span class="keywordtype">int</span> value_increment = 8;</div>
<div class="line"> <span class="keyword">const</span> <span class="keywordtype">int</span> hue_increment = 6;</div>
<div class="line"> <span class="keywordtype">int</span> saturation = max_value;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> array;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> value = 0; value &lt; max_value; value += 2 * value_increment) {</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> line;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> hue = 0; hue &lt; max_value; hue += hue_increment) {</div>
<div class="line"> line.push_back(</div>
<div class="line"> text(<span class="stringliteral">&quot;&quot;</span>) <span class="comment">//</span></div>
<div class="line"> | color(Color::HSV(hue, saturation, value)) <span class="comment">//</span></div>
<div class="line"> | bgcolor(Color::HSV(hue, saturation, value + value_increment)));</div>
<div class="line"> }</div>
<div class="line"> array.push_back(hbox(std::move(line)));</div>
<div class="line"> }</div>
<div class="line"> true_color_display = vbox({</div>
<div class="line"> true_color_display,</div>
<div class="line"> separator(),</div>
<div class="line"> vbox(std::move(array)),</div>
<div class="line"> });</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> terminal_info =</div>
<div class="line"> vbox({</div>
<div class="line"> Terminal::ColorSupport() &gt;= Terminal::Color::Palette16</div>
<div class="line"> ? text(<span class="stringliteral">&quot; 16 color palette support : Yes&quot;</span>)</div>
<div class="line"> : text(<span class="stringliteral">&quot; 16 color palette support : No&quot;</span>),</div>
<div class="line"> Terminal::ColorSupport() &gt;= Terminal::<a class="code hl_class" href="group__screen.html#classftxui_1_1Color">Color</a>::<a class="code hl_enumvalue" href="group__screen.html#ggab87bacfdad76e61b9412d7124be44c1ca7b88ab2a5c8fe8866c96ea4acb623876">Palette256</a></div>
<div class="line"> ? text(<span class="stringliteral">&quot;256 color palette support : Yes&quot;</span>)</div>
<div class="line"> : text(<span class="stringliteral">&quot;256 color palette support : No&quot;</span>),</div>
<div class="line"> Terminal::ColorSupport() &gt;= Terminal::<a class="code hl_class" href="group__screen.html#classftxui_1_1Color">Color</a>::<a class="code hl_enumvalue" href="group__screen.html#ggab87bacfdad76e61b9412d7124be44c1ca7afd9568e82d523c91b2bfe0cc47be29">TrueColor</a></div>
<div class="line"> ? text(<span class="stringliteral">&quot; True color support : Yes&quot;</span>)</div>
<div class="line"> : text(<span class="stringliteral">&quot; True color support : No&quot;</span>),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = vbox({hbox({</div>
<div class="line"> basic_color_display,</div>
<div class="line"> text(<span class="stringliteral">&quot; &quot;</span>),</div>
<div class="line"> palette_256_color_display,</div>
<div class="line"> text(<span class="stringliteral">&quot; &quot;</span>),</div>
<div class="line"> true_color_display,</div>
<div class="line"> }),</div>
<div class="line"> terminal_info});</div>
<div class="line"> <span class="comment">// clang-format on</span></div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> </div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
<div class="ttc" id="acolor__info_8hpp_html"><div class="ttname"><a href="color__info_8hpp.html">color_info.hpp</a></div></div>
<div class="ttc" id="acolor__info__sorted__2d_8ipp_html"><div class="ttname"><a href="color__info__sorted__2d_8ipp.html">color_info_sorted_2d.ipp</a></div></div>
<div class="ttc" id="acolor__info__sorted__2d_8ipp_html_a0f08918d6064cd2a0e56cb9ec74033ca"><div class="ttname"><a href="color__info__sorted__2d_8ipp.html#a0f08918d6064cd2a0e56cb9ec74033ca">ColorInfoSorted2D</a></div><div class="ttdeci">std::vector&lt; std::vector&lt; ftxui::ColorInfo &gt; &gt; ColorInfoSorted2D()</div><div class="ttdef"><b>Definition</b> <a href="color__info__sorted__2d_8ipp_source.html#l00005">color_info_sorted_2d.ipp:5</a></div></div>
<div class="ttc" id="agroup__screen_html_abd07c48f62cc507fafa2486a43130fcf"><div class="ttname"><a href="group__screen.html#abd07c48f62cc507fafa2486a43130fcf">ftxui::Color::Palette256</a></div><div class="ttdeci">Palette256</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00072">color.hpp:72</a></div></div>
<div class="ttc" id="agroup__screen_html_classftxui_1_1Color"><div class="ttname"><a href="group__screen.html#classftxui_1_1Color">ftxui::Color</a></div><div class="ttdoc">Color is a class that represents a color in the terminal user interface.</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00022">color.hpp:22</a></div></div>
<div class="ttc" id="agroup__screen_html_ggab87bacfdad76e61b9412d7124be44c1ca7afd9568e82d523c91b2bfe0cc47be29"><div class="ttname"><a href="group__screen.html#ggab87bacfdad76e61b9412d7124be44c1ca7afd9568e82d523c91b2bfe0cc47be29">ftxui::Terminal::TrueColor</a></div><div class="ttdeci">@ TrueColor</div><div class="ttdef"><b>Definition</b> <a href="terminal_8hpp_source.html#l00027">terminal.hpp:27</a></div></div>
<div class="ttc" id="agroup__screen_html_ggab87bacfdad76e61b9412d7124be44c1ca7b88ab2a5c8fe8866c96ea4acb623876"><div class="ttname"><a href="group__screen.html#ggab87bacfdad76e61b9412d7124be44c1ca7b88ab2a5c8fe8866c96ea4acb623876">ftxui::Terminal::Palette256</a></div><div class="ttdeci">@ Palette256</div><div class="ttdef"><b>Definition</b> <a href="terminal_8hpp_source.html#l00026">terminal.hpp:26</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="aterminal_8hpp_html"><div class="ttname"><a href="terminal_8hpp.html">terminal.hpp</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="color_info_palette256"></a>
color_info_palette256</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/color_info_palette256">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, bgcolor, hbox, operator|, Elements, Fit, vbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="color__info_8hpp.html">ftxui/screen/color_info.hpp</a>&gt;</span> <span class="comment">// for ColorInfo</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector, allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Palette256, ftxui</span></div>
<div class="line"> </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="preprocessor">#include &quot;<a class="code" href="color__info__sorted__2d_8ipp.html">./color_info_sorted_2d.ipp</a>&quot;</span> <span class="comment">// for ColorInfoSorted2D</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</div>
<div class="line"> std::vector&lt;std::vector&lt;ColorInfo&gt;&gt; info_columns = <a class="code hl_function" href="color__info__sorted__2d_8ipp.html#a0f08918d6064cd2a0e56cb9ec74033ca">ColorInfoSorted2D</a>();</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Draw every columns</span></div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> columns_elements;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; column : info_columns) {</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> column_elements;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; it : column) {</div>
<div class="line"> column_elements.push_back(hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(<a class="code hl_class" href="group__screen.html#classftxui_1_1Color">Color</a>(<a class="code hl_enumeration" href="group__screen.html#abd07c48f62cc507fafa2486a43130fcf">Color::Palette256</a>(it.index_256))),</div>
<div class="line"> text(it.name),</div>
<div class="line"> }));</div>
<div class="line"> }</div>
<div class="line"> columns_elements.push_back(vbox(std::move(column_elements)));</div>
<div class="line"> }</div>
<div class="line"> <span class="keyword">auto</span> document = hbox(std::move(columns_elements));</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> </div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="color_truecolor_hsv"></a>
color_truecolor_HSV</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/color_truecolor_HSV">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, Elements, Fit, bgcolor, color, hbox, text, vbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keywordtype">int</span> saturation = 255;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> array;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> value = 0; value &lt; 255; value += 20) {</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> line;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> hue = 0; hue &lt; 255; hue += 2) {</div>
<div class="line"> line.push_back(text(<span class="stringliteral">&quot;&quot;</span>) <span class="comment">//</span></div>
<div class="line"> | color(Color::HSV(hue, saturation, value)) <span class="comment">//</span></div>
<div class="line"> | bgcolor(Color::HSV(hue, saturation, value + 10)));</div>
<div class="line"> }</div>
<div class="line"> array.push_back(hbox(std::move(line)));</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = vbox(std::move(array));</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> </div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="color_truecolor_rgb"></a>
color_truecolor_RGB</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/color_truecolor_RGB">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for hbox, text, bgcolor, operator|, vbox, Elements, window, Element, Fit</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> red_line;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> green_line;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> blue_line;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> cyan_line;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> magenta_line;</div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> yellow_line;</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> value = 0; value &lt; 255; value += 3) {</div>
<div class="line"> <span class="keywordtype">int</span> v = value * value / 255;</div>
<div class="line"> red_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(v, 0, 0)));</div>
<div class="line"> green_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(0, v, 0)));</div>
<div class="line"> blue_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(0, 0, v)));</div>
<div class="line"> cyan_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(0, v, v)));</div>
<div class="line"> magenta_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(v, 0, v)));</div>
<div class="line"> yellow_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | bgcolor(Color::RGB(v, v, 0)));</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = vbox({</div>
<div class="line"> window(text(<span class="stringliteral">&quot;Primary colors&quot;</span>),</div>
<div class="line"> vbox({</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;Red line :&quot;</span>), hbox(std::move(red_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;Green line :&quot;</span>), hbox(std::move(green_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;Blue line :&quot;</span>), hbox(std::move(blue_line))}),</div>
<div class="line"> })),</div>
<div class="line"> window(text(<span class="stringliteral">&quot;Secondary colors&quot;</span>),</div>
<div class="line"> vbox({</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;cyan line :&quot;</span>), hbox(std::move(cyan_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;magenta line:&quot;</span>), hbox(std::move(magenta_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;Yellow line :&quot;</span>), hbox(std::move(yellow_line))}),</div>
<div class="line"> })),</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> </div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="dbox"></a>
dbox</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/dbox">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, border, Element, vbox, center, Fit, dbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = dbox({</div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;line_1&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;line_2&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;line_3&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;line_4&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;line_5&quot;</span>),</div>
<div class="line"> }) | border,</div>
<div class="line"> text(<span class="stringliteral">&quot;overlay&quot;</span>) | border | center,</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> </div>
<div class="line"> screen.Print();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="gauge"></a>
gauge</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/gauge">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, gauge, operator|, flex, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, endl, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for allocator, char_traits, operator+, operator&lt;&lt;, string, to_string, basic_string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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">using namespace </span>std::chrono_literals;</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">float</span> percentage = 0.0f; percentage &lt;= 1.0f; percentage += 0.002f) {</div>
<div class="line"> std::string data_downloaded =</div>
<div class="line"> std::to_string(<span class="keywordtype">int</span>(percentage * 5000)) + <span class="stringliteral">&quot;/5000&quot;</span>;</div>
<div class="line"> <span class="keyword">auto</span> document = hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;downloading:&quot;</span>),</div>
<div class="line"> gauge(percentage) | flex,</div>
<div class="line"> text(<span class="stringliteral">&quot; &quot;</span> + data_downloaded),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = <a class="code hl_class" href="group__screen.html#classftxui_1_1Screen">Screen</a>(100, 1);</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> std::this_thread::sleep_for(0.01s);</div>
<div class="line"> }</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
<div class="ttc" id="agroup__screen_html_classftxui_1_1Screen"><div class="ttname"><a href="group__screen.html#classftxui_1_1Screen">ftxui::Screen</a></div><div class="ttdoc">A rectangular grid of Pixel.</div><div class="ttdef"><b>Definition</b> <a href="screen_8hpp_source.html#l00026">screen.hpp:26</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="gauge_direction"></a>
gauge_direction</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/gauge_direction">Demo</a> </p><div class="fragment"><div class="line"><span class="comment">// Copyright 2022 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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for filler, operator|, separator, text, border, Element, vbox, vtext, hbox, center, gaugeDown, gaugeLeft, gaugeRight, gaugeUp</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, endl, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for allocator, operator+, operator&lt;&lt;, string, to_string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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">using namespace </span>std::chrono_literals;</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">float</span> percentage = 0.0f; percentage &lt;= 1.0f; percentage += 0.002f) {</div>
<div class="line"> std::string data_downloaded =</div>
<div class="line"> std::to_string(<span class="keywordtype">int</span>(percentage * 5000)) + <span class="stringliteral">&quot;/5000&quot;</span>;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> gauge_up = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> vtext(<span class="stringliteral">&quot;gauge vertical&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> gaugeUp(percentage),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> gauge_down = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> vtext(<span class="stringliteral">&quot;gauge vertical&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> gaugeDown(percentage),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> gauge_right = <span class="comment">//</span></div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;gauge horizontal&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> gaugeRight(percentage),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> gauge_left = <span class="comment">//</span></div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;gauge horizontal&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> gaugeLeft(percentage),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = hbox({</div>
<div class="line"> gauge_up,</div>
<div class="line"> filler(),</div>
<div class="line"> vbox({</div>
<div class="line"> gauge_right,</div>
<div class="line"> filler(),</div>
<div class="line"> text(data_downloaded) | border | center,</div>
<div class="line"> filler(),</div>
<div class="line"> gauge_left,</div>
<div class="line"> }),</div>
<div class="line"> filler(),</div>
<div class="line"> gauge_down,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = <a class="code hl_class" href="group__screen.html#classftxui_1_1Screen">Screen</a>(32, 16);</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> std::this_thread::sleep_for(0.01s);</div>
<div class="line"> }</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="graph"></a>
graph</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/graph">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;cmath&gt;</span> <span class="comment">// for sin</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for graph, operator|, separator, color, Element, vbox, flex, inverted, operator|=, Fit, hbox, size, border, GREATER_THAN, HEIGHT</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;functional&gt;</span> <span class="comment">// for ref, reference_wrapper</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for shared_ptr</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for operator&lt;&lt;, string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for ignore</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::BlueLight, Color::RedLight, Color::YellowLight, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keyword">class </span>Graph {</div>
<div class="line"> <span class="keyword">public</span>:</div>
<div class="line"> std::vector&lt;int&gt; operator()(<span class="keywordtype">int</span> width, <span class="keywordtype">int</span> height)<span class="keyword"> const </span>{</div>
<div class="line"> std::vector&lt;int&gt; output(width);</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; width; ++i) {</div>
<div class="line"> <span class="keywordtype">float</span> v = 0;</div>
<div class="line"> v += 0.1f * sin((i + shift) * 0.1f); <span class="comment">// NOLINT</span></div>
<div class="line"> v += 0.2f * sin((i + shift + 10) * 0.15f); <span class="comment">// NOLINT</span></div>
<div class="line"> v += 0.1f * sin((i + shift) * 0.03f); <span class="comment">// NOLINT</span></div>
<div class="line"> v *= height; <span class="comment">// NOLINT</span></div>
<div class="line"> v += 0.5f * height; <span class="comment">// NOLINT</span></div>
<div class="line"> output[i] = <span class="keyword">static_cast&lt;</span><span class="keywordtype">int</span><span class="keyword">&gt;</span>(v);</div>
<div class="line"> }</div>
<div class="line"> <span class="keywordflow">return</span> output;</div>
<div class="line"> }</div>
<div class="line"> <span class="keywordtype">int</span> shift = 0;</div>
<div class="line">};</div>
<div class="line"> </div>
<div class="line">std::vector&lt;int&gt; <a class="code hl_function" href="examples_2dom_2graph_8cpp.html#a5ab45e2cb218468666c7dc7b2b957396">triangle</a>(<span class="keywordtype">int</span> width, <span class="keywordtype">int</span> height) {</div>
<div class="line"> std::vector&lt;int&gt; output(width);</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; width; ++i) {</div>
<div class="line"> output[i] = i % (height - 4) + 2;</div>
<div class="line"> }</div>
<div class="line"> <span class="keywordflow">return</span> output;</div>
<div class="line">}</div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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">using namespace </span>std::chrono_literals;</div>
<div class="line"> </div>
<div class="line"> Graph my_graph;</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0;; ++i) {</div>
<div class="line"> std::ignore = i;</div>
<div class="line"> <span class="keyword">auto</span> document = hbox({</div>
<div class="line"> vbox({</div>
<div class="line"> graph(std::ref(my_graph)),</div>
<div class="line"> separator(),</div>
<div class="line"> graph(<a class="code hl_function" href="examples_2dom_2graph_8cpp.html#a5ab45e2cb218468666c7dc7b2b957396">triangle</a>) | inverted,</div>
<div class="line"> }) | flex,</div>
<div class="line"> separator(),</div>
<div class="line"> vbox({</div>
<div class="line"> graph(std::ref(my_graph)) | color(Color::BlueLight),</div>
<div class="line"> separator(),</div>
<div class="line"> graph(std::ref(my_graph)) | color(Color::RedLight),</div>
<div class="line"> separator(),</div>
<div class="line"> graph(std::ref(my_graph)) | color(Color::YellowLight),</div>
<div class="line"> }) | flex,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> document |= border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">const</span> <span class="keywordtype">int</span> min_width = 40;</div>
<div class="line"> document |= size(HEIGHT, GREATER_THAN, min_width);</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">const</span> <span class="keyword">auto</span> sleep_time = 0.03s;</div>
<div class="line"> std::this_thread::sleep_for(sleep_time);</div>
<div class="line"> my_graph.shift++;</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
<div class="ttc" id="aexamples_2dom_2graph_8cpp_html_a5ab45e2cb218468666c7dc7b2b957396"><div class="ttname"><a href="examples_2dom_2graph_8cpp.html#a5ab45e2cb218468666c7dc7b2b957396">triangle</a></div><div class="ttdeci">std::vector&lt; int &gt; triangle(int width, int height)</div><div class="ttdef"><b>Definition</b> <a href="examples_2dom_2graph_8cpp_source.html#l00037">examples/dom/graph.cpp:37</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="gridbox"></a>
gridbox</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/gridbox">Demo</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">#include &lt;stdio.h&gt;</span> <span class="comment">// for getchar</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for Elements, gridbox, Fit, operator|, text, border, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> cell = [](<span class="keyword">const</span> <span class="keywordtype">char</span>* t) { <span class="keywordflow">return</span> text(t) | border; };</div>
<div class="line"> <span class="keyword">auto</span> document = <span class="comment">//</span></div>
<div class="line"> gridbox({</div>
<div class="line"> {</div>
<div class="line"> cell(<span class="stringliteral">&quot;north-west&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;north&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;north-east&quot;</span>),</div>
<div class="line"> },</div>
<div class="line"> {</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-west&quot;</span>),</div>
<div class="line"> gridbox({</div>
<div class="line"> {</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-north-west&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-north-east&quot;</span>),</div>
<div class="line"> },</div>
<div class="line"> {</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-south-west&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-south-east&quot;</span>),</div>
<div class="line"> },</div>
<div class="line"> }),</div>
<div class="line"> cell(<span class="stringliteral">&quot;center-east&quot;</span>),</div>
<div class="line"> },</div>
<div class="line"> {</div>
<div class="line"> cell(<span class="stringliteral">&quot;south-west&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;south&quot;</span>),</div>
<div class="line"> cell(<span class="stringliteral">&quot;south-east&quot;</span>),</div>
<div class="line"> },</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> getchar();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="hflow"></a>
hflow</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/hflow">Demo</a> </p><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">#include &lt;stdio.h&gt;</span> <span class="comment">// for getchar</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, size, Element, text, hcenter, Decorator, Fit, WIDTH, hflow, window, EQUAL, GREATER_THAN, HEIGHT, bold, border, dim, LESS_THAN</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for allocator, char_traits, operator+, to_string, string</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a> = [](<span class="keywordtype">int</span> dimx, <span class="keywordtype">int</span> dimy) {</div>
<div class="line"> std::string title = std::to_string(dimx) + <span class="stringliteral">&quot;x&quot;</span> + std::to_string(dimy);</div>
<div class="line"> <span class="keywordflow">return</span> window(text(title) | hcenter | bold,</div>
<div class="line"> text(<span class="stringliteral">&quot;content&quot;</span>) | hcenter | dim) |</div>
<div class="line"> size(WIDTH, EQUAL, dimx) | size(HEIGHT, EQUAL, dimy);</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> style = size(WIDTH, GREATER_THAN, 20) | border |</div>
<div class="line"> size(HEIGHT, GREATER_THAN, 30) | size(WIDTH, LESS_THAN, 50);</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = hflow({</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(7, 7),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(7, 5),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(5, 7),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 5),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 3),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 3),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 3),</div>
<div class="line"> }) |</div>
<div class="line"> style;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> getchar();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
<div class="ttc" id="aexamples_2component_2focus_8cpp_html_a9ffb8a33ec5d0133f63f791d526df1c7"><div class="ttname"><a href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a></div><div class="ttdeci">Element make_box(int x, int y)</div><div class="ttdef"><b>Definition</b> <a href="examples_2component_2focus_8cpp_source.html#l00017">examples/component/focus.cpp:17</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="html_like"></a>
html_like</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/html_like">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for allocator, operator&lt;&lt;, string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"> </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 paragraph, text, operator|, Element, border, Fit, color, hflow, spinner, vbox, bold, dim, underlined</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="box_8hpp.html">ftxui/screen/box.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Red</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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">using namespace </span>std::chrono_literals;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> img1 = []() { <span class="keywordflow">return</span> text(<span class="stringliteral">&quot;img&quot;</span>) | border; };</div>
<div class="line"> <span class="keyword">auto</span> img2 = []() { <span class="keywordflow">return</span> vbox({text(<span class="stringliteral">&quot;big&quot;</span>), text(<span class="stringliteral">&quot;image&quot;</span>)}) | border; };</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0;; ++i) {</div>
<div class="line"> <span class="keyword">auto</span> document = <span class="comment">//</span></div>
<div class="line"> hflow(</div>
<div class="line"> paragraph(<span class="stringliteral">&quot;Hello world! Here is an image:&quot;</span>), img1(),</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; Here is a text &quot;</span>), text(<span class="stringliteral">&quot;underlined &quot;</span>) | underlined,</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; Here is a text &quot;</span>), text(<span class="stringliteral">&quot;bold &quot;</span>) | bold,</div>
<div class="line"> paragraph(<span class="stringliteral">&quot;Hello world! Here is an image:&quot;</span>), img2(),</div>
<div class="line"> paragraph(</div>
<div class="line"> <span class="stringliteral">&quot;Le Lorem Ipsum est simplement du faux texte employé dans la &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;composition et la mise en page avant impression. Le Lorem &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;Ipsum est le faux texte standard de l&#39;imprimerie depuis les &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;années 1500, quand un imprimeur anonyme assembla ensemble &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;des morceaux de texte pour réaliser un livre spécimen de &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;polices de texte. Il n&#39;a pas fait que survivre cinq siècles, &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;mais s&#39;est aussi adapté à la bureautique informatique, sans &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;que son contenu n&#39;en soit modifié. Il a été popularisé dans &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;les années 1960 grâce à la vente de feuilles Letraset &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;contenant des passages du Lorem Ipsum, et, plus récemment, &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;par son inclusion dans des applications de mise en page de &quot;</span></div>
<div class="line"> <span class="stringliteral">&quot;texte, comme Aldus PageMaker.&quot;</span>),</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; Here is a text &quot;</span>), text(<span class="stringliteral">&quot;dim &quot;</span>) | dim,</div>
<div class="line"> paragraph(<span class="stringliteral">&quot;Hello world! Here is an image:&quot;</span>), img1(),</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; Here is a text &quot;</span>), text(<span class="stringliteral">&quot;red &quot;</span>) | color(Color::Red),</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; A spinner &quot;</span>), spinner(6, i / 10)) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> std::this_thread::sleep_for(0.01s);</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
<div class="ttc" id="abox_8hpp_html"><div class="ttname"><a href="box_8hpp.html">box.hpp</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="linear_gradient"></a>
linear_gradient</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/linear_gradient">Demo</a> </p><div class="fragment"><div class="line"><span class="comment">// Copyright 2023 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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for bgcolor, operator|, operator|=, text, center, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="linear__gradient_8hpp.html">ftxui/dom/linear_gradient.hpp</a>&gt;</span> <span class="comment">// for LinearGradient::Stop, LinearGradient</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::DeepPink1, Color::DeepSkyBlue1, Color::Yellow, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = text(<span class="stringliteral">&quot;gradient&quot;</span>) | center;</div>
<div class="line"> </div>
<div class="line"> document |= bgcolor(<a class="code hl_struct" href="group__dom.html#structftxui_1_1LinearGradient">LinearGradient</a>()</div>
<div class="line"> .Angle(45)</div>
<div class="line"> .Stop(Color::DeepPink1)</div>
<div class="line"> .Stop(Color::DeepSkyBlue1));</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Full());</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> 0;</div>
<div class="line">}</div>
<div class="ttc" id="agroup__dom_html_structftxui_1_1LinearGradient"><div class="ttname"><a href="group__dom.html#structftxui_1_1LinearGradient">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#l00032">linear_gradient.hpp:32</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><!-- fragment --><h1><a class="anchor" id="package_manager"></a>
package_manager</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/package_manager">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, text, Element, hbox, bold, color, filler, separator, vbox, window, gauge, Fit, size, dim, EQUAL, WIDTH</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, endl, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;list&gt;</span> <span class="comment">// for list, operator==, _List_iterator, _List_iterator&lt;&gt;::_Self</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr, allocator_traits&lt;&gt;::value_type</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for string, operator&lt;&lt;, to_string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Green, Color::Red, Color::RedLight, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">struct </span><a class="code hl_typedef" href="namespaceftxui.html#aaa92a82e968c721805c62787cd000534">Task</a> {</div>
<div class="line"> std::string name;</div>
<div class="line"> <span class="keywordtype">int</span> number_of_threads;</div>
<div class="line"> <span class="keywordtype">int</span> downloaded;</div>
<div class="line"> <span class="keywordtype">int</span> size;</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> std::list&lt;Task&gt; remaining_tasks = {</div>
<div class="line"> {<span class="stringliteral">&quot;contact server &quot;</span>, 10, 0, 6 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download index.html &quot;</span>, 10, 0, 9 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download script.js &quot;</span>, 1, 0, 3 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download style.js &quot;</span>, 1, 0, 4 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download image.png &quot;</span>, 1, 0, 5 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download big_1.png &quot;</span>, 1, 0, 30 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download icon_1.png &quot;</span>, 1, 0, 7 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download icon_2.png &quot;</span>, 1, 0, 8 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download big_2.png &quot;</span>, 1, 0, 30 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download small_1.png &quot;</span>, 1, 0, 10 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download small_2.png &quot;</span>, 1, 0, 11 * 25},</div>
<div class="line"> {<span class="stringliteral">&quot;download small_3.png &quot;</span>, 1, 0, 12 * 25},</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> std::list&lt;Task&gt; displayed_task;</div>
<div class="line"> </div>
<div class="line"> <span class="keywordtype">int</span> remaining_threads = 12;</div>
<div class="line"> </div>
<div class="line"> <span class="keywordtype">int</span> nb_queued = (int)remaining_tasks.size();</div>
<div class="line"> <span class="keywordtype">int</span> nb_active = 0;</div>
<div class="line"> <span class="keywordtype">int</span> nb_done = 0;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> to_text = [](<span class="keywordtype">int</span> number) {</div>
<div class="line"> <span class="keywordflow">return</span> text(std::to_string(number)) | size(WIDTH, EQUAL, 3);</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> renderTask = [&amp;](<span class="keyword">const</span> <a class="code hl_typedef" href="namespaceftxui.html#aaa92a82e968c721805c62787cd000534">Task</a>&amp; task) {</div>
<div class="line"> <span class="keyword">auto</span> style = (task.downloaded == task.size) ? dim : bold;</div>
<div class="line"> <span class="keywordflow">return</span> hbox({</div>
<div class="line"> text(task.name) | style,</div>
<div class="line"> separator(),</div>
<div class="line"> to_text(task.downloaded),</div>
<div class="line"> text(<span class="stringliteral">&quot;/&quot;</span>),</div>
<div class="line"> to_text(task.size),</div>
<div class="line"> separator(),</div>
<div class="line"> gauge(task.downloaded / <span class="keywordtype">float</span>(task.size)),</div>
<div class="line"> });</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> renderSummary = [&amp;]() {</div>
<div class="line"> <span class="keyword">auto</span> summary = vbox({</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;- done: &quot;</span>),</div>
<div class="line"> to_text(nb_done) | bold,</div>
<div class="line"> }) | color(Color::Green),</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;- active: &quot;</span>),</div>
<div class="line"> to_text(nb_active) | bold,</div>
<div class="line"> }) | color(Color::RedLight),</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;- queue: &quot;</span>),</div>
<div class="line"> to_text(nb_queued) | bold,</div>
<div class="line"> }) | color(Color::Red),</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> window(text(<span class="stringliteral">&quot; Summary &quot;</span>), summary);</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> render = [&amp;]() {</div>
<div class="line"> std::vector&lt;Element&gt; entries;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; task : displayed_task) {</div>
<div class="line"> entries.push_back(renderTask(task));</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> vbox({</div>
<div class="line"> <span class="comment">// List of tasks.</span></div>
<div class="line"> window(text(<span class="stringliteral">&quot; Task &quot;</span>), vbox(std::move(entries))),</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Summary.</span></div>
<div class="line"> hbox({</div>
<div class="line"> renderSummary(),</div>
<div class="line"> filler(),</div>
<div class="line"> }),</div>
<div class="line"> });</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> updateModel = [&amp;]() {</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; task : displayed_task) {</div>
<div class="line"> <span class="keywordflow">if</span> (task.downloaded != task.size) {</div>
<div class="line"> task.downloaded++;</div>
<div class="line"> } <span class="keywordflow">else</span> <span class="keywordflow">if</span> (task.number_of_threads) {</div>
<div class="line"> remaining_threads += task.number_of_threads;</div>
<div class="line"> task.number_of_threads = 0;</div>
<div class="line"> nb_active--;</div>
<div class="line"> nb_done++;</div>
<div class="line"> }</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">if</span> (remaining_tasks.size() &amp;&amp;</div>
<div class="line"> remaining_tasks.front().number_of_threads &lt;= remaining_threads) {</div>
<div class="line"> remaining_threads -= remaining_tasks.front().number_of_threads;</div>
<div class="line"> displayed_task.push_back(remaining_tasks.front());</div>
<div class="line"> remaining_tasks.pop_front();</div>
<div class="line"> nb_queued--;</div>
<div class="line"> nb_active++;</div>
<div class="line"> }</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (;;) {</div>
<div class="line"> <span class="comment">// Draw.</span></div>
<div class="line"> <span class="keyword">auto</span> document = render();</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Simulate time.</span></div>
<div class="line"> <span class="keyword">using namespace </span>std::chrono_literals;</div>
<div class="line"> std::this_thread::sleep_for(0.01s);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Exit</span></div>
<div class="line"> <span class="keywordflow">if</span> (nb_active + nb_queued == 0) {</div>
<div class="line"> <span class="keywordflow">break</span>;</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Update the model for the next frame.</span></div>
<div class="line"> updateModel();</div>
<div class="line"> }</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
<div class="ttc" id="anamespaceftxui_html_aaa92a82e968c721805c62787cd000534"><div class="ttname"><a href="namespaceftxui.html#aaa92a82e968c721805c62787cd000534">ftxui::Task</a></div><div class="ttdeci">std::variant&lt; Event, Closure, AnimationTask &gt; Task</div><div class="ttdef"><b>Definition</b> <a href="task_8hpp_source.html#l00014">task.hpp:14</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="paragraph"></a>
paragraph</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/paragraph">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for string, operator&lt;&lt;</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"> </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 hflow, paragraph, separator, hbox, vbox, filler, operator|, border, Element</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="box_8hpp.html">ftxui/screen/box.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keyword">using namespace </span>std::chrono_literals;</div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</div>
<div class="line"> <span class="keyword">using namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a>;</div>
<div class="line"> std::string p =</div>
<div class="line"> R<span class="stringliteral">&quot;(In probability theory and statistics, Bayes&#39; theorem (alternatively Bayes&#39; law or Bayes&#39; rule) describes the probability of an event, based on prior knowledge of conditions that might be related to the event. For example, if cancer is related to age, then, using Bayes&#39; theorem, a person&#39;s age can be used to more accurately assess the probability that they have cancer, compared to the assessment of the probability of cancer made without knowledge of the person&#39;s age. One of the many applications of Bayes&#39; theorem is Bayesian inference, a particular approach to statistical inference. When applied, the probabilities involved in Bayes&#39; theorem may have different probability interpretations. With the Bayesian probability interpretation the theorem expresses how a subjective degree of belief should rationally change to account for availability of related evidence. Bayesian inference is fundamental to Bayesian statistics.)&quot;;</span></div>
<div class="line"><span class="stringliteral"></span> </div>
<div class="line"><span class="stringliteral"> std::string reset_position;</span></div>
<div class="line"><span class="stringliteral"> </span><span class="keywordflow">while</span> (<span class="keyword">true</span>) {</div>
<div class="line"> <span class="keyword">auto</span> document = vbox({</div>
<div class="line"> hflow(paragraph(p)),</div>
<div class="line"> separator(),</div>
<div class="line"> hflow(paragraph(p)),</div>
<div class="line"> separator(),</div>
<div class="line"> hbox({</div>
<div class="line"> hflow(paragraph(p)),</div>
<div class="line"> separator(),</div>
<div class="line"> hflow(paragraph(p)),</div>
<div class="line"> }),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> document = vbox(filler(), document);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// auto screen = Screen::Create(Dimension::Fit(document));</span></div>
<div class="line"> <span class="comment">// Render(screen, document);</span></div>
<div class="line"> <span class="comment">// screen.Print();</span></div>
<div class="line"> <span class="comment">// getchar();</span></div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full());</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> std::this_thread::sleep_for(0.01s);</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="separator"></a>
separator</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/separator">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, center, separator, operator|, flex, Element, vbox, Fit, hbox, border</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;left-column&quot;</span>),</div>
<div class="line"> separator(),</div>
<div class="line"> vbox({</div>
<div class="line"> center(text(<span class="stringliteral">&quot;top&quot;</span>)) | flex,</div>
<div class="line"> separator(),</div>
<div class="line"> center(text(<span class="stringliteral">&quot;bottom&quot;</span>)),</div>
<div class="line"> }) | flex,</div>
<div class="line"> separator(),</div>
<div class="line"> text(<span class="stringliteral">&quot;right-column&quot;</span>),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="separator_style"></a>
separator_style</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/separator_style">Demo</a> </p><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">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for endl, cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </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 text, hbox, separatorDouble, separatorHeavy, separatorLight, vbox, operator|, Element, Fit, borderDouble, borderHeavy, borderLight</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="box_8hpp.html">ftxui/screen/box.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">auto</span> document = vbox({</div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;separatorLight&quot;</span>),</div>
<div class="line"> separatorLight(),</div>
<div class="line"> hbox(text(<span class="stringliteral">&quot;left&quot;</span>), separatorLight(), text(<span class="stringliteral">&quot;right&quot;</span>)),</div>
<div class="line"> }) | borderLight,</div>
<div class="line"> </div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;separatorDashed&quot;</span>),</div>
<div class="line"> separatorDashed(),</div>
<div class="line"> hbox(text(<span class="stringliteral">&quot;left&quot;</span>), separatorDashed(), text(<span class="stringliteral">&quot;right&quot;</span>)),</div>
<div class="line"> }) | borderDashed,</div>
<div class="line"> </div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;separatorHeavy&quot;</span>),</div>
<div class="line"> separatorHeavy(),</div>
<div class="line"> hbox(text(<span class="stringliteral">&quot;left&quot;</span>), separatorHeavy(), text(<span class="stringliteral">&quot;right&quot;</span>)),</div>
<div class="line"> }) | borderHeavy,</div>
<div class="line"> </div>
<div class="line"> vbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;separatorDouble&quot;</span>),</div>
<div class="line"> separatorDouble(),</div>
<div class="line"> hbox(text(<span class="stringliteral">&quot;left&quot;</span>), separatorDouble(), text(<span class="stringliteral">&quot;right&quot;</span>)),</div>
<div class="line"> }) | borderDouble,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen =</div>
<div class="line"> Screen::Create(Dimension::Fit(document), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="size"></a>
size</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/size">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, text, Element, hcenter, Fit, hbox, size, window, Elements, bold, dim, EQUAL, WIDTH</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for string, to_string</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a> = [](<span class="keyword">const</span> std::string&amp; title) {</div>
<div class="line"> <span class="keywordflow">return</span> window(text(title) | hcenter | bold,</div>
<div class="line"> text(<span class="stringliteral">&quot;content&quot;</span>) | hcenter | dim);</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> content;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> x = 3; x &lt; 30; ++x) {</div>
<div class="line"> content.push_back(<a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(std::to_string(x)) | size(WIDTH, EQUAL, x));</div>
<div class="line"> }</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = hbox(std::move(content));</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="spinner"></a>
spinner</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/spinner">Demo</a> </p><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">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for Element, operator|, separator, filler, hbox, size, spinner, text, vbox, bold, border, Fit, EQUAL, WIDTH</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for cout, endl, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for to_string, operator&lt;&lt;, string</span></div>
<div class="line"><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for</span></div>
<div class="line"><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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">using namespace </span>std::chrono_literals;</div>
<div class="line"> </div>
<div class="line"> std::string reset_position;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> index = 0; index &lt; 200; ++index) {</div>
<div class="line"> std::vector&lt;Element&gt; entries;</div>
<div class="line"> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; 23; ++i) {</div>
<div class="line"> <span class="keywordflow">if</span> (i != 0) {</div>
<div class="line"> entries.push_back(separator());</div>
<div class="line"> }</div>
<div class="line"> entries.push_back( <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(std::to_string(i)) | size(WIDTH, EQUAL, 2),</div>
<div class="line"> separator(),</div>
<div class="line"> spinner(i, index) | bold,</div>
<div class="line"> }));</div>
<div class="line"> }</div>
<div class="line"> <span class="keyword">auto</span> document = hbox({</div>
<div class="line"> vbox(std::move(entries)) | border,</div>
<div class="line"> filler(),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> std::cout &lt;&lt; reset_position;</div>
<div class="line"> screen.Print();</div>
<div class="line"> reset_position = screen.ResetPosition();</div>
<div class="line"> </div>
<div class="line"> std::this_thread::sleep_for(0.1s);</div>
<div class="line"> }</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_blink"></a>
style_blink</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_blink">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, blink, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;blink&quot;</span>) | blink,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_bold"></a>
style_bold</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_bold">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, bold, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;bold&quot;</span>) | bold,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_color"></a>
style_color</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_color">Demo</a> </p><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">#include &lt;<a class="code" href="linear__gradient_8hpp.html">ftxui/dom/linear_gradient.hpp</a>&gt;</span> <span class="comment">// for LinearGradient</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </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 text, bgcolor, color, vbox, filler, Fit, hbox</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, operator&quot;&quot;_rgb, Color::Black, Color::Blue, Color::BlueLight, Color::Cyan, Color::CyanLight, Color::DeepSkyBlue4, Color::Default, Color::GrayDark, Color::GrayLight, Color::Green, Color::GreenLight, Color::Magenta, Color::MagentaLight, Color::Red, Color::RedLight, Color::SkyBlue1, Color::White, Color::Yellow, Color::YellowLight, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = hbox({</div>
<div class="line"> vbox({</div>
<div class="line"> color(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> color(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> color(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> color(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> color(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> color(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> color(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> color(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> color(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> color(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> color(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> color(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> color(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> color(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> color(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> color(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> color(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"> color(0x66ff66_rgb, text(<span class="stringliteral">&quot;Phosphor&quot;</span>)),</div>
<div class="line"> color(<a class="code hl_struct" href="group__dom.html#structftxui_1_1LinearGradient">LinearGradient</a>(Color::SkyBlue1, Color::DeepSkyBlue4),</div>
<div class="line"> text(<span class="stringliteral">&quot;Skyblue to DeepSkyBlue&quot;</span>)),</div>
<div class="line"> }),</div>
<div class="line"> vbox({</div>
<div class="line"> bgcolor(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> bgcolor(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> bgcolor(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> bgcolor(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> bgcolor(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> bgcolor(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> bgcolor(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> bgcolor(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"> bgcolor(0x66ff66_rgb, text(<span class="stringliteral">&quot;Phosphor&quot;</span>)),</div>
<div class="line"> bgcolor(<a class="code hl_struct" href="group__dom.html#structftxui_1_1LinearGradient">LinearGradient</a>(Color::SkyBlue1, Color::DeepSkyBlue4),</div>
<div class="line"> text(<span class="stringliteral">&quot;Skyblue to DeepSkyBlue&quot;</span>)),</div>
<div class="line"> }),</div>
<div class="line"> filler(),</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_dim"></a>
style_dim</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_dim">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, dim, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;dim&quot;</span>) | dim,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_gallery"></a>
style_gallery</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_gallery">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, Element, bgcolor, color, blink, bold, dim, inverted, underlined, Fit, hbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Blue, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="comment">// clang-format off</span></div>
<div class="line"> <span class="keyword">auto</span> document =</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;normal&quot;</span>) , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;bold&quot;</span>) | bold , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;italic&quot;</span>) | italic , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;dim&quot;</span>) | dim , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;inverted&quot;</span>) | inverted , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;underlined&quot;</span>) | underlined , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;underlinedDouble&quot;</span>) | underlinedDouble , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;blink&quot;</span>) | blink , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;strikethrough&quot;</span>) | strikethrough , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;color&quot;</span>) | color(Color::Blue) , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;bgcolor&quot;</span>) | bgcolor(Color::Blue) , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;hyperlink&quot;</span>) | hyperlink(<span class="stringliteral">&quot;https://github.com/ArthurSonzogni/FTXUI&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="comment">// clang-format on</span></div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_hyperlink"></a>
style_hyperlink</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_hyperlink">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, bold, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is an &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;hyperlink&quot;</span>) | hyperlink(<span class="stringliteral">&quot;https://www.google.com&quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_inverted"></a>
style_inverted</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_inverted">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, inverted, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;inverted&quot;</span>) | inverted,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_italic"></a>
style_italic</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_italic">Demo</a> </p><div class="fragment"><div class="line"><span class="comment">// Copyright 2025 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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, inverted, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;italic&quot;</span>) | italic,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_strikethrough"></a>
style_strikethrough</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_strikethrough">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, strikethrough, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;strikethrough&quot;</span>) | strikethrough,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_underlined"></a>
style_underlined</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_underlined">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, underlined, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;underlined&quot;</span>) | underlined,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="style_underlined_double"></a>
style_underlined_double</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/style_underlined_double">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for text, operator|, underlinedDouble, Fit, hbox, Element</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;This text is &quot;</span>),</div>
<div class="line"> text(<span class="stringliteral">&quot;underlinedDouble&quot;</span>) | underlinedDouble,</div>
<div class="line"> text(<span class="stringliteral">&quot;. Do you like it?&quot;</span>),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</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> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="table"></a>
table</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/table">Demo</a> </p><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">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for color, Fit, LIGHT, align_right, bold, DOUBLE</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="table_8hpp.html">ftxui/dom/table.hpp</a>&gt;</span> <span class="comment">// for Table, TableSelection</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;iostream&gt;</span> <span class="comment">// for endl, cout, ostream</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for basic_string, allocator, string</span></div>
<div class="line"><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for Color, Color::Blue, Color::Cyan, Color::White, ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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="keyword">auto</span> table = <a class="code hl_class" href="group__dom.html#classftxui_1_1Table">Table</a>({</div>
<div class="line"> {<span class="stringliteral">&quot;Version&quot;</span>, <span class="stringliteral">&quot;Marketing name&quot;</span>, <span class="stringliteral">&quot;Release date&quot;</span>, <span class="stringliteral">&quot;API level&quot;</span>, <span class="stringliteral">&quot;Runtime&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;2.3&quot;</span>, <span class="stringliteral">&quot;Gingerbread&quot;</span>, <span class="stringliteral">&quot;February 9 2011&quot;</span>, <span class="stringliteral">&quot;10&quot;</span>, <span class="stringliteral">&quot;Dalvik 1.4.0&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;4.0&quot;</span>, <span class="stringliteral">&quot;Ice Cream Sandwich&quot;</span>, <span class="stringliteral">&quot;October 19 2011&quot;</span>, <span class="stringliteral">&quot;15&quot;</span>, <span class="stringliteral">&quot;Dalvik&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;4.1&quot;</span>, <span class="stringliteral">&quot;Jelly Bean&quot;</span>, <span class="stringliteral">&quot;July 9 2012&quot;</span>, <span class="stringliteral">&quot;16&quot;</span>, <span class="stringliteral">&quot;Dalvik&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;4.2&quot;</span>, <span class="stringliteral">&quot;Jelly Bean&quot;</span>, <span class="stringliteral">&quot;November 13 2012&quot;</span>, <span class="stringliteral">&quot;17&quot;</span>, <span class="stringliteral">&quot;Dalvik&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;4.3&quot;</span>, <span class="stringliteral">&quot;Jelly Bean&quot;</span>, <span class="stringliteral">&quot;July 24 2013&quot;</span>, <span class="stringliteral">&quot;18&quot;</span>, <span class="stringliteral">&quot;Dalvik&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;4.4&quot;</span>, <span class="stringliteral">&quot;KitKat&quot;</span>, <span class="stringliteral">&quot;October 31 2013&quot;</span>, <span class="stringliteral">&quot;19&quot;</span>, <span class="stringliteral">&quot;Dalvik and ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;5.0&quot;</span>, <span class="stringliteral">&quot;Lollipop&quot;</span>, <span class="stringliteral">&quot;November 3 2014&quot;</span>, <span class="stringliteral">&quot;21&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;5.1&quot;</span>, <span class="stringliteral">&quot;Lollipop&quot;</span>, <span class="stringliteral">&quot;March 9 2015&quot;</span>, <span class="stringliteral">&quot;22&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;6.0&quot;</span>, <span class="stringliteral">&quot;Marshmallow&quot;</span>, <span class="stringliteral">&quot;October 5 2015&quot;</span>, <span class="stringliteral">&quot;23&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;7.0&quot;</span>, <span class="stringliteral">&quot;Nougat&quot;</span>, <span class="stringliteral">&quot;August 22 2016&quot;</span>, <span class="stringliteral">&quot;24&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;7.1&quot;</span>, <span class="stringliteral">&quot;Nougat&quot;</span>, <span class="stringliteral">&quot;October 4 2016&quot;</span>, <span class="stringliteral">&quot;25&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;8.0&quot;</span>, <span class="stringliteral">&quot;Oreo&quot;</span>, <span class="stringliteral">&quot;August 21 2017&quot;</span>, <span class="stringliteral">&quot;26&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;8.1&quot;</span>, <span class="stringliteral">&quot;Oreo&quot;</span>, <span class="stringliteral">&quot;December 5 2017&quot;</span>, <span class="stringliteral">&quot;27&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;9&quot;</span>, <span class="stringliteral">&quot;Pie&quot;</span>, <span class="stringliteral">&quot;August 6 2018&quot;</span>, <span class="stringliteral">&quot;28&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;10&quot;</span>, <span class="stringliteral">&quot;10&quot;</span>, <span class="stringliteral">&quot;September 3 2019&quot;</span>, <span class="stringliteral">&quot;29&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> {<span class="stringliteral">&quot;11&quot;</span>, <span class="stringliteral">&quot;11&quot;</span>, <span class="stringliteral">&quot;September 8 2020&quot;</span>, <span class="stringliteral">&quot;30&quot;</span>, <span class="stringliteral">&quot;ART&quot;</span>},</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> table.<a class="code hl_function" href="group__dom.html#ad5f50927f54334b84514bc4b11a14d71">SelectAll</a>().<a class="code hl_function" href="classftxui_1_1TableSelection.html#af47b05e5a3f01cafc419ce94388cae51">Border</a>(LIGHT);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Add border around the first column.</span></div>
<div class="line"> table.SelectColumn(0).Border(LIGHT);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Make first row bold with a double border.</span></div>
<div class="line"> table.SelectRow(0).Decorate(bold);</div>
<div class="line"> table.SelectRow(0).SeparatorVertical(LIGHT);</div>
<div class="line"> table.SelectRow(0).Border(DOUBLE);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Align right the &quot;Release date&quot; column.</span></div>
<div class="line"> table.SelectColumn(2).DecorateCells(align_right);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// Select row from the second to the last.</span></div>
<div class="line"> <span class="keyword">auto</span> content = table.SelectRows(1, -1);</div>
<div class="line"> <span class="comment">// Alternate in between 3 colors.</span></div>
<div class="line"> content.DecorateCellsAlternateRow(color(Color::Blue), 3, 0);</div>
<div class="line"> content.DecorateCellsAlternateRow(color(Color::Cyan), 3, 1);</div>
<div class="line"> content.DecorateCellsAlternateRow(color(Color::White), 3, 2);</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = table.Render();</div>
<div class="line"> <span class="keyword">auto</span> screen =</div>
<div class="line"> Screen::Create(Dimension::Fit(document, <span class="comment">/*extend_beyond_screen=*/</span><span class="keyword">true</span>));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> std::cout &lt;&lt; std::endl;</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
<div class="ttc" id="aclassftxui_1_1TableSelection_html_af47b05e5a3f01cafc419ce94388cae51"><div class="ttname"><a href="classftxui_1_1TableSelection.html#af47b05e5a3f01cafc419ce94388cae51">ftxui::TableSelection::Border</a></div><div class="ttdeci">void Border(BorderStyle border=LIGHT)</div><div class="ttdoc">Apply a border around the selection.</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2table_8cpp_source.html#l00344">src/ftxui/dom/table.cpp:344</a></div></div>
<div class="ttc" id="agroup__dom_html_ad5f50927f54334b84514bc4b11a14d71"><div class="ttname"><a href="group__dom.html#ad5f50927f54334b84514bc4b11a14d71">ftxui::Table::SelectAll</a></div><div class="ttdeci">TableSelection SelectAll()</div><div class="ttdoc">Select all the table.</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2table_8cpp_source.html#l00200">src/ftxui/dom/table.cpp:200</a></div></div>
<div class="ttc" id="agroup__dom_html_classftxui_1_1Table"><div class="ttname"><a href="group__dom.html#classftxui_1_1Table">ftxui::Table</a></div><div class="ttdoc">Table is a utility to draw tables.</div><div class="ttdef"><b>Definition</b> <a href="table_8hpp_source.html#l00036">table.hpp:36</a></div></div>
<div class="ttc" id="atable_8hpp_html"><div class="ttname"><a href="table_8hpp.html">table.hpp</a></div></div>
</div><!-- fragment --><h1><a class="anchor" id="vbox_hbox"></a>
vbox_hbox</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/vbox_hbox">Demo</a> </p><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">#include &lt;stdio.h&gt;</span> <span class="comment">// for getchar</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for filler, text, hbox, vbox</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> document = <span class="comment">//</span></div>
<div class="line"> vbox({</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;north-west&quot;</span>),</div>
<div class="line"> filler(),</div>
<div class="line"> text(<span class="stringliteral">&quot;north-east&quot;</span>),</div>
<div class="line"> }),</div>
<div class="line"> filler(),</div>
<div class="line"> hbox({</div>
<div class="line"> filler(),</div>
<div class="line"> text(<span class="stringliteral">&quot;center&quot;</span>),</div>
<div class="line"> filler(),</div>
<div class="line"> }),</div>
<div class="line"> filler(),</div>
<div class="line"> hbox({</div>
<div class="line"> text(<span class="stringliteral">&quot;south-west&quot;</span>),</div>
<div class="line"> filler(),</div>
<div class="line"> text(<span class="stringliteral">&quot;south-east&quot;</span>),</div>
<div class="line"> }),</div>
<div class="line"> });</div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full());</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> getchar();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --><h1><a class="anchor" id="vflow"></a>
vflow</h1>
<p><a href="https://arthursonzogni.github.io/FTXUI/examples/?file=dom/vflow">Demo</a> </p><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">#include &lt;stdio.h&gt;</span> <span class="comment">// for getchar</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&gt;</span> <span class="comment">// for operator|, Element, size, text, hcenter, Fit, vflow, window, EQUAL, bold, border, dim, HEIGHT, WIDTH</span></div>
<div class="line"><span class="preprocessor">#include &lt;<a class="code" href="screen_8hpp.html">ftxui/screen/screen.hpp</a>&gt;</span> <span class="comment">// for Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for allocator, char_traits, operator+, to_string, string</span></div>
<div class="line"> </div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="node_8hpp.html">ftxui/dom/node.hpp</a>&quot;</span> <span class="comment">// for Render</span></div>
<div class="line"><span class="preprocessor">#include &quot;<a class="code" href="color_8hpp.html">ftxui/screen/color.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"> </div>
<div class="line"><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</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> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a> = [](<span class="keywordtype">int</span> dimx, <span class="keywordtype">int</span> dimy) {</div>
<div class="line"> std::string title = std::to_string(dimx) + <span class="stringliteral">&quot;x&quot;</span> + std::to_string(dimy);</div>
<div class="line"> <span class="keywordflow">return</span> window(text(title) | hcenter | bold,</div>
<div class="line"> text(<span class="stringliteral">&quot;content&quot;</span>) | hcenter | dim) |</div>
<div class="line"> size(WIDTH, EQUAL, dimx) | size(HEIGHT, EQUAL, dimy);</div>
<div class="line"> };</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> document = vflow({</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(7, 7),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(7, 5),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(5, 7),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(11, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 5),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(12, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 4),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 3),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(13, 3),</div>
<div class="line"> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 3),</div>
<div class="line"> }) |</div>
<div class="line"> border;</div>
<div class="line"> </div>
<div class="line"> <span class="keyword">auto</span> screen = Screen::Create(Dimension::Full(), Dimension::Fit(document));</div>
<div class="line"> Render(screen, document);</div>
<div class="line"> screen.Print();</div>
<div class="line"> getchar();</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> 0;</div>
<div class="line">}</div>
</div><!-- fragment --> </div></div><!-- contents -->
</div><!-- PageDoc -->
</div><!-- doc-content -->
<!-- HTML footer for doxygen 1.9.8-->
<!-- start footer part -->
<div id="nav-path" class="navpath"><!-- id is needed for treeview function! -->
<ul>
<li class="navelem"><a class="el" href="module-dom.html">ftxui / dom</a></li>
<li class="footer">Generated by <a href="https://www.doxygen.org/index.html"><img class="footer" src="doxygen.svg" width="104" height="31" alt="doxygen"/></a> 1.12.0 </li>
</ul>
</div>
</body>
</html>