zhangyiss/FTXUI
1
0
Fork 0
mirror of https://github.com/ArthurSonzogni/FTXUI.git synced 2025-12-16 01:48:56 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity
Files
02764cd443be15005858fb10df020f4f1f770d66
FTXUI/zh-TW/homescreen_8cpp_source.html
ArthurSonzogni 02764cd443 deploy: 9f4b2bcf96
2025-12-13 19:38:34 +00:00

930 lines
156 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="en-US">
<head>
<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=11"/>
<meta name="generator" content="Doxygen 1.12.0"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>FTXUI: homescreen.cpp Source File</title>
<link href="tabs.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="dynsections.js"></script>
<script type="text/javascript" src="doxygen-awesome-fragment-copy-button.js"></script>
<script type="text/javascript" src="doxygen-awesome-paragraph-link.js"></script>
<script type="text/javascript" src="doxygen-awesome-interactive-toc.js"></script>
<script type="text/javascript" src="doxygen-awesome-tabs.js"></script>
<script type="module">
DoxygenAwesomeFragmentCopyButton.init()
DoxygenAwesomeParagraphLink.init()
DoxygenAwesomeInteractiveToc.init()
DoxygenAwesomeTabs.init()
await new Promise(r => window.addEventListener('DOMContentLoaded', r));
// Remove title when a img[alt='title-img'] is present.
// Find an image with the alt "img-title".
const img = document.querySelector("img[alt='title-img']");
const header = document.querySelector(".headertitle");
if (img && header) {
// Hide the header title progressively.
header.style.display = "none";
// Show progressively the image.
img.style.maxHeight = "40vh";
img.style.maxWidth = "100%";
img.style.objectFit = "contain";
}
// In the "examples.html" page. Turn every link with text
// "examples/<...>
//
// Add a "demo" link toward.
// https://arthursonzogni.github.io/FTXUI/examples/?file=<...>
const examples = document.querySelectorAll("a")
examples.forEach((example) => {
if (!example.textContent.startsWith("examples/")) {
return;
}
// Remove the ".cpp" extension from the example name.
const exampleName = example.textContent.replace("examples/", "").replace(".cpp", "");
const a = document.createElement("a");
a.textContent = "[demo]";
a.href = "https://arthursonzogni.github.io/FTXUI/examples/?file=" + exampleName;
a.style.marginRight= "1em";
a.style.fontWeight = "bold";
example.parentElement.insertBefore(a, example)
});
// If the current URL ends with -example.html, we can add a link to the demo
// as well using the div.title textContent.
const url = new URL(window.location.href);
if (url.pathname.endsWith("-example.html")) {
// Get the title text.
const title = document.querySelector("div.title").textContent;
const example = title.replace("examples/", "").replace(".cpp", "");
// Create a link to the demo.
const a = document.createElement("a");
a.textContent = "[demo]";
a.href = "https://arthursonzogni.github.io/FTXUI/examples/?file=" + example;
a.style.marginLeft = "1em";
a.style.fontWeight = "bold";
a.style.display = "inline-block";
// Insert the link after the title.
const titleDiv = document.querySelector("div.title");
if (titleDiv) {
titleDiv.insertBefore(a, titleDiv.nextSibling);
}
}
</script>
<script type="module">
// Click on the navtree, except for the main page where this is already done
// automatically.
let delay = 0;
while(true) {
const navtree = document.querySelector("div.item.selected");
if (!navtree) {
delay *= 2;
delay += 1;
await new Promise(resolve => setTimeout(resolve, delay));
continue;
}
// Include only selected navtree items.
console.log("navtree.textContent", navtree.textContent);
if (!navtree.textContent.includes("Getting Started") &&
!navtree.textContent.includes("Installation") &&
!navtree.textContent.includes("ftxui / screen") &&
!navtree.textContent.includes("ftxui / dom") &&
!navtree.textContent.includes("ftxui / component") &&
!navtree.textContent.includes("Reference")) {
break;
}
// Find the first link inside the navtree.
const link = navtree.querySelector("a");
if (link) {
// Simulate a click on the link.
link.click();
break;
}
}
</script>
<link href="navtree.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="navtreedata.js"></script>
<script type="text/javascript" src="navtree.js"></script>
<script type="text/javascript" src="resize.js"></script>
<script type="text/javascript" src="cookie.js"></script>
<link href="search/search.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="search/searchdata.js"></script>
<script type="text/javascript" src="search/search.js"></script>
<link href="doxygen.css" rel="stylesheet" type="text/css" />
<link href="doxygen-awesome.css" rel="stylesheet" type="text/css"/>
<link href="stylesheet.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="top"><!-- do not remove this div, it is closed by doxygen! -->
<div id="titlearea">
<table cellspacing="0" cellpadding="0">
<tbody>
<tr id="projectrow">
<td id="projectalign">
<div id="projectname">FTXUI<span id="projectnumber">&#160;6.1.9</span>
</div>
<div id="projectbrief">C++ functional terminal UI.</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- end header part -->
<!-- Generated by Doxygen 1.12.0 -->
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
var searchBox = new SearchBox("searchBox", "search/",'.html');
/* @license-end */
</script>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function() { codefold.init(0); });
/* @license-end */
</script>
<script type="text/javascript" src="menudata.js"></script>
<script type="text/javascript" src="menu.js"></script>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function() {
initMenu('',true,false,'search.php','Search',true);
$(function() { init_search(); });
});
/* @license-end */
</script>
<div id="main-nav"></div>
</div><!-- top -->
<div id="side-nav" class="ui-resizable side-nav-resizable">
<div id="nav-tree">
<div id="nav-tree-contents">
<div id="nav-sync" class="sync"></div>
</div>
</div>
<div id="splitbar" style="-moz-user-select:none;"
class="ui-resizable-handle">
</div>
</div>
<script type="text/javascript">
/* @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&amp;dn=expat.txt MIT */
$(function(){initNavTree('homescreen_8cpp_source.html',''); initResizable(true); });
/* @license-end */
</script>
<div id="doc-content">
<!-- window showing the filter options -->
<div id="MSearchSelectWindow"
onmouseover="return searchBox.OnSearchSelectShow()"
onmouseout="return searchBox.OnSearchSelectHide()"
onkeydown="return searchBox.OnSearchSelectKey(event)">
</div>
<!-- iframe showing the search results (closed by default) -->
<div id="MSearchResultsWindow">
<div id="MSearchResults">
<div class="SRPage">
<div id="SRIndex">
<div id="SRResults"></div>
<div class="SRStatus" id="Loading">Loading...</div>
<div class="SRStatus" id="Searching">Searching...</div>
<div class="SRStatus" id="NoMatches">No Matches</div>
</div>
</div>
</div>
</div>
<div class="header">
<div class="headertitle"><div class="title">homescreen.cpp</div></div>
</div><!--header-->
<div class="contents">
<a href="homescreen_8cpp.html">Go to the documentation of this file.</a><div class="fragment"><div class="line"><a id="l00001" name="l00001"></a><span class="lineno"> 1</span><span class="comment">// 版權所有 2020 Arthur Sonzogni。保留所有權利。</span></div>
<div class="line"><a id="l00002" name="l00002"></a><span class="lineno"> 2</span><span class="comment">// 本原始碼的使用受 MIT 授權條款約束，詳情請參閱</span></div>
<div class="line"><a id="l00003" name="l00003"></a><span class="lineno"> 3</span><span class="comment">// LICENSE 檔案。</span></div>
<div class="line"><a id="l00004" name="l00004"></a><span class="lineno"> 4</span><span class="preprocessor">#include &lt;stddef.h&gt;</span> <span class="comment">// for size_t</span></div>
<div class="line"><a id="l00005" name="l00005"></a><span class="lineno"> 5</span><span class="preprocessor">#include &lt;array&gt;</span> <span class="comment">// for array</span></div>
<div class="line"><a id="l00006" name="l00006"></a><span class="lineno"> 6</span><span class="preprocessor">#include &lt;atomic&gt;</span> <span class="comment">// for atomic</span></div>
<div class="line"><a id="l00007" name="l00007"></a><span class="lineno"> 7</span><span class="preprocessor">#include &lt;chrono&gt;</span> <span class="comment">// for operator&quot;&quot;s, chrono_literals</span></div>
<div class="line"><a id="l00008" name="l00008"></a><span class="lineno"> 8</span><span class="preprocessor">#include &lt;cmath&gt;</span> <span class="comment">// for sin</span></div>
<div class="line"><a id="l00009" name="l00009"></a><span class="lineno"> 9</span><span class="preprocessor">#include &lt;<a class="code" href="loop_8hpp.html">ftxui/component/loop.hpp</a>&gt;</span></div>
<div class="line"><a id="l00010" name="l00010"></a><span class="lineno"> 10</span><span class="preprocessor">#include &lt;functional&gt;</span> <span class="comment">// for ref, reference_wrapper, function</span></div>
<div class="line"><a id="l00011" name="l00011"></a><span class="lineno"> 11</span><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for allocator, shared_ptr, __shared_ptr_access</span></div>
<div class="line"><a id="l00012" name="l00012"></a><span class="lineno"> 12</span><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for string, basic_string, char_traits, operator+, to_string</span></div>
<div class="line"><a id="l00013" name="l00013"></a><span class="lineno"> 13</span><span class="preprocessor">#include &lt;thread&gt;</span> <span class="comment">// for sleep_for, thread</span></div>
<div class="line"><a id="l00014" name="l00014"></a><span class="lineno"> 14</span><span class="preprocessor">#include &lt;utility&gt;</span> <span class="comment">// for move</span></div>
<div class="line"><a id="l00015" name="l00015"></a><span class="lineno"> 15</span><span class="preprocessor">#include &lt;vector&gt;</span> <span class="comment">// for vector</span></div>
<div class="line"><a id="l00016" name="l00016"></a><span class="lineno"> 16</span> </div>
<div class="line"><a id="l00017" name="l00017"></a><span class="lineno"> 17</span><span class="preprocessor">#include &quot;<a class="code" href="color__info__sorted__2d_8ipp.html">../dom/color_info_sorted_2d.ipp</a>&quot;</span> <span class="comment">// for ColorInfoSorted2D</span></div>
<div class="line"><a id="l00018" name="l00018"></a><span class="lineno"> 18</span><span class="preprocessor">#include &quot;<a class="code" href="component_8hpp.html">ftxui/component/component.hpp</a>&quot;</span> <span class="comment">// for Checkbox, Renderer, Horizontal, Vertical, Input, Menu, Radiobox, ResizableSplitLeft, Tab</span></div>
<div class="line"><a id="l00019" name="l00019"></a><span class="lineno"> 19</span><span class="preprocessor">#include &quot;<a class="code" href="component__base_8hpp.html">ftxui/component/component_base.hpp</a>&quot;</span> <span class="comment">// for ComponentBase, Component</span></div>
<div class="line"><a id="l00020" name="l00020"></a><span class="lineno"> 20</span><span class="preprocessor">#include &quot;<a class="code" href="component__options_8hpp.html">ftxui/component/component_options.hpp</a>&quot;</span> <span class="comment">// for MenuOption, InputOption</span></div>
<div class="line"><a id="l00021" name="l00021"></a><span class="lineno"> 21</span><span class="preprocessor">#include &quot;<a class="code" href="event_8hpp.html">ftxui/component/event.hpp</a>&quot;</span> <span class="comment">// for Event, Event::Custom</span></div>
<div class="line"><a id="l00022" name="l00022"></a><span class="lineno"> 22</span><span class="preprocessor">#include &quot;<a class="code" href="screen__interactive_8hpp.html">ftxui/component/screen_interactive.hpp</a>&quot;</span> <span class="comment">// for Component, ScreenInteractive</span></div>
<div class="line"><a id="l00023" name="l00023"></a><span class="lineno"> 23</span><span class="preprocessor">#include &quot;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&quot;</span> <span class="comment">// for text, color, operator|, bgcolor, filler, Element, vbox, size, hbox, separator, flex, window, graph, EQUAL, paragraph, WIDTH, hcenter, Elements, bold, vscroll_indicator, HEIGHT, flexbox, hflow, border, frame, flex_grow, gauge, paragraphAlignCenter, paragraphAlignJustify, paragraphAlignLeft, paragraphAlignRight, dim, spinner, LESS_THAN, center, yframe, GREATER_THAN</span></div>
<div class="line"><a id="l00024" name="l00024"></a><span class="lineno"> 24</span><span class="preprocessor">#include &quot;<a class="code" href="flexbox__config_8hpp.html">ftxui/dom/flexbox_config.hpp</a>&quot;</span> <span class="comment">// for FlexboxConfig</span></div>
<div class="line"><a id="l00025" name="l00025"></a><span class="lineno"> 25</span><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::Black, Color::Blue, Color::Cyan, Color::CyanLight, Color::GrayDark, Color::GrayLight, Color::Green, Color::GreenLight, Color::Magenta, Color::MagentaLight, Color::Red, Color::White, Color::Yellow, Color::YellowLight, Color::Default, Color::Palette256, ftxui</span></div>
<div class="line"><a id="l00026" name="l00026"></a><span class="lineno"> 26</span><span class="preprocessor">#include &quot;<a class="code" href="color__info_8hpp.html">ftxui/screen/color_info.hpp</a>&quot;</span> <span class="comment">// for ColorInfo</span></div>
<div class="line"><a id="l00027" name="l00027"></a><span class="lineno"> 27</span><span class="preprocessor">#include &quot;<a class="code" href="terminal_8hpp.html">ftxui/screen/terminal.hpp</a>&quot;</span> <span class="comment">// for Size, Dimensions</span></div>
<div class="line"><a id="l00028" name="l00028"></a><span class="lineno"> 28</span> </div>
<div class="line"><a id="l00029" name="l00029"></a><span class="lineno"> 29</span><span class="keyword">using namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a>;</div>
<div class="line"><a id="l00030" name="l00030"></a><span class="lineno"> 30</span> </div>
<div class="foldopen" id="foldopen00031" data-start="{" data-end="}">
<div class="line"><a id="l00031" name="l00031"></a><span class="lineno"><a class="line" href="homescreen_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4"> 31</a></span><span class="keywordtype">int</span> <a class="code hl_function" href="homescreen_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</div>
<div class="line"><a id="l00032" name="l00032"></a><span class="lineno"> 32</span> <span class="keyword">auto</span> screen = <a class="code hl_function" href="group__component.html#a53dc5c3030151713857cf1a898d0f897">ScreenInteractive::Fullscreen</a>();</div>
<div class="line"><a id="l00033" name="l00033"></a><span class="lineno"> 33</span> </div>
<div class="line"><a id="l00034" name="l00034"></a><span class="lineno"> 34</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00035" name="l00035"></a><span class="lineno"> 35</span> <span class="comment">// HTOP</span></div>
<div class="line"><a id="l00036" name="l00036"></a><span class="lineno"> 36</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00037" name="l00037"></a><span class="lineno"> 37</span> <span class="keywordtype">int</span> shift = 0;</div>
<div class="line"><a id="l00038" name="l00038"></a><span class="lineno"> 38</span> </div>
<div class="line"><a id="l00039" name="l00039"></a><span class="lineno"> 39</span> <span class="keyword">auto</span> my_graph = [&amp;shift](<span class="keywordtype">int</span> width, <span class="keywordtype">int</span> height) {</div>
<div class="line"><a id="l00040" name="l00040"></a><span class="lineno"> 40</span> std::vector&lt;int&gt; output(width);</div>
<div class="line"><a id="l00041" name="l00041"></a><span class="lineno"> 41</span> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; width; ++i) {</div>
<div class="line"><a id="l00042" name="l00042"></a><span class="lineno"> 42</span> <span class="keywordtype">float</span> v = 0.5f;</div>
<div class="line"><a id="l00043" name="l00043"></a><span class="lineno"> 43</span> v += 0.1f * sin((i + shift) * 0.1f);</div>
<div class="line"><a id="l00044" name="l00044"></a><span class="lineno"> 44</span> v += 0.2f * sin((i + shift + 10) * 0.15f);</div>
<div class="line"><a id="l00045" name="l00045"></a><span class="lineno"> 45</span> v += 0.1f * sin((i + shift) * 0.03f);</div>
<div class="line"><a id="l00046" name="l00046"></a><span class="lineno"> 46</span> v *= height;</div>
<div class="line"><a id="l00047" name="l00047"></a><span class="lineno"> 47</span> output[i] = (int)v;</div>
<div class="line"><a id="l00048" name="l00048"></a><span class="lineno"> 48</span> }</div>
<div class="line"><a id="l00049" name="l00049"></a><span class="lineno"> 49</span> <span class="keywordflow">return</span> output;</div>
<div class="line"><a id="l00050" name="l00050"></a><span class="lineno"> 50</span> };</div>
<div class="line"><a id="l00051" name="l00051"></a><span class="lineno"> 51</span> </div>
<div class="line"><a id="l00052" name="l00052"></a><span class="lineno"> 52</span> <span class="keyword">auto</span> htop = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([&amp;] {</div>
<div class="line"><a id="l00053" name="l00053"></a><span class="lineno"> 53</span> <span class="keyword">auto</span> frequency = <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00054" name="l00054"></a><span class="lineno"> 54</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;頻率 [Mhz]&quot;</span>) | <a class="code hl_function" href="group__dom.html#gaf7d0d1e44c1a5424e42a5cddceacf7f7">hcenter</a>,</div>
<div class="line"><a id="l00055" name="l00055"></a><span class="lineno"> 55</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00056" name="l00056"></a><span class="lineno"> 56</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00057" name="l00057"></a><span class="lineno"> 57</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;2400 &quot;</span>),</div>
<div class="line"><a id="l00058" name="l00058"></a><span class="lineno"> 58</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00059" name="l00059"></a><span class="lineno"> 59</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;1200 &quot;</span>),</div>
<div class="line"><a id="l00060" name="l00060"></a><span class="lineno"> 60</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00061" name="l00061"></a><span class="lineno"> 61</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;0 &quot;</span>),</div>
<div class="line"><a id="l00062" name="l00062"></a><span class="lineno"> 62</span> }),</div>
<div class="line"><a id="l00063" name="l00063"></a><span class="lineno"> 63</span> <a class="code hl_function" href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">graph</a>(std::ref(my_graph)) | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00064" name="l00064"></a><span class="lineno"> 64</span> }) | flex,</div>
<div class="line"><a id="l00065" name="l00065"></a><span class="lineno"> 65</span> });</div>
<div class="line"><a id="l00066" name="l00066"></a><span class="lineno"> 66</span> </div>
<div class="line"><a id="l00067" name="l00067"></a><span class="lineno"> 67</span> <span class="keyword">auto</span> utilization = <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00068" name="l00068"></a><span class="lineno"> 68</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;使用率 [%]&quot;</span>) | <a class="code hl_function" href="group__dom.html#gaf7d0d1e44c1a5424e42a5cddceacf7f7">hcenter</a>,</div>
<div class="line"><a id="l00069" name="l00069"></a><span class="lineno"> 69</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00070" name="l00070"></a><span class="lineno"> 70</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00071" name="l00071"></a><span class="lineno"> 71</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;100 &quot;</span>),</div>
<div class="line"><a id="l00072" name="l00072"></a><span class="lineno"> 72</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00073" name="l00073"></a><span class="lineno"> 73</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;50 &quot;</span>),</div>
<div class="line"><a id="l00074" name="l00074"></a><span class="lineno"> 74</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00075" name="l00075"></a><span class="lineno"> 75</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;0 &quot;</span>),</div>
<div class="line"><a id="l00076" name="l00076"></a><span class="lineno"> 76</span> }),</div>
<div class="line"><a id="l00077" name="l00077"></a><span class="lineno"> 77</span> <a class="code hl_function" href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">graph</a>(std::ref(my_graph)) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">Color::RedLight</a>),</div>
<div class="line"><a id="l00078" name="l00078"></a><span class="lineno"> 78</span> }) | flex,</div>
<div class="line"><a id="l00079" name="l00079"></a><span class="lineno"> 79</span> });</div>
<div class="line"><a id="l00080" name="l00080"></a><span class="lineno"> 80</span> </div>
<div class="line"><a id="l00081" name="l00081"></a><span class="lineno"> 81</span> <span class="keyword">auto</span> ram = <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00082" name="l00082"></a><span class="lineno"> 82</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;記憶體 [Mo]&quot;</span>) | <a class="code hl_function" href="group__dom.html#gaf7d0d1e44c1a5424e42a5cddceacf7f7">hcenter</a>,</div>
<div class="line"><a id="l00083" name="l00083"></a><span class="lineno"> 83</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00084" name="l00084"></a><span class="lineno"> 84</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00085" name="l00085"></a><span class="lineno"> 85</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;8192&quot;</span>),</div>
<div class="line"><a id="l00086" name="l00086"></a><span class="lineno"> 86</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00087" name="l00087"></a><span class="lineno"> 87</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;4096 &quot;</span>),</div>
<div class="line"><a id="l00088" name="l00088"></a><span class="lineno"> 88</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00089" name="l00089"></a><span class="lineno"> 89</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;0 &quot;</span>),</div>
<div class="line"><a id="l00090" name="l00090"></a><span class="lineno"> 90</span> }),</div>
<div class="line"><a id="l00091" name="l00091"></a><span class="lineno"> 91</span> <a class="code hl_function" href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">graph</a>(std::ref(my_graph)) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">Color::BlueLight</a>),</div>
<div class="line"><a id="l00092" name="l00092"></a><span class="lineno"> 92</span> }) | flex,</div>
<div class="line"><a id="l00093" name="l00093"></a><span class="lineno"> 93</span> });</div>
<div class="line"><a id="l00094" name="l00094"></a><span class="lineno"> 94</span> </div>
<div class="line"><a id="l00095" name="l00095"></a><span class="lineno"> 95</span> <span class="keywordflow">return</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00096" name="l00096"></a><span class="lineno"> 96</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00097" name="l00097"></a><span class="lineno"> 97</span> frequency | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00098" name="l00098"></a><span class="lineno"> 98</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00099" name="l00099"></a><span class="lineno"> 99</span> utilization | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00100" name="l00100"></a><span class="lineno"> 100</span> }) | flex,</div>
<div class="line"><a id="l00101" name="l00101"></a><span class="lineno"> 101</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00102" name="l00102"></a><span class="lineno"> 102</span> ram | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00103" name="l00103"></a><span class="lineno"> 103</span> }) |</div>
<div class="line"><a id="l00104" name="l00104"></a><span class="lineno"> 104</span> flex;</div>
<div class="line"><a id="l00105" name="l00105"></a><span class="lineno"> 105</span> });</div>
<div class="line"><a id="l00106" name="l00106"></a><span class="lineno"> 106</span> </div>
<div class="line"><a id="l00107" name="l00107"></a><span class="lineno"> 107</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00108" name="l00108"></a><span class="lineno"> 108</span> <span class="comment">// Compiler</span></div>
<div class="line"><a id="l00109" name="l00109"></a><span class="lineno"> 109</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00110" name="l00110"></a><span class="lineno"> 110</span> </div>
<div class="line"><a id="l00111" name="l00111"></a><span class="lineno"> 111</span> <span class="keyword">const</span> std::vector&lt;std::string&gt; compiler_entries = {</div>
<div class="line"><a id="l00112" name="l00112"></a><span class="lineno"> 112</span> <span class="stringliteral">&quot;gcc&quot;</span>,</div>
<div class="line"><a id="l00113" name="l00113"></a><span class="lineno"> 113</span> <span class="stringliteral">&quot;clang&quot;</span>,</div>
<div class="line"><a id="l00114" name="l00114"></a><span class="lineno"> 114</span> <span class="stringliteral">&quot;emcc&quot;</span>,</div>
<div class="line"><a id="l00115" name="l00115"></a><span class="lineno"> 115</span> <span class="stringliteral">&quot;game_maker&quot;</span>,</div>
<div class="line"><a id="l00116" name="l00116"></a><span class="lineno"> 116</span> <span class="stringliteral">&quot;Ada compilers&quot;</span>,</div>
<div class="line"><a id="l00117" name="l00117"></a><span class="lineno"> 117</span> <span class="stringliteral">&quot;ALGOL 60 compilers&quot;</span>,</div>
<div class="line"><a id="l00118" name="l00118"></a><span class="lineno"> 118</span> <span class="stringliteral">&quot;ALGOL 68 compilers&quot;</span>,</div>
<div class="line"><a id="l00119" name="l00119"></a><span class="lineno"> 119</span> <span class="stringliteral">&quot;Assemblers (Intel *86)&quot;</span>,</div>
<div class="line"><a id="l00120" name="l00120"></a><span class="lineno"> 120</span> <span class="stringliteral">&quot;Assemblers (Motorola 68*)&quot;</span>,</div>
<div class="line"><a id="l00121" name="l00121"></a><span class="lineno"> 121</span> <span class="stringliteral">&quot;Assemblers (Zilog Z80)&quot;</span>,</div>
<div class="line"><a id="l00122" name="l00122"></a><span class="lineno"> 122</span> <span class="stringliteral">&quot;Assemblers (other)&quot;</span>,</div>
<div class="line"><a id="l00123" name="l00123"></a><span class="lineno"> 123</span> <span class="stringliteral">&quot;BASIC Compilers&quot;</span>,</div>
<div class="line"><a id="l00124" name="l00124"></a><span class="lineno"> 124</span> <span class="stringliteral">&quot;BASIC interpreters&quot;</span>,</div>
<div class="line"><a id="l00125" name="l00125"></a><span class="lineno"> 125</span> <span class="stringliteral">&quot;Batch compilers&quot;</span>,</div>
<div class="line"><a id="l00126" name="l00126"></a><span class="lineno"> 126</span> <span class="stringliteral">&quot;C compilers&quot;</span>,</div>
<div class="line"><a id="l00127" name="l00127"></a><span class="lineno"> 127</span> <span class="stringliteral">&quot;Source-to-source compilers&quot;</span>,</div>
<div class="line"><a id="l00128" name="l00128"></a><span class="lineno"> 128</span> <span class="stringliteral">&quot;C++ compilers&quot;</span>,</div>
<div class="line"><a id="l00129" name="l00129"></a><span class="lineno"> 129</span> <span class="stringliteral">&quot;C# compilers&quot;</span>,</div>
<div class="line"><a id="l00130" name="l00130"></a><span class="lineno"> 130</span> <span class="stringliteral">&quot;COBOL compilers&quot;</span>,</div>
<div class="line"><a id="l00131" name="l00131"></a><span class="lineno"> 131</span> <span class="stringliteral">&quot;Common Lisp compilers&quot;</span>,</div>
<div class="line"><a id="l00132" name="l00132"></a><span class="lineno"> 132</span> <span class="stringliteral">&quot;D compilers&quot;</span>,</div>
<div class="line"><a id="l00133" name="l00133"></a><span class="lineno"> 133</span> <span class="stringliteral">&quot;DIBOL/DBL compilers&quot;</span>,</div>
<div class="line"><a id="l00134" name="l00134"></a><span class="lineno"> 134</span> <span class="stringliteral">&quot;ECMAScript interpreters&quot;</span>,</div>
<div class="line"><a id="l00135" name="l00135"></a><span class="lineno"> 135</span> <span class="stringliteral">&quot;Eiffel compilers&quot;</span>,</div>
<div class="line"><a id="l00136" name="l00136"></a><span class="lineno"> 136</span> <span class="stringliteral">&quot;Fortran compilers&quot;</span>,</div>
<div class="line"><a id="l00137" name="l00137"></a><span class="lineno"> 137</span> <span class="stringliteral">&quot;Go compilers&quot;</span>,</div>
<div class="line"><a id="l00138" name="l00138"></a><span class="lineno"> 138</span> <span class="stringliteral">&quot;Haskell compilers&quot;</span>,</div>
<div class="line"><a id="l00139" name="l00139"></a><span class="lineno"> 139</span> <span class="stringliteral">&quot;Java compilers&quot;</span>,</div>
<div class="line"><a id="l00140" name="l00140"></a><span class="lineno"> 140</span> <span class="stringliteral">&quot;Pascal compilers&quot;</span>,</div>
<div class="line"><a id="l00141" name="l00141"></a><span class="lineno"> 141</span> <span class="stringliteral">&quot;Perl Interpreters&quot;</span>,</div>
<div class="line"><a id="l00142" name="l00142"></a><span class="lineno"> 142</span> <span class="stringliteral">&quot;PHP compilers&quot;</span>,</div>
<div class="line"><a id="l00143" name="l00143"></a><span class="lineno"> 143</span> <span class="stringliteral">&quot;PL/I compilers&quot;</span>,</div>
<div class="line"><a id="l00144" name="l00144"></a><span class="lineno"> 144</span> <span class="stringliteral">&quot;Python compilers&quot;</span>,</div>
<div class="line"><a id="l00145" name="l00145"></a><span class="lineno"> 145</span> <span class="stringliteral">&quot;Scheme compilers and interpreters&quot;</span>,</div>
<div class="line"><a id="l00146" name="l00146"></a><span class="lineno"> 146</span> <span class="stringliteral">&quot;Smalltalk compilers&quot;</span>,</div>
<div class="line"><a id="l00147" name="l00147"></a><span class="lineno"> 147</span> <span class="stringliteral">&quot;Tcl Interpreters&quot;</span>,</div>
<div class="line"><a id="l00148" name="l00148"></a><span class="lineno"> 148</span> <span class="stringliteral">&quot;VMS Interpreters&quot;</span>,</div>
<div class="line"><a id="l00149" name="l00149"></a><span class="lineno"> 149</span> <span class="stringliteral">&quot;Rexx Interpreters&quot;</span>,</div>
<div class="line"><a id="l00150" name="l00150"></a><span class="lineno"> 150</span> <span class="stringliteral">&quot;CLI compilers&quot;</span>,</div>
<div class="line"><a id="l00151" name="l00151"></a><span class="lineno"> 151</span> };</div>
<div class="line"><a id="l00152" name="l00152"></a><span class="lineno"> 152</span> </div>
<div class="line"><a id="l00153" name="l00153"></a><span class="lineno"> 153</span> <span class="keywordtype">int</span> compiler_selected = 0;</div>
<div class="line"><a id="l00154" name="l00154"></a><span class="lineno"> 154</span> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> compiler = <a class="code hl_function" href="group__component.html#ga3e7a44f321fa910f07aef5879e67af95">Radiobox</a>(&amp;compiler_entries, &amp;compiler_selected);</div>
<div class="line"><a id="l00155" name="l00155"></a><span class="lineno"> 155</span> </div>
<div class="line"><a id="l00156" name="l00156"></a><span class="lineno"> 156</span> std::array&lt;std::string, 8&gt; options_label = {</div>
<div class="line"><a id="l00157" name="l00157"></a><span class="lineno"> 157</span> <span class="stringliteral">&quot;-Wall&quot;</span>,</div>
<div class="line"><a id="l00158" name="l00158"></a><span class="lineno"> 158</span> <span class="stringliteral">&quot;-Werror&quot;</span>,</div>
<div class="line"><a id="l00159" name="l00159"></a><span class="lineno"> 159</span> <span class="stringliteral">&quot;-lpthread&quot;</span>,</div>
<div class="line"><a id="l00160" name="l00160"></a><span class="lineno"> 160</span> <span class="stringliteral">&quot;-O3&quot;</span>,</div>
<div class="line"><a id="l00161" name="l00161"></a><span class="lineno"> 161</span> <span class="stringliteral">&quot;-Wabi-tag&quot;</span>,</div>
<div class="line"><a id="l00162" name="l00162"></a><span class="lineno"> 162</span> <span class="stringliteral">&quot;-Wno-class-conversion&quot;</span>,</div>
<div class="line"><a id="l00163" name="l00163"></a><span class="lineno"> 163</span> <span class="stringliteral">&quot;-Wcomma-subscript&quot;</span>,</div>
<div class="line"><a id="l00164" name="l00164"></a><span class="lineno"> 164</span> <span class="stringliteral">&quot;-Wno-conversion-null&quot;</span>,</div>
<div class="line"><a id="l00165" name="l00165"></a><span class="lineno"> 165</span> };</div>
<div class="line"><a id="l00166" name="l00166"></a><span class="lineno"> 166</span> std::array&lt;bool, 8&gt; options_state = {</div>
<div class="line"><a id="l00167" name="l00167"></a><span class="lineno"> 167</span> <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>, <span class="keyword">false</span>,</div>
<div class="line"><a id="l00168" name="l00168"></a><span class="lineno"> 168</span> };</div>
<div class="line"><a id="l00169" name="l00169"></a><span class="lineno"> 169</span> </div>
<div class="line"><a id="l00170" name="l00170"></a><span class="lineno"> 170</span> std::vector&lt;std::string&gt; input_entries;</div>
<div class="line"><a id="l00171" name="l00171"></a><span class="lineno"> 171</span> <span class="keywordtype">int</span> input_selected = 0;</div>
<div class="line"><a id="l00172" name="l00172"></a><span class="lineno"> 172</span> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> <a class="code hl_variable" href="gallery_8cpp.html#a877535c3b6ffdf230bce90c82c597d17">input</a> = <a class="code hl_function" href="group__component.html#ga27828fc39da10a18478ba84b1b162039">Menu</a>(&amp;input_entries, &amp;input_selected);</div>
<div class="line"><a id="l00173" name="l00173"></a><span class="lineno"> 173</span> </div>
<div class="line"><a id="l00174" name="l00174"></a><span class="lineno"> 174</span> <span class="keyword">auto</span> input_option = <a class="code hl_struct" href="group__component.html#structftxui_1_1InputOption">InputOption</a>();</div>
<div class="line"><a id="l00175" name="l00175"></a><span class="lineno"> 175</span> std::string input_add_content;</div>
<div class="line"><a id="l00176" name="l00176"></a><span class="lineno"> 176</span> input_option.on_enter = [&amp;] {</div>
<div class="line"><a id="l00177" name="l00177"></a><span class="lineno"> 177</span> input_entries.push_back(input_add_content);</div>
<div class="line"><a id="l00178" name="l00178"></a><span class="lineno"> 178</span> input_add_content = <span class="stringliteral">&quot;&quot;</span>;</div>
<div class="line"><a id="l00179" name="l00179"></a><span class="lineno"> 179</span> };</div>
<div class="line"><a id="l00180" name="l00180"></a><span class="lineno"> 180</span> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> input_add = <a class="code hl_function" href="group__component.html#ga7f285fcbc4dd0a0767b89a255fd062dc">Input</a>(&amp;input_add_content, <span class="stringliteral">&quot;輸入檔案&quot;</span>, input_option);</div>
<div class="line"><a id="l00181" name="l00181"></a><span class="lineno"> 181</span> </div>
<div class="line"><a id="l00182" name="l00182"></a><span class="lineno"> 182</span> std::string executable_content_ = <span class="stringliteral">&quot;&quot;</span>;</div>
<div class="line"><a id="l00183" name="l00183"></a><span class="lineno"> 183</span> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> executable_ = <a class="code hl_function" href="group__component.html#ga7f285fcbc4dd0a0767b89a255fd062dc">Input</a>(&amp;executable_content_, <span class="stringliteral">&quot;可執行檔&quot;</span>);</div>
<div class="line"><a id="l00184" name="l00184"></a><span class="lineno"> 184</span> </div>
<div class="line"><a id="l00185" name="l00185"></a><span class="lineno"> 185</span> <a class="code hl_typedef" href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">Component</a> flags = Container::Vertical({</div>
<div class="line"><a id="l00186" name="l00186"></a><span class="lineno"> 186</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[0], &amp;options_state[0]),</div>
<div class="line"><a id="l00187" name="l00187"></a><span class="lineno"> 187</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[1], &amp;options_state[1]),</div>
<div class="line"><a id="l00188" name="l00188"></a><span class="lineno"> 188</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[2], &amp;options_state[2]),</div>
<div class="line"><a id="l00189" name="l00189"></a><span class="lineno"> 189</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[3], &amp;options_state[3]),</div>
<div class="line"><a id="l00190" name="l00190"></a><span class="lineno"> 190</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[4], &amp;options_state[4]),</div>
<div class="line"><a id="l00191" name="l00191"></a><span class="lineno"> 191</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[5], &amp;options_state[5]),</div>
<div class="line"><a id="l00192" name="l00192"></a><span class="lineno"> 192</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[6], &amp;options_state[6]),</div>
<div class="line"><a id="l00193" name="l00193"></a><span class="lineno"> 193</span> <a class="code hl_function" href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">Checkbox</a>(&amp;options_label[7], &amp;options_state[7]),</div>
<div class="line"><a id="l00194" name="l00194"></a><span class="lineno"> 194</span> });</div>
<div class="line"><a id="l00195" name="l00195"></a><span class="lineno"> 195</span> </div>
<div class="line"><a id="l00196" name="l00196"></a><span class="lineno"> 196</span> <span class="keyword">auto</span> compiler_component = Container::Horizontal({</div>
<div class="line"><a id="l00197" name="l00197"></a><span class="lineno"> 197</span> compiler,</div>
<div class="line"><a id="l00198" name="l00198"></a><span class="lineno"> 198</span> flags,</div>
<div class="line"><a id="l00199" name="l00199"></a><span class="lineno"> 199</span> Container::Vertical({</div>
<div class="line"><a id="l00200" name="l00200"></a><span class="lineno"> 200</span> executable_,</div>
<div class="line"><a id="l00201" name="l00201"></a><span class="lineno"> 201</span> Container::Horizontal({</div>
<div class="line"><a id="l00202" name="l00202"></a><span class="lineno"> 202</span> input_add,</div>
<div class="line"><a id="l00203" name="l00203"></a><span class="lineno"> 203</span> <a class="code hl_variable" href="gallery_8cpp.html#a877535c3b6ffdf230bce90c82c597d17">input</a>,</div>
<div class="line"><a id="l00204" name="l00204"></a><span class="lineno"> 204</span> }),</div>
<div class="line"><a id="l00205" name="l00205"></a><span class="lineno"> 205</span> }),</div>
<div class="line"><a id="l00206" name="l00206"></a><span class="lineno"> 206</span> });</div>
<div class="line"><a id="l00207" name="l00207"></a><span class="lineno"> 207</span> </div>
<div class="line"><a id="l00208" name="l00208"></a><span class="lineno"> 208</span> <span class="keyword">auto</span> render_command = [&amp;] {</div>
<div class="line"><a id="l00209" name="l00209"></a><span class="lineno"> 209</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> line;</div>
<div class="line"><a id="l00210" name="l00210"></a><span class="lineno"> 210</span> <span class="comment">// 編譯器</span></div>
<div class="line"><a id="l00211" name="l00211"></a><span class="lineno"> 211</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(compiler_entries[compiler_selected]) | bold);</div>
<div class="line"><a id="l00212" name="l00212"></a><span class="lineno"> 212</span> <span class="comment">// flags</span></div>
<div class="line"><a id="l00213" name="l00213"></a><span class="lineno"> 213</span> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; 8; ++i) {</div>
<div class="line"><a id="l00214" name="l00214"></a><span class="lineno"> 214</span> <span class="keywordflow">if</span> (options_state[i]) {</div>
<div class="line"><a id="l00215" name="l00215"></a><span class="lineno"> 215</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot; &quot;</span>));</div>
<div class="line"><a id="l00216" name="l00216"></a><span class="lineno"> 216</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(options_label[i]) | dim);</div>
<div class="line"><a id="l00217" name="l00217"></a><span class="lineno"> 217</span> }</div>
<div class="line"><a id="l00218" name="l00218"></a><span class="lineno"> 218</span> }</div>
<div class="line"><a id="l00219" name="l00219"></a><span class="lineno"> 219</span> <span class="comment">// Executable</span></div>
<div class="line"><a id="l00220" name="l00220"></a><span class="lineno"> 220</span> <span class="keywordflow">if</span> (!executable_content_.empty()) {</div>
<div class="line"><a id="l00221" name="l00221"></a><span class="lineno"> 221</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot; -o &quot;</span>) | bold);</div>
<div class="line"><a id="l00222" name="l00222"></a><span class="lineno"> 222</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(executable_content_) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">Color::BlueLight</a>) |</div>
<div class="line"><a id="l00223" name="l00223"></a><span class="lineno"> 223</span> bold);</div>
<div class="line"><a id="l00224" name="l00224"></a><span class="lineno"> 224</span> }</div>
<div class="line"><a id="l00225" name="l00225"></a><span class="lineno"> 225</span> <span class="comment">// Input</span></div>
<div class="line"><a id="l00226" name="l00226"></a><span class="lineno"> 226</span> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; it : input_entries) {</div>
<div class="line"><a id="l00227" name="l00227"></a><span class="lineno"> 227</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot; &quot;</span> + it) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">Color::RedLight</a>));</div>
<div class="line"><a id="l00228" name="l00228"></a><span class="lineno"> 228</span> }</div>
<div class="line"><a id="l00229" name="l00229"></a><span class="lineno"> 229</span> <span class="keywordflow">return</span> line;</div>
<div class="line"><a id="l00230" name="l00230"></a><span class="lineno"> 230</span> };</div>
<div class="line"><a id="l00231" name="l00231"></a><span class="lineno"> 231</span> </div>
<div class="line"><a id="l00232" name="l00232"></a><span class="lineno"> 232</span> <span class="keyword">auto</span> compiler_renderer = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>(compiler_component, [&amp;] {</div>
<div class="line"><a id="l00233" name="l00233"></a><span class="lineno"> 233</span> <span class="keyword">auto</span> compiler_win = <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;編譯器&quot;</span>),</div>
<div class="line"><a id="l00234" name="l00234"></a><span class="lineno"> 234</span> compiler-&gt;<a class="code hl_function" href="group__component.html#a28d41d6113c5b29c8dd45846582b3299">Render</a>() | vscroll_indicator | frame);</div>
<div class="line"><a id="l00235" name="l00235"></a><span class="lineno"> 235</span> <span class="keyword">auto</span> flags_win =</div>
<div class="line"><a id="l00236" name="l00236"></a><span class="lineno"> 236</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;旗標&quot;</span>), flags-&gt;<a class="code hl_function" href="group__component.html#a28d41d6113c5b29c8dd45846582b3299">Render</a>() | vscroll_indicator | frame);</div>
<div class="line"><a id="l00237" name="l00237"></a><span class="lineno"> 237</span> <span class="keyword">auto</span> executable_win = <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;可執行檔:&quot;</span>), executable_-&gt;<a class="code hl_function" href="group__component.html#a28d41d6113c5b29c8dd45846582b3299">Render</a>());</div>
<div class="line"><a id="l00238" name="l00238"></a><span class="lineno"> 238</span> <span class="keyword">auto</span> input_win =</div>
<div class="line"><a id="l00239" name="l00239"></a><span class="lineno"> 239</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;輸入&quot;</span>), <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00240" name="l00240"></a><span class="lineno"> 240</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00241" name="l00241"></a><span class="lineno"> 241</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00242" name="l00242"></a><span class="lineno"> 242</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;新增: &quot;</span>),</div>
<div class="line"><a id="l00243" name="l00243"></a><span class="lineno"> 243</span> input_add-&gt;<a class="code hl_function" href="group__component.html#a28d41d6113c5b29c8dd45846582b3299">Render</a>(),</div>
<div class="line"><a id="l00244" name="l00244"></a><span class="lineno"> 244</span> }) | <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 20) |</div>
<div class="line"><a id="l00245" name="l00245"></a><span class="lineno"> 245</span> <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">HEIGHT</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 1),</div>
<div class="line"><a id="l00246" name="l00246"></a><span class="lineno"> 246</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00247" name="l00247"></a><span class="lineno"> 247</span> }),</div>
<div class="line"><a id="l00248" name="l00248"></a><span class="lineno"> 248</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00249" name="l00249"></a><span class="lineno"> 249</span> <a class="code hl_variable" href="gallery_8cpp.html#a877535c3b6ffdf230bce90c82c597d17">input</a>-&gt;<a class="code hl_function" href="group__dom.html#a02feb1564ee23b6229b82be0289c96e4">Render</a>() | vscroll_indicator | frame |</div>
<div class="line"><a id="l00250" name="l00250"></a><span class="lineno"> 250</span> <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">HEIGHT</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 3) | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00251" name="l00251"></a><span class="lineno"> 251</span> }));</div>
<div class="line"><a id="l00252" name="l00252"></a><span class="lineno"> 252</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00253" name="l00253"></a><span class="lineno"> 253</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00254" name="l00254"></a><span class="lineno"> 254</span> compiler_win,</div>
<div class="line"><a id="l00255" name="l00255"></a><span class="lineno"> 255</span> flags_win,</div>
<div class="line"><a id="l00256" name="l00256"></a><span class="lineno"> 256</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00257" name="l00257"></a><span class="lineno"> 257</span> executable_win | <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 20),</div>
<div class="line"><a id="l00258" name="l00258"></a><span class="lineno"> 258</span> input_win | <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 60),</div>
<div class="line"><a id="l00259" name="l00259"></a><span class="lineno"> 259</span> }),</div>
<div class="line"><a id="l00260" name="l00260"></a><span class="lineno"> 260</span> <a class="code hl_function" href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">filler</a>(),</div>
<div class="line"><a id="l00261" name="l00261"></a><span class="lineno"> 261</span> }) | <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">HEIGHT</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5">LESS_THAN</a>, 8),</div>
<div class="line"><a id="l00262" name="l00262"></a><span class="lineno"> 262</span> <a class="code hl_function" href="namespaceftxui.html#a345b31919048562675615d5af78e6322">hflow</a>(render_command()) | <a class="code hl_function" href="group__dom.html#ga81ed6b31f512e849247f13d249f6f20e">flex_grow</a>,</div>
<div class="line"><a id="l00263" name="l00263"></a><span class="lineno"> 263</span> }) |</div>
<div class="line"><a id="l00264" name="l00264"></a><span class="lineno"> 264</span> flex_grow;</div>
<div class="line"><a id="l00265" name="l00265"></a><span class="lineno"> 265</span> });</div>
<div class="line"><a id="l00266" name="l00266"></a><span class="lineno"> 266</span> </div>
<div class="line"><a id="l00267" name="l00267"></a><span class="lineno"> 267</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00268" name="l00268"></a><span class="lineno"> 268</span> <span class="comment">// Spinner</span></div>
<div class="line"><a id="l00269" name="l00269"></a><span class="lineno"> 269</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00270" name="l00270"></a><span class="lineno"> 270</span> <span class="keyword">auto</span> spinner_tab_renderer = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([&amp;] {</div>
<div class="line"><a id="l00271" name="l00271"></a><span class="lineno"> 271</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> entries;</div>
<div class="line"><a id="l00272" name="l00272"></a><span class="lineno"> 272</span> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> i = 0; i &lt; 22; ++i) {</div>
<div class="line"><a id="l00273" name="l00273"></a><span class="lineno"> 273</span> entries.push_back(<a class="code hl_function" href="group__dom.html#ga3b08e0030a0831d3ec3e2a505908273b">spinner</a>(i, shift / 5) | bold |</div>
<div class="line"><a id="l00274" name="l00274"></a><span class="lineno"> 274</span> <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c">GREATER_THAN</a>, 2) | border);</div>
<div class="line"><a id="l00275" name="l00275"></a><span class="lineno"> 275</span> }</div>
<div class="line"><a id="l00276" name="l00276"></a><span class="lineno"> 276</span> <span class="keywordflow">return</span> <a class="code hl_function" href="namespaceftxui.html#a345b31919048562675615d5af78e6322">hflow</a>(std::move(entries));</div>
<div class="line"><a id="l00277" name="l00277"></a><span class="lineno"> 277</span> });</div>
<div class="line"><a id="l00278" name="l00278"></a><span class="lineno"> 278</span> </div>
<div class="line"><a id="l00279" name="l00279"></a><span class="lineno"> 279</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00280" name="l00280"></a><span class="lineno"> 280</span> <span class="comment">// Colors</span></div>
<div class="line"><a id="l00281" name="l00281"></a><span class="lineno"> 281</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00282" name="l00282"></a><span class="lineno"> 282</span> <span class="keyword">auto</span> color_tab_renderer = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([] {</div>
<div class="line"><a id="l00283" name="l00283"></a><span class="lineno"> 283</span> <span class="keyword">auto</span> basic_color_display =</div>
<div class="line"><a id="l00284" name="l00284"></a><span class="lineno"> 284</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00285" name="l00285"></a><span class="lineno"> 285</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;16 色調色盤:&quot;</span>),</div>
<div class="line"><a id="l00286" name="l00286"></a><span class="lineno"> 286</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00287" name="l00287"></a><span class="lineno"> 287</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00288" name="l00288"></a><span class="lineno"> 288</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00289" name="l00289"></a><span class="lineno"> 289</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#aa4be56f94fc180d7b070df23c235b0c7a79935518a3889663d8688b6b01fff051">Color::Default</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"><a id="l00290" name="l00290"></a><span class="lineno"> 290</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fac1e9bce8242f443c54c7405223d616cd">Color::Black</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"><a id="l00291" name="l00291"></a><span class="lineno"> 291</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fade3b52f7f38e412815092547cd6e8be7">Color::GrayDark</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"><a id="l00292" name="l00292"></a><span class="lineno"> 292</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fadebf1805c024a5504872f795f83a6835">Color::GrayLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"><a id="l00293" name="l00293"></a><span class="lineno"> 293</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab548046646b36c12aa6ba841de500094">Color::White</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"><a id="l00294" name="l00294"></a><span class="lineno"> 294</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf5e09dd1da4088464f264b7a3118bff8">Color::Blue</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"><a id="l00295" name="l00295"></a><span class="lineno"> 295</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">Color::BlueLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"><a id="l00296" name="l00296"></a><span class="lineno"> 296</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab0d4738f9c7f12049e52aa4e868bdc8b">Color::Cyan</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"><a id="l00297" name="l00297"></a><span class="lineno"> 297</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa61bd7f1290cc0a24e565539a61ba5839">Color::CyanLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"><a id="l00298" name="l00298"></a><span class="lineno"> 298</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad0784a3f969fe736e8b271a5a161d106">Color::Green</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"><a id="l00299" name="l00299"></a><span class="lineno"> 299</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9827485e548095e18c65045bc8058ce7">Color::GreenLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"><a id="l00300" name="l00300"></a><span class="lineno"> 300</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab5059a620e2c7dc57556b1e275c2f9bc">Color::Magenta</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"><a id="l00301" name="l00301"></a><span class="lineno"> 301</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9663f993a3affdf3526fa032cfe5b9f4">Color::MagentaLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"><a id="l00302" name="l00302"></a><span class="lineno"> 302</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad3163c1fcda01965b692ec2c3122b743">Color::Red</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"><a id="l00303" name="l00303"></a><span class="lineno"> 303</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">Color::RedLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"><a id="l00304" name="l00304"></a><span class="lineno"> 304</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fabf28513245738599d13e3ce36bd16c82">Color::Yellow</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"><a id="l00305" name="l00305"></a><span class="lineno"> 305</span> <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa7948fe5f055329af04798409b7ac37b5">Color::YellowLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"><a id="l00306" name="l00306"></a><span class="lineno"> 306</span> }),</div>
<div class="line"><a id="l00307" name="l00307"></a><span class="lineno"> 307</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00308" name="l00308"></a><span class="lineno"> 308</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#aa4be56f94fc180d7b070df23c235b0c7a79935518a3889663d8688b6b01fff051">Color::Default</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Default&quot;</span>)),</div>
<div class="line"><a id="l00309" name="l00309"></a><span class="lineno"> 309</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fac1e9bce8242f443c54c7405223d616cd">Color::Black</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Black&quot;</span>)),</div>
<div class="line"><a id="l00310" name="l00310"></a><span class="lineno"> 310</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fade3b52f7f38e412815092547cd6e8be7">Color::GrayDark</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GrayDark&quot;</span>)),</div>
<div class="line"><a id="l00311" name="l00311"></a><span class="lineno"> 311</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fadebf1805c024a5504872f795f83a6835">Color::GrayLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GrayLight&quot;</span>)),</div>
<div class="line"><a id="l00312" name="l00312"></a><span class="lineno"> 312</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab548046646b36c12aa6ba841de500094">Color::White</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;White&quot;</span>)),</div>
<div class="line"><a id="l00313" name="l00313"></a><span class="lineno"> 313</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf5e09dd1da4088464f264b7a3118bff8">Color::Blue</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Blue&quot;</span>)),</div>
<div class="line"><a id="l00314" name="l00314"></a><span class="lineno"> 314</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">Color::BlueLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;BlueLight&quot;</span>)),</div>
<div class="line"><a id="l00315" name="l00315"></a><span class="lineno"> 315</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab0d4738f9c7f12049e52aa4e868bdc8b">Color::Cyan</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Cyan&quot;</span>)),</div>
<div class="line"><a id="l00316" name="l00316"></a><span class="lineno"> 316</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa61bd7f1290cc0a24e565539a61ba5839">Color::CyanLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;CyanLight&quot;</span>)),</div>
<div class="line"><a id="l00317" name="l00317"></a><span class="lineno"> 317</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad0784a3f969fe736e8b271a5a161d106">Color::Green</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Green&quot;</span>)),</div>
<div class="line"><a id="l00318" name="l00318"></a><span class="lineno"> 318</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9827485e548095e18c65045bc8058ce7">Color::GreenLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;GreenLight&quot;</span>)),</div>
<div class="line"><a id="l00319" name="l00319"></a><span class="lineno"> 319</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab5059a620e2c7dc57556b1e275c2f9bc">Color::Magenta</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Magenta&quot;</span>)),</div>
<div class="line"><a id="l00320" name="l00320"></a><span class="lineno"> 320</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9663f993a3affdf3526fa032cfe5b9f4">Color::MagentaLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;MagentaLight&quot;</span>)),</div>
<div class="line"><a id="l00321" name="l00321"></a><span class="lineno"> 321</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad3163c1fcda01965b692ec2c3122b743">Color::Red</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Red&quot;</span>)),</div>
<div class="line"><a id="l00322" name="l00322"></a><span class="lineno"> 322</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">Color::RedLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;RedLight&quot;</span>)),</div>
<div class="line"><a id="l00323" name="l00323"></a><span class="lineno"> 323</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fabf28513245738599d13e3ce36bd16c82">Color::Yellow</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;Yellow&quot;</span>)),</div>
<div class="line"><a id="l00324" name="l00324"></a><span class="lineno"> 324</span> <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa7948fe5f055329af04798409b7ac37b5">Color::YellowLight</a>, <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;YellowLight&quot;</span>)),</div>
<div class="line"><a id="l00325" name="l00325"></a><span class="lineno"> 325</span> }),</div>
<div class="line"><a id="l00326" name="l00326"></a><span class="lineno"> 326</span> }),</div>
<div class="line"><a id="l00327" name="l00327"></a><span class="lineno"> 327</span> }) |</div>
<div class="line"><a id="l00328" name="l00328"></a><span class="lineno"> 328</span> border;</div>
<div class="line"><a id="l00329" name="l00329"></a><span class="lineno"> 329</span> </div>
<div class="line"><a id="l00330" name="l00330"></a><span class="lineno"> 330</span> <span class="keyword">auto</span> palette_256_color_display = <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;256 色調色盤:&quot;</span>);</div>
<div class="line"><a id="l00331" name="l00331"></a><span class="lineno"> 331</span> {</div>
<div class="line"><a id="l00332" name="l00332"></a><span class="lineno"> 332</span> 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 id="l00333" name="l00333"></a><span class="lineno"> 333</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> columns;</div>
<div class="line"><a id="l00334" name="l00334"></a><span class="lineno"> 334</span> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; column : info_columns) {</div>
<div class="line"><a id="l00335" name="l00335"></a><span class="lineno"> 335</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> column_elements;</div>
<div class="line"><a id="l00336" name="l00336"></a><span class="lineno"> 336</span> <span class="keywordflow">for</span> (<span class="keyword">auto</span>&amp; it : column) {</div>
<div class="line"><a id="l00337" name="l00337"></a><span class="lineno"> 337</span> column_elements.push_back(</div>
<div class="line"><a id="l00338" name="l00338"></a><span class="lineno"> 338</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot; &quot;</span>) | <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">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"><a id="l00339" name="l00339"></a><span class="lineno"> 339</span> }</div>
<div class="line"><a id="l00340" name="l00340"></a><span class="lineno"> 340</span> columns.push_back(<a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>(std::move(column_elements)));</div>
<div class="line"><a id="l00341" name="l00341"></a><span class="lineno"> 341</span> }</div>
<div class="line"><a id="l00342" name="l00342"></a><span class="lineno"> 342</span> palette_256_color_display = <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00343" name="l00343"></a><span class="lineno"> 343</span> palette_256_color_display,</div>
<div class="line"><a id="l00344" name="l00344"></a><span class="lineno"> 344</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00345" name="l00345"></a><span class="lineno"> 345</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>(columns),</div>
<div class="line"><a id="l00346" name="l00346"></a><span class="lineno"> 346</span> }) |</div>
<div class="line"><a id="l00347" name="l00347"></a><span class="lineno"> 347</span> border;</div>
<div class="line"><a id="l00348" name="l00348"></a><span class="lineno"> 348</span> }</div>
<div class="line"><a id="l00349" name="l00349"></a><span class="lineno"> 349</span> </div>
<div class="line"><a id="l00350" name="l00350"></a><span class="lineno"> 350</span> <span class="comment">// True color display.</span></div>
<div class="line"><a id="l00351" name="l00351"></a><span class="lineno"> 351</span> <span class="keyword">auto</span> true_color_display = <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;真彩色: 24位元:&quot;</span>);</div>
<div class="line"><a id="l00352" name="l00352"></a><span class="lineno"> 352</span> {</div>
<div class="line"><a id="l00353" name="l00353"></a><span class="lineno"> 353</span> <span class="keywordtype">int</span> saturation = 255;</div>
<div class="line"><a id="l00354" name="l00354"></a><span class="lineno"> 354</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> array;</div>
<div class="line"><a id="l00355" name="l00355"></a><span class="lineno"> 355</span> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> value = 0; value &lt; 255; value += 16) {</div>
<div class="line"><a id="l00356" name="l00356"></a><span class="lineno"> 356</span> <a class="code hl_typedef" href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">Elements</a> line;</div>
<div class="line"><a id="l00357" name="l00357"></a><span class="lineno"> 357</span> <span class="keywordflow">for</span> (<span class="keywordtype">int</span> hue = 0; hue &lt; 255; hue += 6) {</div>
<div class="line"><a id="l00358" name="l00358"></a><span class="lineno"> 358</span> line.push_back(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;▀&quot;</span>) <span class="comment">//</span></div>
<div class="line"><a id="l00359" name="l00359"></a><span class="lineno"> 359</span> | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_function" href="group__screen.html#a1a119fd00beafc7d2aa5f94518e38fc5">Color::HSV</a>(hue, saturation, value)) <span class="comment">//</span></div>
<div class="line"><a id="l00360" name="l00360"></a><span class="lineno"> 360</span> | <a class="code hl_function" href="group__dom.html#ga01d4c5aaf0447e862246849111782245">bgcolor</a>(<a class="code hl_function" href="group__screen.html#a1a119fd00beafc7d2aa5f94518e38fc5">Color::HSV</a>(hue, saturation, value + 8)));</div>
<div class="line"><a id="l00361" name="l00361"></a><span class="lineno"> 361</span> }</div>
<div class="line"><a id="l00362" name="l00362"></a><span class="lineno"> 362</span> array.push_back(<a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>(std::move(line)));</div>
<div class="line"><a id="l00363" name="l00363"></a><span class="lineno"> 363</span> }</div>
<div class="line"><a id="l00364" name="l00364"></a><span class="lineno"> 364</span> true_color_display = <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00365" name="l00365"></a><span class="lineno"> 365</span> true_color_display,</div>
<div class="line"><a id="l00366" name="l00366"></a><span class="lineno"> 366</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00367" name="l00367"></a><span class="lineno"> 367</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>(std::move(array)),</div>
<div class="line"><a id="l00368" name="l00368"></a><span class="lineno"> 368</span> }) |</div>
<div class="line"><a id="l00369" name="l00369"></a><span class="lineno"> 369</span> border;</div>
<div class="line"><a id="l00370" name="l00370"></a><span class="lineno"> 370</span> }</div>
<div class="line"><a id="l00371" name="l00371"></a><span class="lineno"> 371</span> </div>
<div class="line"><a id="l00372" name="l00372"></a><span class="lineno"> 372</span> <span class="keywordflow">return</span> <a class="code hl_function" href="namespaceftxui.html#a168a235aa438b6c72df5861322154be3">flexbox</a>(</div>
<div class="line"><a id="l00373" name="l00373"></a><span class="lineno"> 373</span> {</div>
<div class="line"><a id="l00374" name="l00374"></a><span class="lineno"> 374</span> basic_color_display,</div>
<div class="line"><a id="l00375" name="l00375"></a><span class="lineno"> 375</span> palette_256_color_display,</div>
<div class="line"><a id="l00376" name="l00376"></a><span class="lineno"> 376</span> true_color_display,</div>
<div class="line"><a id="l00377" name="l00377"></a><span class="lineno"> 377</span> },</div>
<div class="line"><a id="l00378" name="l00378"></a><span class="lineno"> 378</span> <a class="code hl_struct" href="group__dom.html#structftxui_1_1FlexboxConfig">FlexboxConfig</a>().<a class="code hl_function" href="group__dom.html#a98d9a43033c09c7f967cdec791408bad">SetGap</a>(1, 1));</div>
<div class="line"><a id="l00379" name="l00379"></a><span class="lineno"> 379</span> });</div>
<div class="line"><a id="l00380" name="l00380"></a><span class="lineno"> 380</span> </div>
<div class="line"><a id="l00381" name="l00381"></a><span class="lineno"> 381</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00382" name="l00382"></a><span class="lineno"> 382</span> <span class="comment">// Gauges</span></div>
<div class="line"><a id="l00383" name="l00383"></a><span class="lineno"> 383</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00384" name="l00384"></a><span class="lineno"> 384</span> <span class="keyword">auto</span> render_gauge = [&amp;shift](<span class="keywordtype">int</span> delta) {</div>
<div class="line"><a id="l00385" name="l00385"></a><span class="lineno"> 385</span> <span class="keywordtype">float</span> progress = (shift + delta) % 500 / 500.f;</div>
<div class="line"><a id="l00386" name="l00386"></a><span class="lineno"> 386</span> <span class="keywordflow">return</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00387" name="l00387"></a><span class="lineno"> 387</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(std::to_string(<span class="keywordtype">int</span>(progress * 100)) + <span class="stringliteral">&quot;% &quot;</span>) |</div>
<div class="line"><a id="l00388" name="l00388"></a><span class="lineno"> 388</span> <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, 5),</div>
<div class="line"><a id="l00389" name="l00389"></a><span class="lineno"> 389</span> <a class="code hl_function" href="group__dom.html#gae0b8041a60629fd790716038738c93ce">gauge</a>(progress),</div>
<div class="line"><a id="l00390" name="l00390"></a><span class="lineno"> 390</span> });</div>
<div class="line"><a id="l00391" name="l00391"></a><span class="lineno"> 391</span> };</div>
<div class="line"><a id="l00392" name="l00392"></a><span class="lineno"> 392</span> </div>
<div class="line"><a id="l00393" name="l00393"></a><span class="lineno"> 393</span> <span class="keyword">auto</span> gauge_component = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([render_gauge] {</div>
<div class="line"><a id="l00394" name="l00394"></a><span class="lineno"> 394</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00395" name="l00395"></a><span class="lineno"> 395</span> render_gauge(0) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fac1e9bce8242f443c54c7405223d616cd">Color::Black</a>),</div>
<div class="line"><a id="l00396" name="l00396"></a><span class="lineno"> 396</span> render_gauge(100) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fade3b52f7f38e412815092547cd6e8be7">Color::GrayDark</a>),</div>
<div class="line"><a id="l00397" name="l00397"></a><span class="lineno"> 397</span> render_gauge(50) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fadebf1805c024a5504872f795f83a6835">Color::GrayLight</a>),</div>
<div class="line"><a id="l00398" name="l00398"></a><span class="lineno"> 398</span> render_gauge(6894) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab548046646b36c12aa6ba841de500094">Color::White</a>),</div>
<div class="line"><a id="l00399" name="l00399"></a><span class="lineno"> 399</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00400" name="l00400"></a><span class="lineno"> 400</span> render_gauge(6841) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf5e09dd1da4088464f264b7a3118bff8">Color::Blue</a>),</div>
<div class="line"><a id="l00401" name="l00401"></a><span class="lineno"> 401</span> render_gauge(9813) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">Color::BlueLight</a>),</div>
<div class="line"><a id="l00402" name="l00402"></a><span class="lineno"> 402</span> render_gauge(98765) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab0d4738f9c7f12049e52aa4e868bdc8b">Color::Cyan</a>),</div>
<div class="line"><a id="l00403" name="l00403"></a><span class="lineno"> 403</span> render_gauge(98) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa61bd7f1290cc0a24e565539a61ba5839">Color::CyanLight</a>),</div>
<div class="line"><a id="l00404" name="l00404"></a><span class="lineno"> 404</span> render_gauge(9846) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad0784a3f969fe736e8b271a5a161d106">Color::Green</a>),</div>
<div class="line"><a id="l00405" name="l00405"></a><span class="lineno"> 405</span> render_gauge(1122) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9827485e548095e18c65045bc8058ce7">Color::GreenLight</a>),</div>
<div class="line"><a id="l00406" name="l00406"></a><span class="lineno"> 406</span> render_gauge(84) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab5059a620e2c7dc57556b1e275c2f9bc">Color::Magenta</a>),</div>
<div class="line"><a id="l00407" name="l00407"></a><span class="lineno"> 407</span> render_gauge(645) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9663f993a3affdf3526fa032cfe5b9f4">Color::MagentaLight</a>),</div>
<div class="line"><a id="l00408" name="l00408"></a><span class="lineno"> 408</span> render_gauge(568) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad3163c1fcda01965b692ec2c3122b743">Color::Red</a>),</div>
<div class="line"><a id="l00409" name="l00409"></a><span class="lineno"> 409</span> render_gauge(2222) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">Color::RedLight</a>),</div>
<div class="line"><a id="l00410" name="l00410"></a><span class="lineno"> 410</span> render_gauge(220) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fabf28513245738599d13e3ce36bd16c82">Color::Yellow</a>),</div>
<div class="line"><a id="l00411" name="l00411"></a><span class="lineno"> 411</span> render_gauge(348) | <a class="code hl_function" href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">color</a>(<a class="code hl_enumvalue" href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa7948fe5f055329af04798409b7ac37b5">Color::YellowLight</a>),</div>
<div class="line"><a id="l00412" name="l00412"></a><span class="lineno"> 412</span> });</div>
<div class="line"><a id="l00413" name="l00413"></a><span class="lineno"> 413</span> });</div>
<div class="line"><a id="l00414" name="l00414"></a><span class="lineno"> 414</span> </div>
<div class="line"><a id="l00415" name="l00415"></a><span class="lineno"> 415</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00416" name="l00416"></a><span class="lineno"> 416</span> <span class="comment">// Paragraph</span></div>
<div class="line"><a id="l00417" name="l00417"></a><span class="lineno"> 417</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00418" name="l00418"></a><span class="lineno"> 418</span> <span class="keyword">auto</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a> = [](<span class="keywordtype">size_t</span> dimx, <span class="keywordtype">size_t</span> dimy) {</div>
<div class="line"><a id="l00419" name="l00419"></a><span class="lineno"> 419</span> std::string title = std::to_string(dimx) + <span class="stringliteral">&quot;x&quot;</span> + std::to_string(dimy);</div>
<div class="line"><a id="l00420" name="l00420"></a><span class="lineno"> 420</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(title) | hcenter | bold,</div>
<div class="line"><a id="l00421" name="l00421"></a><span class="lineno"> 421</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;內容&quot;</span>) | hcenter | dim) |</div>
<div class="line"><a id="l00422" name="l00422"></a><span class="lineno"> 422</span> <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">WIDTH</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, dimx) | <a class="code hl_function" href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">size</a>(<a class="code hl_enumvalue" href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">HEIGHT</a>, <a class="code hl_enumvalue" href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">EQUAL</a>, dimy);</div>
<div class="line"><a id="l00423" name="l00423"></a><span class="lineno"> 423</span> };</div>
<div class="line"><a id="l00424" name="l00424"></a><span class="lineno"> 424</span> </div>
<div class="line"><a id="l00425" name="l00425"></a><span class="lineno"> 425</span> <span class="keyword">auto</span> paragraph_renderer_left = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([&amp;] {</div>
<div class="line"><a id="l00426" name="l00426"></a><span class="lineno"> 426</span> std::string str =</div>
<div class="line"><a id="l00427" name="l00427"></a><span class="lineno"> 427</span> <span class="stringliteral">&quot;Lorem Ipsum 只是印刷和排版行業的虛擬文字。\nLorem Ipsum 自 1500 年代以來一直是該行業的標準虛擬文字，當時一位不知名的印刷商取了一塊活字，並將其打亂製成了一本字體樣本。&quot;</span>;</div>
<div class="line"><a id="l00428" name="l00428"></a><span class="lineno"> 428</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00429" name="l00429"></a><span class="lineno"> 429</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;靠左對齊:&quot;</span>), <a class="code hl_function" href="group__dom.html#gaa334a836eccc573e1137a1ba29d07d8a">paragraphAlignLeft</a>(str)),</div>
<div class="line"><a id="l00430" name="l00430"></a><span class="lineno"> 430</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;置中對齊:&quot;</span>), <a class="code hl_function" href="group__dom.html#ga6a105f6b0d07d7933379ff1ae9282fb8">paragraphAlignCenter</a>(str)),</div>
<div class="line"><a id="l00431" name="l00431"></a><span class="lineno"> 431</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;靠右對齊:&quot;</span>), <a class="code hl_function" href="group__dom.html#ga28a69f06a88c89fe7a507e33ab486411">paragraphAlignRight</a>(str)),</div>
<div class="line"><a id="l00432" name="l00432"></a><span class="lineno"> 432</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;左右對齊:&quot;</span>), <a class="code hl_function" href="group__dom.html#gae4de548aa67ab77cb345e4ddec6b248b">paragraphAlignJustify</a>(str)),</div>
<div class="line"><a id="l00433" name="l00433"></a><span class="lineno"> 433</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;並排顯示&quot;</span>), <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00434" name="l00434"></a><span class="lineno"> 434</span> <a class="code hl_function" href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">paragraph</a>(str),</div>
<div class="line"><a id="l00435" name="l00435"></a><span class="lineno"> 435</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00436" name="l00436"></a><span class="lineno"> 436</span> <a class="code hl_function" href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">paragraph</a>(str),</div>
<div class="line"><a id="l00437" name="l00437"></a><span class="lineno"> 437</span> })),</div>
<div class="line"><a id="l00438" name="l00438"></a><span class="lineno"> 438</span> <a class="code hl_function" href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">window</a>(<a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;不同大小的元素:&quot;</span>),</div>
<div class="line"><a id="l00439" name="l00439"></a><span class="lineno"> 439</span> <a class="code hl_function" href="namespaceftxui.html#a168a235aa438b6c72df5861322154be3">flexbox</a>({</div>
<div class="line"><a id="l00440" name="l00440"></a><span class="lineno"> 440</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 5),</div>
<div class="line"><a id="l00441" name="l00441"></a><span class="lineno"> 441</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(9, 4),</div>
<div class="line"><a id="l00442" name="l00442"></a><span class="lineno"> 442</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(8, 4),</div>
<div class="line"><a id="l00443" name="l00443"></a><span class="lineno"> 443</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(6, 3),</div>
<div class="line"><a id="l00444" name="l00444"></a><span class="lineno"> 444</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 5),</div>
<div class="line"><a id="l00445" name="l00445"></a><span class="lineno"> 445</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(9, 4),</div>
<div class="line"><a id="l00446" name="l00446"></a><span class="lineno"> 446</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(8, 4),</div>
<div class="line"><a id="l00447" name="l00447"></a><span class="lineno"> 447</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(6, 3),</div>
<div class="line"><a id="l00448" name="l00448"></a><span class="lineno"> 448</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(10, 5),</div>
<div class="line"><a id="l00449" name="l00449"></a><span class="lineno"> 449</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(9, 4),</div>
<div class="line"><a id="l00450" name="l00450"></a><span class="lineno"> 450</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(8, 4),</div>
<div class="line"><a id="l00451" name="l00451"></a><span class="lineno"> 451</span> <a class="code hl_function" href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a>(6, 3),</div>
<div class="line"><a id="l00452" name="l00452"></a><span class="lineno"> 452</span> })),</div>
<div class="line"><a id="l00453" name="l00453"></a><span class="lineno"> 453</span> }) |</div>
<div class="line"><a id="l00454" name="l00454"></a><span class="lineno"> 454</span> vscroll_indicator | yframe | flex;</div>
<div class="line"><a id="l00455" name="l00455"></a><span class="lineno"> 455</span> });</div>
<div class="line"><a id="l00456" name="l00456"></a><span class="lineno"> 456</span> </div>
<div class="line"><a id="l00457" name="l00457"></a><span class="lineno"> 457</span> <span class="keyword">auto</span> paragraph_renderer_right = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>([] {</div>
<div class="line"><a id="l00458" name="l00458"></a><span class="lineno"> 458</span> <span class="keywordflow">return</span> <a class="code hl_function" href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">paragraph</a>(<span class="stringliteral">&quot;&lt;--- 這個垂直條可以使用滑鼠調整大小&quot;</span>) |</div>
<div class="line"><a id="l00459" name="l00459"></a><span class="lineno"> 459</span> <a class="code hl_function" href="group__dom.html#ga5b11656305fce8427b81daf1c35883f1">center</a>;</div>
<div class="line"><a id="l00460" name="l00460"></a><span class="lineno"> 460</span> });</div>
<div class="line"><a id="l00461" name="l00461"></a><span class="lineno"> 461</span> </div>
<div class="line"><a id="l00462" name="l00462"></a><span class="lineno"> 462</span> <span class="keywordtype">int</span> paragraph_renderer_split_position = Terminal::Size().dimx / 2;</div>
<div class="line"><a id="l00463" name="l00463"></a><span class="lineno"> 463</span> <span class="keyword">auto</span> paragraph_renderer_group =</div>
<div class="line"><a id="l00464" name="l00464"></a><span class="lineno"> 464</span> <a class="code hl_function" href="group__component.html#gae2205fc172615b43e1e3307bb614be4c">ResizableSplitLeft</a>(paragraph_renderer_left, paragraph_renderer_right,</div>
<div class="line"><a id="l00465" name="l00465"></a><span class="lineno"> 465</span> &amp;paragraph_renderer_split_position);</div>
<div class="line"><a id="l00466" name="l00466"></a><span class="lineno"> 466</span> <span class="keyword">auto</span> paragraph_renderer_group_renderer =</div>
<div class="line"><a id="l00467" name="l00467"></a><span class="lineno"> 467</span> <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>(paragraph_renderer_group,</div>
<div class="line"><a id="l00468" name="l00468"></a><span class="lineno"> 468</span> [&amp;] { <span class="keywordflow">return</span> paragraph_renderer_group-&gt;Render(); });</div>
<div class="line"><a id="l00469" name="l00469"></a><span class="lineno"> 469</span> </div>
<div class="line"><a id="l00470" name="l00470"></a><span class="lineno"> 470</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00471" name="l00471"></a><span class="lineno"> 471</span> <span class="comment">// Tabs</span></div>
<div class="line"><a id="l00472" name="l00472"></a><span class="lineno"> 472</span> <span class="comment">// ---------------------------------------------------------------------------</span></div>
<div class="line"><a id="l00473" name="l00473"></a><span class="lineno"> 473</span> </div>
<div class="line"><a id="l00474" name="l00474"></a><span class="lineno"> 474</span> <span class="keywordtype">int</span> tab_index = 0;</div>
<div class="line"><a id="l00475" name="l00475"></a><span class="lineno"> 475</span> std::vector&lt;std::string&gt; tab_entries = {</div>
<div class="line"><a id="l00476" name="l00476"></a><span class="lineno"> 476</span> <span class="stringliteral">&quot;htop&quot;</span>, <span class="stringliteral">&quot;顏色&quot;</span>, <span class="stringliteral">&quot;旋轉&quot;</span>, <span class="stringliteral">&quot;量表&quot;</span>, <span class="stringliteral">&quot;編譯器&quot;</span>, <span class="stringliteral">&quot;段落&quot;</span>,</div>
<div class="line"><a id="l00477" name="l00477"></a><span class="lineno"> 477</span> };</div>
<div class="line"><a id="l00478" name="l00478"></a><span class="lineno"> 478</span> <span class="keyword">auto</span> tab_selection =</div>
<div class="line"><a id="l00479" name="l00479"></a><span class="lineno"> 479</span> <a class="code hl_function" href="group__component.html#ga27828fc39da10a18478ba84b1b162039">Menu</a>(&amp;tab_entries, &amp;tab_index, <a class="code hl_function" href="group__component.html#aedc93fba91339d9713812821cb140c50">MenuOption::HorizontalAnimated</a>());</div>
<div class="line"><a id="l00480" name="l00480"></a><span class="lineno"> 480</span> <span class="keyword">auto</span> tab_content = Container::Tab(</div>
<div class="line"><a id="l00481" name="l00481"></a><span class="lineno"> 481</span> {</div>
<div class="line"><a id="l00482" name="l00482"></a><span class="lineno"> 482</span> htop,</div>
<div class="line"><a id="l00483" name="l00483"></a><span class="lineno"> 483</span> color_tab_renderer,</div>
<div class="line"><a id="l00484" name="l00484"></a><span class="lineno"> 484</span> spinner_tab_renderer,</div>
<div class="line"><a id="l00485" name="l00485"></a><span class="lineno"> 485</span> gauge_component,</div>
<div class="line"><a id="l00486" name="l00486"></a><span class="lineno"> 486</span> compiler_renderer,</div>
<div class="line"><a id="l00487" name="l00487"></a><span class="lineno"> 487</span> paragraph_renderer_group_renderer,</div>
<div class="line"><a id="l00488" name="l00488"></a><span class="lineno"> 488</span> },</div>
<div class="line"><a id="l00489" name="l00489"></a><span class="lineno"> 489</span> &amp;tab_index);</div>
<div class="line"><a id="l00490" name="l00490"></a><span class="lineno"> 490</span> </div>
<div class="line"><a id="l00491" name="l00491"></a><span class="lineno"> 491</span> <span class="keyword">auto</span> exit_button =</div>
<div class="line"><a id="l00492" name="l00492"></a><span class="lineno"> 492</span> <a class="code hl_function" href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">Button</a>(<span class="stringliteral">&quot;離開&quot;</span>, [&amp;] { screen.Exit(); }, <a class="code hl_function" href="group__component.html#a008018822835ed0f3758af3c6e72837d">ButtonOption::Animated</a>());</div>
<div class="line"><a id="l00493" name="l00493"></a><span class="lineno"> 493</span> </div>
<div class="line"><a id="l00494" name="l00494"></a><span class="lineno"> 494</span> <span class="keyword">auto</span> main_container = Container::Vertical({</div>
<div class="line"><a id="l00495" name="l00495"></a><span class="lineno"> 495</span> Container::Horizontal({</div>
<div class="line"><a id="l00496" name="l00496"></a><span class="lineno"> 496</span> tab_selection,</div>
<div class="line"><a id="l00497" name="l00497"></a><span class="lineno"> 497</span> exit_button,</div>
<div class="line"><a id="l00498" name="l00498"></a><span class="lineno"> 498</span> }),</div>
<div class="line"><a id="l00499" name="l00499"></a><span class="lineno"> 499</span> tab_content,</div>
<div class="line"><a id="l00500" name="l00500"></a><span class="lineno"> 500</span> });</div>
<div class="line"><a id="l00501" name="l00501"></a><span class="lineno"> 501</span> </div>
<div class="line"><a id="l00502" name="l00502"></a><span class="lineno"> 502</span> <span class="keyword">auto</span> main_renderer = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>(main_container, [&amp;] {</div>
<div class="line"><a id="l00503" name="l00503"></a><span class="lineno"> 503</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00504" name="l00504"></a><span class="lineno"> 504</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;FTXUI 示範&quot;</span>) | bold | <a class="code hl_function" href="group__dom.html#gaf7d0d1e44c1a5424e42a5cddceacf7f7">hcenter</a>,</div>
<div class="line"><a id="l00505" name="l00505"></a><span class="lineno"> 505</span> <a class="code hl_function" href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">hbox</a>({</div>
<div class="line"><a id="l00506" name="l00506"></a><span class="lineno"> 506</span> tab_selection-&gt;Render() | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00507" name="l00507"></a><span class="lineno"> 507</span> exit_button-&gt;Render(),</div>
<div class="line"><a id="l00508" name="l00508"></a><span class="lineno"> 508</span> }),</div>
<div class="line"><a id="l00509" name="l00509"></a><span class="lineno"> 509</span> tab_content-&gt;<a class="code hl_function" href="group__dom.html#a02feb1564ee23b6229b82be0289c96e4">Render</a>() | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>,</div>
<div class="line"><a id="l00510" name="l00510"></a><span class="lineno"> 510</span> });</div>
<div class="line"><a id="l00511" name="l00511"></a><span class="lineno"> 511</span> });</div>
<div class="line"><a id="l00512" name="l00512"></a><span class="lineno"> 512</span> </div>
<div class="line"><a id="l00513" name="l00513"></a><span class="lineno"> 513</span> <a class="code hl_class" href="classftxui_1_1Loop.html">Loop</a> loop(&amp;screen, main_renderer);</div>
<div class="line"><a id="l00514" name="l00514"></a><span class="lineno"> 514</span> <span class="keywordflow">while</span> (!loop.HasQuitted()) {</div>
<div class="line"><a id="l00515" name="l00515"></a><span class="lineno"> 515</span> <span class="comment">// 更新應用程式狀態。</span></div>
<div class="line"><a id="l00516" name="l00516"></a><span class="lineno"> 516</span> shift++;</div>
<div class="line"><a id="l00517" name="l00517"></a><span class="lineno"> 517</span> </div>
<div class="line"><a id="l00518" name="l00518"></a><span class="lineno"> 518</span> <span class="comment">// 請求繪製新畫面。</span></div>
<div class="line"><a id="l00519" name="l00519"></a><span class="lineno"> 519</span> screen.RequestAnimationFrame();</div>
<div class="line"><a id="l00520" name="l00520"></a><span class="lineno"> 520</span> </div>
<div class="line"><a id="l00521" name="l00521"></a><span class="lineno"> 521</span> <span class="comment">// Execute events, and draw the next frame.</span></div>
<div class="line"><a id="l00522" name="l00522"></a><span class="lineno"> 522</span> loop.RunOnce();</div>
<div class="line"><a id="l00523" name="l00523"></a><span class="lineno"> 523</span> </div>
<div class="line"><a id="l00524" name="l00524"></a><span class="lineno"> 524</span> <span class="comment">// 短暫睡眠以控制幀率 (60 FPS)。</span></div>
<div class="line"><a id="l00525" name="l00525"></a><span class="lineno"> 525</span> std::this_thread::sleep_for(std::chrono::milliseconds(1000 / 60));</div>
<div class="line"><a id="l00526" name="l00526"></a><span class="lineno"> 526</span> }</div>
<div class="line"><a id="l00527" name="l00527"></a><span class="lineno"> 527</span> </div>
<div class="line"><a id="l00528" name="l00528"></a><span class="lineno"> 528</span> <span class="keywordflow">return</span> 0;</div>
<div class="line"><a id="l00529" name="l00529"></a><span class="lineno"> 529</span>}</div>
</div>
<div class="ttc" id="aclassftxui_1_1Loop_html"><div class="ttname"><a href="classftxui_1_1Loop.html">ftxui::Loop</a></div><div class="ttdoc">Loop 是一個用於管理元件事件循環的類別。</div><div class="ttdef"><b>Definition</b> <a href="loop_8hpp_source.html#l00056">loop.hpp:56</a></div></div>
<div class="ttc" id="acolor_8hpp_html"><div class="ttname"><a href="color_8hpp.html">color.hpp</a></div></div>
<div class="ttc" id="acolor__info_8hpp_html"><div class="ttname"><a href="color__info_8hpp.html">color_info.hpp</a></div></div>
<div class="ttc" id="acolor__info__sorted__2d_8ipp_html"><div class="ttname"><a href="color__info__sorted__2d_8ipp.html">color_info_sorted_2d.ipp</a></div></div>
<div class="ttc" id="acolor__info__sorted__2d_8ipp_html_a0f08918d6064cd2a0e56cb9ec74033ca"><div class="ttname"><a href="color__info__sorted__2d_8ipp.html#a0f08918d6064cd2a0e56cb9ec74033ca">ColorInfoSorted2D</a></div><div class="ttdeci">std::vector&lt; std::vector&lt; ftxui::ColorInfo &gt; &gt; ColorInfoSorted2D()</div><div class="ttdef"><b>Definition</b> <a href="color__info__sorted__2d_8ipp_source.html#l00005">color_info_sorted_2d.ipp:5</a></div></div>
<div class="ttc" id="acomponent_8hpp_html"><div class="ttname"><a href="component_8hpp.html">component.hpp</a></div></div>
<div class="ttc" id="acomponent__base_8hpp_html"><div class="ttname"><a href="component__base_8hpp.html">component_base.hpp</a></div></div>
<div class="ttc" id="acomponent__options_8hpp_html"><div class="ttname"><a href="component__options_8hpp.html">component_options.hpp</a></div></div>
<div class="ttc" id="aelements_8hpp_html"><div class="ttname"><a href="elements_8hpp.html">elements.hpp</a></div></div>
<div class="ttc" id="aevent_8hpp_html"><div class="ttname"><a href="event_8hpp.html">event.hpp</a></div></div>
<div class="ttc" id="aexamples_2component_2focus_8cpp_html_a9ffb8a33ec5d0133f63f791d526df1c7"><div class="ttname"><a href="examples_2component_2focus_8cpp.html#a9ffb8a33ec5d0133f63f791d526df1c7">make_box</a></div><div class="ttdeci">Element make_box(int x, int y)</div><div class="ttdef"><b>Definition</b> <a href="examples_2component_2focus_8cpp_source.html#l00017">examples/component/focus.cpp:17</a></div></div>
<div class="ttc" id="aflexbox__config_8hpp_html"><div class="ttname"><a href="flexbox__config_8hpp.html">flexbox_config.hpp</a></div></div>
<div class="ttc" id="agallery_8cpp_html_a877535c3b6ffdf230bce90c82c597d17"><div class="ttname"><a href="gallery_8cpp.html#a877535c3b6ffdf230bce90c82c597d17">input</a></div><div class="ttdeci">auto input</div><div class="ttdef"><b>Definition</b> <a href="gallery_8cpp_source.html#l00078">gallery.cpp:78</a></div></div>
<div class="ttc" id="agroup__component_html_a008018822835ed0f3758af3c6e72837d"><div class="ttname"><a href="group__component.html#a008018822835ed0f3758af3c6e72837d">ftxui::ButtonOption::Animated</a></div><div class="ttdeci">static ButtonOption Animated()</div><div class="ttdoc">創建一個 ButtonOption，使用動畫顏色。</div><div class="ttdef"><b>Definition</b> <a href="component__options_8cpp_source.html#l00195">component_options.cpp:195</a></div></div>
<div class="ttc" id="agroup__component_html_a28d41d6113c5b29c8dd45846582b3299"><div class="ttname"><a href="group__component.html#a28d41d6113c5b29c8dd45846582b3299">ftxui::ComponentBase::Render</a></div><div class="ttdeci">Element Render()</div><div class="ttdoc">繪製組件。 建構一個 ftxui::Element，用於在表示此 ftxui::ComponentBase 的 ftxui::Screen 上繪製。請覆寫 OnRender() 以修改渲染。</div><div class="ttdef"><b>Definition</b> <a href="component_8cpp_source.html#l00101">component.cpp:101</a></div></div>
<div class="ttc" id="agroup__component_html_a53dc5c3030151713857cf1a898d0f897"><div class="ttname"><a href="group__component.html#a53dc5c3030151713857cf1a898d0f897">ftxui::ScreenInteractive::Fullscreen</a></div><div class="ttdeci">static ScreenInteractive Fullscreen()</div><div class="ttdef"><b>Definition</b> <a href="screen__interactive_8cpp_source.html#l00297">screen_interactive.cpp:297</a></div></div>
<div class="ttc" id="agroup__component_html_aedc93fba91339d9713812821cb140c50"><div class="ttname"><a href="group__component.html#aedc93fba91339d9713812821cb140c50">ftxui::MenuOption::HorizontalAnimated</a></div><div class="ttdeci">static MenuOption HorizontalAnimated()</div><div class="ttdoc">動畫水平選單的標準選項。 這對於實現一個標籤頁列很有用。</div><div class="ttdef"><b>Definition</b> <a href="component__options_8cpp_source.html#l00092">component_options.cpp:92</a></div></div>
<div class="ttc" id="agroup__component_html_ga243cc8fe212cb7467025c89e84288bdb"><div class="ttname"><a href="group__component.html#ga243cc8fe212cb7467025c89e84288bdb">ftxui::Checkbox</a></div><div class="ttdeci">Component Checkbox(CheckboxOption options)</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2checkbox_8cpp_source.html#l00107">src/ftxui/component/checkbox.cpp:107</a></div></div>
<div class="ttc" id="agroup__component_html_ga27828fc39da10a18478ba84b1b162039"><div class="ttname"><a href="group__component.html#ga27828fc39da10a18478ba84b1b162039">ftxui::Menu</a></div><div class="ttdeci">Component Menu(MenuOption options)</div><div class="ttdoc">文字列表。選定的元素會被聚焦。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2menu_8cpp_source.html#l00512">src/ftxui/component/menu.cpp:512</a></div></div>
<div class="ttc" id="agroup__component_html_ga3e7a44f321fa910f07aef5879e67af95"><div class="ttname"><a href="group__component.html#ga3e7a44f321fa910f07aef5879e67af95">ftxui::Radiobox</a></div><div class="ttdeci">Component Radiobox(RadioboxOption options)</div><div class="ttdoc">元素清單，只能選擇一個。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2radiobox_8cpp_source.html#l00203">src/ftxui/component/radiobox.cpp:203</a></div></div>
<div class="ttc" id="agroup__component_html_ga4e8295ec77dd31b0acc5063b134473e7"><div class="ttname"><a href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">ftxui::Button</a></div><div class="ttdeci">Component Button(ButtonOption options)</div><div class="ttdoc">繪製一個按鈕。點擊時執行一個函數。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2button_8cpp_source.html#l00174">src/ftxui/component/button.cpp:174</a></div></div>
<div class="ttc" id="agroup__component_html_ga533e883e2aeea28de2b60564fcaf0361"><div class="ttname"><a href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">ftxui::Renderer</a></div><div class="ttdeci">Component Renderer(Component child, std::function&lt; Element()&gt;)</div><div class="ttdoc">回傳一個新的元件，類似於 |child|，但使用 |render| 作為 Component::Render() 事件。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2renderer_8cpp_source.html#l00059">src/ftxui/component/renderer.cpp:59</a></div></div>
<div class="ttc" id="agroup__component_html_ga7f285fcbc4dd0a0767b89a255fd062dc"><div class="ttname"><a href="group__component.html#ga7f285fcbc4dd0a0767b89a255fd062dc">ftxui::Input</a></div><div class="ttdeci">Component Input(InputOption options={})</div><div class="ttdoc">用於編輯文字的輸入框。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2input_8cpp_source.html#l00570">src/ftxui/component/input.cpp:570</a></div></div>
<div class="ttc" id="agroup__component_html_gae2205fc172615b43e1e3307bb614be4c"><div class="ttname"><a href="group__component.html#gae2205fc172615b43e1e3307bb614be4c">ftxui::ResizableSplitLeft</a></div><div class="ttdeci">Component ResizableSplitLeft(Component main, Component back, int *main_size)</div><div class="ttdoc">兩個元件之間的水平分割，可透過滑鼠設定。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2component_2resizable__split_8cpp_source.html#l00198">src/ftxui/component/resizable_split.cpp:198</a></div></div>
<div class="ttc" id="agroup__component_html_structftxui_1_1InputOption"><div class="ttname"><a href="group__component.html#structftxui_1_1InputOption">ftxui::InputOption</a></div><div class="ttdoc">Input 元件的選項。</div><div class="ttdef"><b>Definition</b> <a href="component__options_8hpp_source.html#l00165">component_options.hpp:165</a></div></div>
<div class="ttc" id="agroup__dom_html_a02feb1564ee23b6229b82be0289c96e4"><div class="ttname"><a href="group__dom.html#a02feb1564ee23b6229b82be0289c96e4">ftxui::Node::Render</a></div><div class="ttdeci">virtual void Render(Screen &amp;screen)</div></div>
<div class="ttc" id="agroup__dom_html_a98d9a43033c09c7f967cdec791408bad"><div class="ttname"><a href="group__dom.html#a98d9a43033c09c7f967cdec791408bad">ftxui::FlexboxConfig::SetGap</a></div><div class="ttdeci">FlexboxConfig &amp; SetGap(int gap_x, int gap_y)</div><div class="ttdoc">設定 flexbox 彈性方向。</div><div class="ttdef"><b>Definition</b> <a href="flexbox__config_8cpp_source.html#l00039">flexbox_config.cpp:39</a></div></div>
<div class="ttc" id="agroup__dom_html_ga01d4c5aaf0447e862246849111782245"><div class="ttname"><a href="group__dom.html#ga01d4c5aaf0447e862246849111782245">ftxui::bgcolor</a></div><div class="ttdeci">Decorator bgcolor(Color)</div><div class="ttdoc">使用背景顏色進行裝飾。</div><div class="ttdef"><b>Definition</b> <a href="dom_2color_8cpp_source.html#l00124">dom/color.cpp:124</a></div></div>
<div class="ttc" id="agroup__dom_html_ga03049def08fa7a5eaa4d5e897152bc1a"><div class="ttname"><a href="group__dom.html#ga03049def08fa7a5eaa4d5e897152bc1a">ftxui::window</a></div><div class="ttdeci">Element window(Element title, Element content, BorderStyle border=ROUNDED)</div><div class="ttdoc">繪製帶有標題和邊框的視窗。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2border_8cpp_source.html#l00507">src/ftxui/dom/border.cpp:507</a></div></div>
<div class="ttc" id="agroup__dom_html_ga201220986fbdc539e42efe067985cbdb"><div class="ttname"><a href="group__dom.html#ga201220986fbdc539e42efe067985cbdb">ftxui::size</a></div><div class="ttdeci">Decorator size(WidthOrHeight, Constraint, int value)</div><div class="ttdoc">限制元素的大小。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2size_8cpp_source.html#l00088">src/ftxui/dom/size.cpp:88</a></div></div>
<div class="ttc" id="agroup__dom_html_ga257acd2bd47bab7db879cca2c0e67e23"><div class="ttname"><a href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">ftxui::flex</a></div><div class="ttdeci">Element flex(Element)</div><div class="ttdoc">使子元素按比例擴展以佔據容器中剩餘的空間。</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00140">flex.cpp:140</a></div></div>
<div class="ttc" id="agroup__dom_html_ga28a69f06a88c89fe7a507e33ab486411"><div class="ttname"><a href="group__dom.html#ga28a69f06a88c89fe7a507e33ab486411">ftxui::paragraphAlignRight</a></div><div class="ttdeci">Element paragraphAlignRight(const std::string &amp;text)</div><div class="ttdoc">回傳一個在多行上繪製段落並靠右對齊的元素。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2paragraph_8cpp_source.html#l00057">src/ftxui/dom/paragraph.cpp:57</a></div></div>
<div class="ttc" id="agroup__dom_html_ga3b08e0030a0831d3ec3e2a505908273b"><div class="ttname"><a href="group__dom.html#ga3b08e0030a0831d3ec3e2a505908273b">ftxui::spinner</a></div><div class="ttdeci">Element spinner(int charset_index, size_t image_index)</div><div class="ttdoc">用於表示時間和/或事件的效果。這將顯示 一個 ASCII 藝術「影片」。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2spinner_8cpp_source.html#l00282">src/ftxui/dom/spinner.cpp:282</a></div></div>
<div class="ttc" id="agroup__dom_html_ga5b11656305fce8427b81daf1c35883f1"><div class="ttname"><a href="group__dom.html#ga5b11656305fce8427b81daf1c35883f1">ftxui::center</a></div><div class="ttdeci">Element center(Element)</div><div class="ttdoc">水平與垂直置中一個元素。</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00031">composite_decorator.cpp:31</a></div></div>
<div class="ttc" id="agroup__dom_html_ga6a105f6b0d07d7933379ff1ae9282fb8"><div class="ttname"><a href="group__dom.html#ga6a105f6b0d07d7933379ff1ae9282fb8">ftxui::paragraphAlignCenter</a></div><div class="ttdeci">Element paragraphAlignCenter(const std::string &amp;text)</div><div class="ttdoc">回傳一個在多行上繪製段落並置中對齊的元素。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2paragraph_8cpp_source.html#l00068">src/ftxui/dom/paragraph.cpp:68</a></div></div>
<div class="ttc" id="agroup__dom_html_ga75baaa2734ed76a9f478beaafa87ae57"><div class="ttname"><a href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">ftxui::text</a></div><div class="ttdeci">Element text(std::wstring text)</div><div class="ttdoc">顯示一段 Unicode 文字。</div><div class="ttdef"><b>Definition</b> <a href="text_8cpp_source.html#l00160">text.cpp:160</a></div></div>
<div class="ttc" id="agroup__dom_html_ga81ed6b31f512e849247f13d249f6f20e"><div class="ttname"><a href="group__dom.html#ga81ed6b31f512e849247f13d249f6f20e">ftxui::flex_grow</a></div><div class="ttdeci">Element flex_grow(Element)</div><div class="ttdoc">盡可能擴展。</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00158">flex.cpp:158</a></div></div>
<div class="ttc" id="agroup__dom_html_gaa334a836eccc573e1137a1ba29d07d8a"><div class="ttname"><a href="group__dom.html#gaa334a836eccc573e1137a1ba29d07d8a">ftxui::paragraphAlignLeft</a></div><div class="ttdeci">Element paragraphAlignLeft(const std::string &amp;text)</div><div class="ttdoc">回傳一個在多行上繪製段落並靠左對齊的元素。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2paragraph_8cpp_source.html#l00047">src/ftxui/dom/paragraph.cpp:47</a></div></div>
<div class="ttc" id="agroup__dom_html_gac1ef1cf6bf7cd0759ffa195071edb2a0"><div class="ttname"><a href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">ftxui::separator</a></div><div class="ttdeci">Element separator()</div><div class="ttdoc">在兩個元素之間繪製垂直或水平分隔線。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2separator_8cpp_source.html#l00133">src/ftxui/dom/separator.cpp:133</a></div></div>
<div class="ttc" id="agroup__dom_html_gac2a9ed2d22ec3c8811b61f4a901ed367"><div class="ttname"><a href="group__dom.html#gac2a9ed2d22ec3c8811b61f4a901ed367">ftxui::filler</a></div><div class="ttdeci">Element filler()</div><div class="ttdoc">一個元素，它會按比例擴展以佔據容器中剩餘的空間。</div><div class="ttdef"><b>Definition</b> <a href="flex_8cpp_source.html#l00097">flex.cpp:97</a></div></div>
<div class="ttc" id="agroup__dom_html_gae0b8041a60629fd790716038738c93ce"><div class="ttname"><a href="group__dom.html#gae0b8041a60629fd790716038738c93ce">ftxui::gauge</a></div><div class="ttdeci">Element gauge(float progress)</div><div class="ttdoc">繪製一個高解析度進度條。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2gauge_8cpp_source.html#l00292">src/ftxui/dom/gauge.cpp:292</a></div></div>
<div class="ttc" id="agroup__dom_html_gae4de548aa67ab77cb345e4ddec6b248b"><div class="ttname"><a href="group__dom.html#gae4de548aa67ab77cb345e4ddec6b248b">ftxui::paragraphAlignJustify</a></div><div class="ttdeci">Element paragraphAlignJustify(const std::string &amp;text)</div><div class="ttdoc">回傳一個在多行上繪製段落並使用左右對齊的元素。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2paragraph_8cpp_source.html#l00079">src/ftxui/dom/paragraph.cpp:79</a></div></div>
<div class="ttc" id="agroup__dom_html_gaf61b489da39ca5e24b68e6e1a2b09c0d"><div class="ttname"><a href="group__dom.html#gaf61b489da39ca5e24b68e6e1a2b09c0d">ftxui::color</a></div><div class="ttdeci">Decorator color(Color)</div><div class="ttdoc">使用前景顏色進行裝飾。</div><div class="ttdef"><b>Definition</b> <a href="dom_2color_8cpp_source.html#l00110">dom/color.cpp:110</a></div></div>
<div class="ttc" id="agroup__dom_html_gaf7d0d1e44c1a5424e42a5cddceacf7f7"><div class="ttname"><a href="group__dom.html#gaf7d0d1e44c1a5424e42a5cddceacf7f7">ftxui::hcenter</a></div><div class="ttdeci">Element hcenter(Element)</div><div class="ttdoc">水平置中一個元素。</div><div class="ttdef"><b>Definition</b> <a href="composite__decorator_8cpp_source.html#l00015">composite_decorator.cpp:15</a></div></div>
<div class="ttc" id="agroup__dom_html_gafd28058f0ccbbdf34691a85a7cc9b2e3"><div class="ttname"><a href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">ftxui::vbox</a></div><div class="ttdeci">Element vbox(Elements)</div><div class="ttdoc">一個垂直一個接一個顯示元素的容器。</div><div class="ttdef"><b>Definition</b> <a href="vbox_8cpp_source.html#l00095">vbox.cpp:95</a></div></div>
<div class="ttc" id="agroup__dom_html_structftxui_1_1FlexboxConfig"><div class="ttname"><a href="group__dom.html#structftxui_1_1FlexboxConfig">ftxui::FlexboxConfig</a></div><div class="ttdoc">FlexboxConfig 是一個配置結構，用於定義彈性盒容器的佈局屬性。</div><div class="ttdef"><b>Definition</b> <a href="flexbox__config_8hpp_source.html#l00023">flexbox_config.hpp:23</a></div></div>
<div class="ttc" id="agroup__screen_html_a1a119fd00beafc7d2aa5f94518e38fc5"><div class="ttname"><a href="group__screen.html#a1a119fd00beafc7d2aa5f94518e38fc5">ftxui::Color::HSV</a></div><div class="ttdeci">static Color HSV(uint8_t hue, uint8_t saturation, uint8_t value)</div><div class="ttdoc">從 HSV 表示建立一個顏色。 https://en.wikipedia.org/wiki/HSL_and_HSV</div><div class="ttdef"><b>Definition</b> <a href="screen_2color_8cpp_source.html#l00198">screen/color.cpp:198</a></div></div>
<div class="ttc" id="agroup__screen_html_aa4be56f94fc180d7b070df23c235b0c7a79935518a3889663d8688b6b01fff051"><div class="ttname"><a href="group__screen.html#aa4be56f94fc180d7b070df23c235b0c7a79935518a3889663d8688b6b01fff051">ftxui::Color::Default</a></div><div class="ttdeci">@ Default</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00048">color.hpp:48</a></div></div>
<div class="ttc" id="agroup__screen_html_abd07c48f62cc507fafa2486a43130fcf"><div class="ttname"><a href="group__screen.html#abd07c48f62cc507fafa2486a43130fcf">ftxui::Color::Palette256</a></div><div class="ttdeci">Palette256</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00070">color.hpp:70</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa0a04dda6f997cd48c0ca74203c501d27">ftxui::Color::RedLight</a></div><div class="ttdeci">@ RedLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00061">color.hpp:61</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fa61bd7f1290cc0a24e565539a61ba5839"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa61bd7f1290cc0a24e565539a61ba5839">ftxui::Color::CyanLight</a></div><div class="ttdeci">@ CyanLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00066">color.hpp:66</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fa7948fe5f055329af04798409b7ac37b5"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa7948fe5f055329af04798409b7ac37b5">ftxui::Color::YellowLight</a></div><div class="ttdeci">@ YellowLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00063">color.hpp:63</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fa9663f993a3affdf3526fa032cfe5b9f4"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9663f993a3affdf3526fa032cfe5b9f4">ftxui::Color::MagentaLight</a></div><div class="ttdeci">@ MagentaLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00065">color.hpp:65</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fa9827485e548095e18c65045bc8058ce7"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fa9827485e548095e18c65045bc8058ce7">ftxui::Color::GreenLight</a></div><div class="ttdeci">@ GreenLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00062">color.hpp:62</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fab0d4738f9c7f12049e52aa4e868bdc8b"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab0d4738f9c7f12049e52aa4e868bdc8b">ftxui::Color::Cyan</a></div><div class="ttdeci">@ Cyan</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00058">color.hpp:58</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fab5059a620e2c7dc57556b1e275c2f9bc"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab5059a620e2c7dc57556b1e275c2f9bc">ftxui::Color::Magenta</a></div><div class="ttdeci">@ Magenta</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00057">color.hpp:57</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fab548046646b36c12aa6ba841de500094"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fab548046646b36c12aa6ba841de500094">ftxui::Color::White</a></div><div class="ttdeci">@ White</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00067">color.hpp:67</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fabf28513245738599d13e3ce36bd16c82"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fabf28513245738599d13e3ce36bd16c82">ftxui::Color::Yellow</a></div><div class="ttdeci">@ Yellow</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00055">color.hpp:55</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fac1e9bce8242f443c54c7405223d616cd"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fac1e9bce8242f443c54c7405223d616cd">ftxui::Color::Black</a></div><div class="ttdeci">@ Black</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00052">color.hpp:52</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fad0784a3f969fe736e8b271a5a161d106"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad0784a3f969fe736e8b271a5a161d106">ftxui::Color::Green</a></div><div class="ttdeci">@ Green</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00054">color.hpp:54</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fad3163c1fcda01965b692ec2c3122b743"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fad3163c1fcda01965b692ec2c3122b743">ftxui::Color::Red</a></div><div class="ttdeci">@ Red</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00053">color.hpp:53</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fade3b52f7f38e412815092547cd6e8be7"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fade3b52f7f38e412815092547cd6e8be7">ftxui::Color::GrayDark</a></div><div class="ttdeci">@ GrayDark</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00060">color.hpp:60</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802fadebf1805c024a5504872f795f83a6835"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802fadebf1805c024a5504872f795f83a6835">ftxui::Color::GrayLight</a></div><div class="ttdeci">@ GrayLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00059">color.hpp:59</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802faf5e09dd1da4088464f264b7a3118bff8"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf5e09dd1da4088464f264b7a3118bff8">ftxui::Color::Blue</a></div><div class="ttdeci">@ Blue</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00056">color.hpp:56</a></div></div>
<div class="ttc" id="agroup__screen_html_ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd"><div class="ttname"><a href="group__screen.html#ae2b6d9670960e89c66d7b76167a0802faf7cc79a56a740e9c59a156b0b3b93cbd">ftxui::Color::BlueLight</a></div><div class="ttdeci">@ BlueLight</div><div class="ttdef"><b>Definition</b> <a href="color_8hpp_source.html#l00064">color.hpp:64</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>Definition</b> <a href="color_8hpp_source.html#l00020">color.hpp:20</a></div></div>
<div class="ttc" id="ahomescreen_8cpp_html_ae66f6b31b5ad750f1fe042a706a4e3d4"><div class="ttname"><a href="homescreen_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a></div><div class="ttdeci">int main()</div><div class="ttdef"><b>Definition</b> <a href="#l00031">homescreen.cpp:31</a></div></div>
<div class="ttc" id="aloop_8hpp_html"><div class="ttname"><a href="loop_8hpp.html">loop.hpp</a></div></div>
<div class="ttc" id="anamespaceftxui_html"><div class="ttname"><a href="namespaceftxui.html">ftxui</a></div><div class="ttdoc">FTXUI 的 ftxui:: 命名空間</div><div class="ttdef"><b>Definition</b> <a href="animation_8hpp_source.html#l00010">animation.hpp:10</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000"><div class="ttname"><a href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a38b9241136017b93ea2755a49cf0a000">ftxui::HEIGHT</a></div><div class="ttdeci">@ HEIGHT</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00158">elements.hpp:158</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522"><div class="ttname"><a href="namespaceftxui.html#a04711c04f28aabfa0e5928a35baaec53a73c0818986b7c462c2977f57afd00522">ftxui::WIDTH</a></div><div class="ttdeci">@ WIDTH</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00158">elements.hpp:158</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a168a235aa438b6c72df5861322154be3"><div class="ttname"><a href="namespaceftxui.html#a168a235aa438b6c72df5861322154be3">ftxui::flexbox</a></div><div class="ttdeci">Element flexbox(Elements, FlexboxConfig config=FlexboxConfig())</div><div class="ttdoc">一個容器，用於在行/列中顯示元素，並在滿時能夠換行到下一列/行。</div><div class="ttdef"><b>Definition</b> <a href="flexbox_8cpp_source.html#l00249">flexbox.cpp:249</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a345b31919048562675615d5af78e6322"><div class="ttname"><a href="namespaceftxui.html#a345b31919048562675615d5af78e6322">ftxui::hflow</a></div><div class="ttdeci">Element hflow(Elements)</div><div class="ttdoc">一個容器，用於從左到右在行中顯示元素。當填滿時，它會在下方的新行開始。</div><div class="ttdef"><b>Definition</b> <a href="flexbox_8cpp_source.html#l00266">flexbox.cpp:266</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a552ba6d33b3c9bec586b99fba4c243ac"><div class="ttname"><a href="namespaceftxui.html#a552ba6d33b3c9bec586b99fba4c243ac">ftxui::hbox</a></div><div class="ttdeci">Element hbox(Elements)</div><div class="ttdoc">一個逐一水平顯示元素的容器。</div><div class="ttdef"><b>Definition</b> <a href="hbox_8cpp_source.html#l00094">hbox.cpp:94</a></div></div>
<div class="ttc" id="anamespaceftxui_html_a5d4aa06ca6cc6a72e981bd5386f93f0a"><div class="ttname"><a href="namespaceftxui.html#a5d4aa06ca6cc6a72e981bd5386f93f0a">ftxui::Elements</a></div><div class="ttdeci">std::vector&lt; Element &gt; Elements</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00023">elements.hpp:23</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ac54cdd05db30871ce082a8fa650545da"><div class="ttname"><a href="namespaceftxui.html#ac54cdd05db30871ce082a8fa650545da">ftxui::paragraph</a></div><div class="ttdeci">Elements paragraph(std::wstring text)</div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a41b05932cd237b2b133fff1ade85bed5">ftxui::LESS_THAN</a></div><div class="ttdeci">@ LESS_THAN</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00159">elements.hpp:159</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a59a84258a4cb9025b567ee5139455029">ftxui::EQUAL</a></div><div class="ttdeci">@ EQUAL</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00159">elements.hpp:159</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c"><div class="ttname"><a href="namespaceftxui.html#ae09f44b989d381a387329fd0a0935926a5fae95457121bd697edd588d1b64cc7c">ftxui::GREATER_THAN</a></div><div class="ttdeci">@ GREATER_THAN</div><div class="ttdef"><b>Definition</b> <a href="elements_8hpp_source.html#l00159">elements.hpp:159</a></div></div>
<div class="ttc" id="anamespaceftxui_html_ae78c2b2b147e65701493465f8e3f4d89"><div class="ttname"><a href="namespaceftxui.html#ae78c2b2b147e65701493465f8e3f4d89">ftxui::graph</a></div><div class="ttdeci">Element graph(GraphFunction)</div><div class="ttdoc">使用 GraphFunction 繪製圖形。</div><div class="ttdef"><b>Definition</b> <a href="src_2ftxui_2dom_2graph_8cpp_source.html#l00071">src/ftxui/dom/graph.cpp:71</a></div></div>
<div class="ttc" id="anamespaceftxui_html_af1479ede01dbf087342534ab4ada11d3"><div class="ttname"><a href="namespaceftxui.html#af1479ede01dbf087342534ab4ada11d3">ftxui::Component</a></div><div class="ttdeci">std::shared_ptr&lt; ComponentBase &gt; Component</div><div class="ttdef"><b>Definition</b> <a href="component__base_8hpp_source.html#l00023">component_base.hpp:23</a></div></div>
<div class="ttc" id="ascreen__interactive_8hpp_html"><div class="ttname"><a href="screen__interactive_8hpp.html">screen_interactive.hpp</a></div></div>
<div class="ttc" id="aterminal_8hpp_html"><div class="ttname"><a href="terminal_8hpp.html">terminal.hpp</a></div></div>
</div><!-- fragment --></div><!-- contents -->
</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": "../zh-CH/index.html", "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-TW";
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>
Reference in New Issue View Git Blame Copy Permalink