Files
FTXUI/zh-CH/module-dom-examples.html
2025-12-13 19:38:34 +00:00

2184 lines
210 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!-- HTML header for doxygen 1.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="zh">
<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 -->
<!-- 制作者 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','搜索',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">载入中...</div>
<div class="SRStatus" id="Searching">搜索中...</div>
<div class="SRStatus" id="NoMatches">未找到</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>目录</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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> <a class="code hl_variable" href="with__restored__io_8cpp.html#a1a8bb385160d2854b0c2ebb85db2d212">EXIT_SUCCESS</a>;</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>定义</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">#include &quot;ftxui/component/component_base.hpp&quot; // 用于 ComponentBase</div><div class="ttdef"><b>定义</b> <a href="animation_8hpp_source.html#l00009">animation.hpp:9</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 class="ttc" id="awith__restored__io_8cpp_html_a1a8bb385160d2854b0c2ebb85db2d212"><div class="ttname"><a href="with__restored__io_8cpp.html#a1a8bb385160d2854b0c2ebb85db2d212">EXIT_SUCCESS</a></div><div class="ttdeci">return EXIT_SUCCESS</div><div class="ttdef"><b>定义</b> <a href="with__restored__io_8cpp_source.html#l00057">with_restored_io.cpp:57</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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>) | <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(LIGHT, Color::Red),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDashed&quot;</span>) | <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(DASHED, Color::Green),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderHeavy&quot;</span>) | <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(HEAVY, Color::Blue),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDouble&quot;</span>) | <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(DOUBLE, Color::Yellow),</div>
<div class="line"> text(<span class="stringliteral">&quot;borderRounded&quot;</span>) | <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(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() | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red),</div>
<div class="line"> make_boxed(),</div>
<div class="line"> separator() | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red),</div>
<div class="line"> make_boxed(),</div>
<div class="line"> }) |</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a>(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 class="ttc" id="agroup__dom_html_ga050df9c8ed04eec13309d6c0542c636d"><div class="ttname"><a href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a></div><div class="ttdeci">Element color(const LinearGradient &amp;gradient, Element child)</div><div class="ttdoc">使用线性渐变效果设置元素的前景色。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2linear__gradient_8cpp_source.html#l00239">src/ftxui/dom/linear_gradient.cpp:239</a></div></div>
<div class="ttc" id="agroup__dom_html_gabc9db79957d4dd36deb8ca79938e4c41"><div class="ttname"><a href="group__dom.html#gabc9db79957d4dd36deb8ca79938e4c41">borderStyled</a></div><div class="ttdeci">Decorator borderStyled(BorderStyle style)</div><div class="ttdoc">与 border 相同,但具有不同的样式。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00241">src/ftxui/dom/border.cpp:241</a></div></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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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>) | <a class="code hl_function" href="group__dom.html#gaa074cdab57eeb47b99f1699bcc8addd8">borderLight</a>,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDashed&quot;</span>) | <a class="code hl_function" href="group__dom.html#ga181c80f8ada12d1356f6bfa0ebb7219f">borderDashed</a>,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderHeavy&quot;</span>) | <a class="code hl_function" href="group__dom.html#ga666c31419cc31cdadc9f8178ed63529e">borderHeavy</a>,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderDouble&quot;</span>) | <a class="code hl_function" href="group__dom.html#ga052b504344f3bc1ff86b3493cd934215">borderDouble</a>,</div>
<div class="line"> text(<span class="stringliteral">&quot;borderRounded&quot;</span>) | <a class="code hl_function" href="group__dom.html#ga3cf2db223a5efaa370f0ca6bb405b80e">borderRounded</a>,</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 class="ttc" id="agroup__dom_html_ga052b504344f3bc1ff86b3493cd934215"><div class="ttname"><a href="group__dom.html#ga052b504344f3bc1ff86b3493cd934215">borderDouble</a></div><div class="ttdeci">Element borderDouble(Element child)</div><div class="ttdoc">在元素周围绘制双线边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00405">src/ftxui/dom/border.cpp:405</a></div></div>
<div class="ttc" id="agroup__dom_html_ga181c80f8ada12d1356f6bfa0ebb7219f"><div class="ttname"><a href="group__dom.html#ga181c80f8ada12d1356f6bfa0ebb7219f">borderDashed</a></div><div class="ttdeci">Element borderDashed(Element child)</div><div class="ttdoc">在元素周围绘制虚线边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00300">src/ftxui/dom/border.cpp:300</a></div></div>
<div class="ttc" id="agroup__dom_html_ga3cf2db223a5efaa370f0ca6bb405b80e"><div class="ttname"><a href="group__dom.html#ga3cf2db223a5efaa370f0ca6bb405b80e">borderRounded</a></div><div class="ttdeci">Element borderRounded(Element child)</div><div class="ttdoc">在元素周围绘制圆角边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00440">src/ftxui/dom/border.cpp:440</a></div></div>
<div class="ttc" id="agroup__dom_html_ga666c31419cc31cdadc9f8178ed63529e"><div class="ttname"><a href="group__dom.html#ga666c31419cc31cdadc9f8178ed63529e">borderHeavy</a></div><div class="ttdeci">Element borderHeavy(Element child)</div><div class="ttdoc">在元素周围绘制粗边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00370">src/ftxui/dom/border.cpp:370</a></div></div>
<div class="ttc" id="agroup__dom_html_gaa074cdab57eeb47b99f1699bcc8addd8"><div class="ttname"><a href="group__dom.html#gaa074cdab57eeb47b99f1699bcc8addd8">borderLight</a></div><div class="ttdeci">Element borderLight(Element child)</div><div class="ttdoc">在元素周围绘制细边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00335">src/ftxui/dom/border.cpp:335</a></div></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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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">// 三角形:</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">// 圆形,未填充和已填充:</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">// 绘制函数:</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) | <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>;</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_gae8537acd423d47cf07e61bd774fb1098"><div class="ttname"><a href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a></div><div class="ttdeci">Element border(Element child)</div><div class="ttdoc">在元素周围绘制边框。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00225">src/ftxui/dom/border.cpp:225</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 是一个与绘图操作相关的可绘制缓冲区。</div><div class="ttdef"><b>定义</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>定义</b> <a href="pixel_8hpp_source.html#l00048">pixel.hpp:48</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>定义</b> <a href="pixel_8hpp_source.html#l00032">pixel.hpp:32</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">一个 Unicode 字符及其相关样式。</div><div class="ttdef"><b>定义</b> <a href="pixel_8hpp_source.html#l00014">pixel.hpp:14</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码受 MIT 许可协议的约束,详情请参阅 LICENSE 文件。</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"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>))</div>
<div class="line"> ),</div>
<div class="line"> vbox(</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(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>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(<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">// 真彩色显示。</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"> | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::HSV(hue, saturation, value)) <span class="comment">//</span></div>
<div class="line"> | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(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"> <a class="code hl_namespace" href="namespaceTerminal.html">Terminal</a>::ColorSupport() &gt;= <a class="code hl_namespace" href="namespaceTerminal.html">Terminal</a>::<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"> <a class="code hl_namespace" href="namespaceTerminal.html">Terminal</a>::ColorSupport() &gt;= <a class="code hl_namespace" href="namespaceTerminal.html">Terminal</a>::<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>定义</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__dom_html_gaaac1622d43662a6a02113d9230a4fdd4"><div class="ttname"><a href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a></div><div class="ttdeci">Element bgcolor(const LinearGradient &amp;gradient, Element child)</div><div class="ttdoc">使用线性渐变效果设置元素的背景色。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2linear__gradient_8cpp_source.html#l00255">src/ftxui/dom/linear_gradient.cpp:255</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>定义</b> <a href="color_8hpp_source.html#l00070">color.hpp:70</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 是一个表示终端用户界面中颜色的类。</div><div class="ttdef"><b>定义</b> <a href="color_8hpp_source.html#l00020">color.hpp:20</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>定义</b> <a href="terminal_8hpp_source.html#l00025">terminal.hpp:25</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>定义</b> <a href="terminal_8hpp_source.html#l00024">terminal.hpp:24</a></div></div>
<div class="ttc" id="anamespaceTerminal_html"><div class="ttname"><a href="namespaceTerminal.html">Terminal</a></div><div class="ttdoc">FTXUI ftxui::Terminal:: 命名空间</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>定义</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 绘制每一列</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>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(<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. 版权所有。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可协议约束,</span></div>
<div class="line"><span class="comment">// 该协议可在 LICENSE 文件中找到。</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"> | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::HSV(hue, saturation, value)) <span class="comment">//</span></div>
<div class="line"> | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RGB(v, 0, 0)));</div>
<div class="line"> green_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RGB(0, v, 0)));</div>
<div class="line"> blue_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RGB(0, 0, v)));</div>
<div class="line"> cyan_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RGB(0, v, v)));</div>
<div class="line"> magenta_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RGB(v, 0, v)));</div>
<div class="line"> yellow_line.push_back(text(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(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"> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(text(<span class="stringliteral">&quot;原色&quot;</span>),</div>
<div class="line"> vbox({</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;红色线条 :&quot;</span>), hbox(std::move(red_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;绿色线条 :&quot;</span>), hbox(std::move(green_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;蓝色线条 :&quot;</span>), hbox(std::move(blue_line))}),</div>
<div class="line"> })),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(text(<span class="stringliteral">&quot;次生色&quot;</span>),</div>
<div class="line"> vbox({</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;青色线条 :&quot;</span>), hbox(std::move(cyan_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;洋红色线条:&quot;</span>), hbox(std::move(magenta_line))}),</div>
<div class="line"> hbox({text(<span class="stringliteral">&quot;黄色线条 :&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 class="ttc" id="agroup__dom_html_ga03049def08fa7a5eaa4d5e897152bc1a"><div class="ttname"><a href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a></div><div class="ttdeci">Element window(Element title, Element content, BorderStyle border)</div><div class="ttdoc">绘制带有标题和边框的窗口。</div><div class="ttdef"><b>定义</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00507">src/ftxui/dom/border.cpp:507</a></div></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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码受 MIT 许可证的约束,可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">像素的矩形网格。</div><div class="ttdef"><b>定义</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">// 版权所有 2022 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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)) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::BlueLight),</div>
<div class="line"> separator(),</div>
<div class="line"> graph(std::ref(my_graph)) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::RedLight),</div>
<div class="line"> separator(),</div>
<div class="line"> graph(std::ref(my_graph)) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::YellowLight),</div>
<div class="line"> }) | flex,</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> document |= <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>;</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>定义</b> <a href="examples_2dom_2graph_8cpp_source.html#l00036">examples/dom/graph.cpp:36</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">// 版权所有 2021 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可协议的约束,该协议可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</span></div>
<div class="line"><span class="preprocessor">#include &lt;stdio.h&gt;</span> <span class="comment">// 用于 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">// 用于 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">// 用于 Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// 用于 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">// 用于 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">// 用于 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) | <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>; };</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的管辖MIT 许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(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>定义</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. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可协议的约束,该协议可在 LICENSE 文件中找到。</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>) | <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>; };</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>) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red),</div>
<div class="line"> paragraph(<span class="stringliteral">&quot; A spinner &quot;</span>), spinner(6, i / 10)) |</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>;</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">// 本源代码的使用受 MIT 许可协议的约束,该协议可在 LICENSE 文件中找到。</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">// 用于 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">// 用于 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">// 用于 Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// 用于 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">// 用于 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">// 用于 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 |= <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(<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">一个表示线性渐变颜色效果设置的类。</div><div class="ttdef"><b>定义</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可的约束MIT 许可可在以下文件中找到:</span></div>
<div class="line"><span class="comment">// LICENSE 文件。</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"> }) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(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"> }) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(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"> }) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red),</div>
<div class="line"> });</div>
<div class="line"> </div>
<div class="line"> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(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">// 任务列表。</span></div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(text(<span class="stringliteral">&quot; Task &quot;</span>), vbox(std::move(entries))),</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// 摘要。</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">// 绘图。</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">// 模拟时间。</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">// 退出</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">// 更新模型以用于下一帧。</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>定义</b> <a href="task_8hpp_source.html#l00013">task.hpp:13</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证约束,可在 LICENSE 文件中找到。</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;(在概率论和统计学中,贝叶斯定理(或称贝叶斯法则、贝叶斯规则)描述了一个事件的概率,该概率基于与该事件相关的先验条件知识。例如,如果癌症与年龄相关,那么使用贝叶斯定理,一个人的年龄可以用来更准确地评估他们患癌症的概率,相比于在不了解其年龄的情况下对癌症概率的评估。贝叶斯定理的众多应用之一是贝叶斯推断,这是一种特殊的统计推断方法。应用时,贝叶斯定理中涉及的概率可能具有不同的概率解释。根据贝叶斯概率解释,该定理表达了主观信念程度应如何理性地改变以解释相关证据的可用性。贝叶斯推断是贝叶斯统计学的基础。)&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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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)) | <a class="code hl_function" href="group__dom.html#gae8537acd423d47cf07e61bd774fb1098">border</a>,</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(0x66ff66_rgb, text(<span class="stringliteral">&quot;Phosphor&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(<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"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Default, text(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Black, text(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GrayDark, text(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GrayLight, text(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::White, text(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Blue, text(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::BlueLight, text(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Cyan, text(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::CyanLight, text(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Green, text(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::GreenLight, text(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Magenta, text(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::MagentaLight, text(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Red, text(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::RedLight, text(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::Yellow, text(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(Color::YellowLight, text(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(0x66ff66_rgb, text(<span class="stringliteral">&quot;Phosphor&quot;</span>)),</div>
<div class="line"> <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(<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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 用于 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">// 用于 Full, Screen</span></div>
<div class="line"><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// 用于 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">// 用于 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">// 用于 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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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>) | <a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Blue) , text(<span class="stringliteral">&quot; &quot;</span>) ,</div>
<div class="line"> text(<span class="stringliteral">&quot;bgcolor&quot;</span>) | <a class="code hl_function" href="group__dom.html#gaaac1622d43662a6a02113d9230a4fdd4">bgcolor</a>(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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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">// 版权所有 2025 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni。保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可协议约束,</span></div>
<div class="line"><span class="comment">// 该协议可在 LICENSE 文件中找到。</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">// 本源代码受MIT许可证约束详见LICENSE文件。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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">// 为第一列添加边框。</span></div>
<div class="line"> table.SelectColumn(0).Border(LIGHT);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// 使第一行加粗并带有双边框。</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">// 将“发布日期”列右对齐。</span></div>
<div class="line"> table.SelectColumn(2).DecorateCells(align_right);</div>
<div class="line"> </div>
<div class="line"> <span class="comment">// 选择从第二行到最后一行的行。</span></div>
<div class="line"> <span class="keyword">auto</span> content = table.SelectRows(1, -1);</div>
<div class="line"> <span class="comment">// 在三种颜色之间交替。</span></div>
<div class="line"> content.DecorateCellsAlternateRow(<a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Blue), 3, 0);</div>
<div class="line"> content.DecorateCellsAlternateRow(<a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(Color::Cyan), 3, 1);</div>
<div class="line"> content.DecorateCellsAlternateRow(<a class="code hl_function" href="group__dom.html#ga050df9c8ed04eec13309d6c0542c636d">color</a>(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">在选择周围应用 border。</div><div class="ttdef"><b>定义</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">选择整个表格。</div><div class="ttdef"><b>定义</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 是一个绘制表格的实用工具。</div><div class="ttdef"><b>定义</b> <a href="table_8hpp_source.html#l00035">table.hpp:35</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 此源代码的使用受 MIT 许可证的约束,该许可证可在 LICENSE 文件中找到。</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">// 版权所有 2020 Arthur Sonzogni. 保留所有权利。</span></div>
<div class="line"><span class="comment">// 本源代码的使用受 MIT 许可证的约束,该许可证可在</span></div>
<div class="line"><span class="comment">// LICENSE 文件中找到。</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> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(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! -->
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const projectNumber = document.getElementById('projectname');
if (!projectNumber) {
console.warn('Doxygen element with ID "projectnumber" not found. Cannot add version switcher.');
return;
}
const langs = ["en", "es", "fr", "ja", "zh-CH", "zh-TW"];
const lang_paths = {"en": "../index.html", "es": "../es/index.html", "fr": "../fr/index.html", "ja": "../ja/index.html", "zh-CH": "index.html", "zh-TW": "../zh-TW/index.html"};
const lang_display = {"en": "English", "es": "Espa\u00f1ol", "fr": "Fran\u00e7ais", "ja": "\u65e5\u672c\u8a9e", "zh-CH": "\u4e2d\u6587 (\u7b80\u4f53)", "zh-TW": "\u4e2d\u6587 (\u7e41\u9ad4)"};
const versions = ["main"];
const version_paths = {"main": "index.html"};
const currentLang = "zh-CH";
const currentVersion = "main";
// Helper function to create a styled select element
const createSelect = (options, current, paths, label, displayMap = null) => {
const select = document.createElement('select');
select.title = label;
select.onchange = function() {
const selectedValue = this.value;
if (selectedValue in paths) {
window.location.href = paths[selectedValue];
}
};
// Sort versions: 'main' first, then others numerically descending.
options.sort((a, b) => {
if (a === 'main') return -1;
if (b === 'main') return 1;
return b.localeCompare(a, undefined, { numeric: true, sensitivity: 'base' });
});
options.forEach(v => {
const option = document.createElement('option');
option.value = v;
// Use the displayMap if provided, otherwise default to the value (v)
option.textContent = displayMap ? displayMap[v] : v;
if (v === current) {
option.selected = true;
}
select.appendChild(option);
});
// Apply some styling to make it look good.
Object.assign(select.style, {
backgroundColor: 'rgba(0, 0, 0, 0.8)',
color: 'white',
border: '1px solid rgba(255, 255, 255, 0.2)',
padding: '5px',
borderRadius: '5px',
fontSize: '14px',
fontFamily: 'inherit',
margin: '0 5px 0 0',
cursor: 'pointer'
});
return select;
};
// 1. Create Language Switcher, passing the language display names map
const langSelect = createSelect(langs, currentLang, lang_paths, 'Select Language', lang_display);
// 2. Create Version Switcher
const versionSelect = createSelect(versions, currentVersion, version_paths, 'Select Version');
// 3. Create FTXUI title.
const ftxuiTitle = document.createElement('span');
ftxuiTitle.textContent = 'FTXUI: ';
Object.assign(ftxuiTitle.style, {
color: 'white',
fontSize: '20px',
fontWeight: 'bold',
marginRight: '10px'
});
// 3. Create a container to hold both selectors
const container = document.createElement('div');
container.id = 'version-lang-switchers';
Object.assign(container.style, {
display: 'flex',
alignItems: 'center',
justifyContent: 'flex-end',
width: 'auto'
});
container.appendChild(ftxuiTitle);
container.appendChild(langSelect);
container.appendChild(versionSelect);
Object.assign(container.style, {
backgroundColor: 'rgba(0, 0, 0, 0.5)',
padding: '5px 10px',
borderRadius: '8px'
});
// Replace the Doxygen project number element with our container.
projectNumber.replaceWith(container);
// Clean up the original Doxygen project number text if it still exists nearby
const parent = container.parentElement;
if (parent) {
const textNode = Array.from(parent.childNodes).find(n => n.nodeType === 3 && n.textContent.trim() !== '');
if (textNode) {
textNode.remove();
}
}
});
</script>
</body>
</html>