Files
FTXUI/zh-TW/examples_2component_2button_8cpp_source.html
2025-12-13 19:38:34 +00:00

402 lines
31 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: button.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('examples_2component_2button_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">examples/component/button.cpp</div></div>
</div><!--header-->
<div class="contents">
<a href="examples_2component_2button_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">// Copyright 2020 Arthur Sonzogni. All rights reserved.</span></div>
<div class="line"><a id="l00002" name="l00002"></a><span class="lineno"> 2</span><span class="comment">// Use of this source code is governed by the MIT license that can be found in</span></div>
<div class="line"><a id="l00003" name="l00003"></a><span class="lineno"> 3</span><span class="comment">// the LICENSE file.</span></div>
<div class="line"><a id="l00004" name="l00004"></a><span class="lineno"> 4</span><span class="preprocessor">#include &lt;memory&gt;</span> <span class="comment">// for shared_ptr, __shared_ptr_access</span></div>
<div class="line"><a id="l00005" name="l00005"></a><span class="lineno"> 5</span><span class="preprocessor">#include &lt;string&gt;</span> <span class="comment">// for operator+, to_string</span></div>
<div class="line"><a id="l00006" name="l00006"></a><span class="lineno"> 6</span> </div>
<div class="line"><a id="l00007" name="l00007"></a><span class="lineno"> 7</span><span class="preprocessor">#include &quot;<a class="code" href="captured__mouse_8hpp.html">ftxui/component/captured_mouse.hpp</a>&quot;</span> <span class="comment">// for ftxui</span></div>
<div class="line"><a id="l00008" name="l00008"></a><span class="lineno"> 8</span><span class="preprocessor">#include &quot;<a class="code" href="component_8hpp.html">ftxui/component/component.hpp</a>&quot;</span> <span class="comment">// for Button, Horizontal, Renderer</span></div>
<div class="line"><a id="l00009" name="l00009"></a><span class="lineno"> 9</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</span></div>
<div class="line"><a id="l00010" name="l00010"></a><span class="lineno"> 10</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 ScreenInteractive</span></div>
<div class="line"><a id="l00011" name="l00011"></a><span class="lineno"> 11</span><span class="preprocessor">#include &quot;<a class="code" href="elements_8hpp.html">ftxui/dom/elements.hpp</a>&quot;</span> <span class="comment">// for separator, gauge, text, Element, operator|, vbox, border</span></div>
<div class="line"><a id="l00012" name="l00012"></a><span class="lineno"> 12</span> </div>
<div class="line"><a id="l00013" name="l00013"></a><span class="lineno"> 13</span><span class="keyword">using namespace </span><a class="code hl_namespace" href="namespaceftxui.html">ftxui</a>;</div>
<div class="line"><a id="l00014" name="l00014"></a><span class="lineno"> 14</span> </div>
<div class="line"><a id="l00015" name="l00015"></a><span class="lineno"> 15</span><span class="comment">// 這是一個輔助函數,用於創建具有自定義樣式的按鈕。</span></div>
<div class="line"><a id="l00016" name="l00016"></a><span class="lineno"> 16</span><span class="comment">// 樣式由一個接受 EntryState 並返回 Element 的 lambda 函數定義。</span></div>
<div class="line"><a id="l00017" name="l00017"></a><span class="lineno"> 17</span><span class="comment">// 我們使用 `center` 將文本居中,然後使用 `border` 在按鈕周圍添加邊框,最後使用 `flex` 使按鈕填充可用空間。</span></div>
<div class="foldopen" id="foldopen00018" data-start="{" data-end="}">
<div class="line"><a id="l00018" name="l00018"></a><span class="lineno"><a class="line" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08"> 18</a></span><a class="code hl_struct" href="group__component.html#structftxui_1_1ButtonOption">ButtonOption</a> <a class="code hl_function" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a>() {</div>
<div class="line"><a id="l00019" name="l00019"></a><span class="lineno"> 19</span> <span class="keyword">auto</span> option = <a class="code hl_function" href="group__component.html#a008018822835ed0f3758af3c6e72837d">ButtonOption::Animated</a>();</div>
<div class="line"><a id="l00020" name="l00020"></a><span class="lineno"> 20</span> option.transform = [](<span class="keyword">const</span> <a class="code hl_struct" href="structftxui_1_1EntryState.html">EntryState</a>&amp; s) {</div>
<div class="line"><a id="l00021" name="l00021"></a><span class="lineno"> 21</span> <span class="keyword">auto</span> element = <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(s.label);</div>
<div class="line"><a id="l00022" name="l00022"></a><span class="lineno"> 22</span> <span class="keywordflow">if</span> (s.focused) {</div>
<div class="line"><a id="l00023" name="l00023"></a><span class="lineno"> 23</span> element |= <a class="code hl_function" href="group__dom.html#ga353c769068e25303eb41fa2da565c604">bold</a>;</div>
<div class="line"><a id="l00024" name="l00024"></a><span class="lineno"> 24</span> }</div>
<div class="line"><a id="l00025" name="l00025"></a><span class="lineno"> 25</span> <span class="keywordflow">return</span> element | center | borderEmpty | <a class="code hl_function" href="group__dom.html#ga257acd2bd47bab7db879cca2c0e67e23">flex</a>;</div>
<div class="line"><a id="l00026" name="l00026"></a><span class="lineno"> 26</span> };</div>
<div class="line"><a id="l00027" name="l00027"></a><span class="lineno"> 27</span> <span class="keywordflow">return</span> option;</div>
<div class="line"><a id="l00028" name="l00028"></a><span class="lineno"> 28</span>}</div>
</div>
<div class="line"><a id="l00029" name="l00029"></a><span class="lineno"> 29</span> </div>
<div class="foldopen" id="foldopen00030" data-start="{" data-end="}">
<div class="line"><a id="l00030" name="l00030"></a><span class="lineno"><a class="line" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4"> 30</a></span><span class="keywordtype">int</span> <a class="code hl_function" href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a>() {</div>
<div class="line"><a id="l00031" name="l00031"></a><span class="lineno"> 31</span> <span class="keywordtype">int</span> value = 50;</div>
<div class="line"><a id="l00032" name="l00032"></a><span class="lineno"> 32</span> </div>
<div class="line"><a id="l00033" name="l00033"></a><span class="lineno"> 33</span> <span class="comment">// clang-format off</span></div>
<div class="line"><a id="l00034" name="l00034"></a><span class="lineno"> 34</span> <span class="keyword">auto</span> btn_dec_01 = <a class="code hl_function" href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">Button</a>(<span class="stringliteral">&quot;-1&quot;</span>, [&amp;] { value -= 1; }, <a class="code hl_function" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a>());</div>
<div class="line"><a id="l00035" name="l00035"></a><span class="lineno"> 35</span> <span class="keyword">auto</span> btn_inc_01 = <a class="code hl_function" href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">Button</a>(<span class="stringliteral">&quot;+1&quot;</span>, [&amp;] { value += 1; }, <a class="code hl_function" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a>());</div>
<div class="line"><a id="l00036" name="l00036"></a><span class="lineno"> 36</span> <span class="keyword">auto</span> btn_dec_10 = <a class="code hl_function" href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">Button</a>(<span class="stringliteral">&quot;-10&quot;</span>, [&amp;] { value -= 10; }, <a class="code hl_function" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a>());</div>
<div class="line"><a id="l00037" name="l00037"></a><span class="lineno"> 37</span> <span class="keyword">auto</span> btn_inc_10 = <a class="code hl_function" href="group__component.html#ga4e8295ec77dd31b0acc5063b134473e7">Button</a>(<span class="stringliteral">&quot;+10&quot;</span>, [&amp;] { value += 10; }, <a class="code hl_function" href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a>());</div>
<div class="line"><a id="l00038" name="l00038"></a><span class="lineno"> 38</span> <span class="comment">// clang-format on</span></div>
<div class="line"><a id="l00039" name="l00039"></a><span class="lineno"> 39</span> </div>
<div class="line"><a id="l00040" name="l00040"></a><span class="lineno"> 40</span> <span class="comment">// 元件樹。這定義了如何使用鍵盤導航。</span></div>
<div class="line"><a id="l00041" name="l00041"></a><span class="lineno"> 41</span> <span class="comment">// 選定的 `row` 用於獲取網格佈局。</span></div>
<div class="line"><a id="l00042" name="l00042"></a><span class="lineno"> 42</span> <span class="keywordtype">int</span> row = 0;</div>
<div class="line"><a id="l00043" name="l00043"></a><span class="lineno"> 43</span> <span class="keyword">auto</span> buttons = Container::Vertical({</div>
<div class="line"><a id="l00044" name="l00044"></a><span class="lineno"> 44</span> Container::Horizontal({btn_dec_01, btn_inc_01}, &amp;row) | flex,</div>
<div class="line"><a id="l00045" name="l00045"></a><span class="lineno"> 45</span> Container::Horizontal({btn_dec_10, btn_inc_10}, &amp;row) | flex,</div>
<div class="line"><a id="l00046" name="l00046"></a><span class="lineno"> 46</span> });</div>
<div class="line"><a id="l00047" name="l00047"></a><span class="lineno"> 47</span> </div>
<div class="line"><a id="l00048" name="l00048"></a><span class="lineno"> 48</span> <span class="comment">// 修改它們在螢幕上的渲染方式:</span></div>
<div class="line"><a id="l00049" name="l00049"></a><span class="lineno"> 49</span> <span class="keyword">auto</span> <a class="code hl_variable" href="gallery_8cpp.html#a768a57bc667a7482ea6e7fdadf02ba90">component</a> = <a class="code hl_function" href="group__component.html#ga533e883e2aeea28de2b60564fcaf0361">Renderer</a>(buttons, [&amp;] {</div>
<div class="line"><a id="l00050" name="l00050"></a><span class="lineno"> 50</span> <span class="keywordflow">return</span> <a class="code hl_function" href="group__dom.html#gafd28058f0ccbbdf34691a85a7cc9b2e3">vbox</a>({</div>
<div class="line"><a id="l00051" name="l00051"></a><span class="lineno"> 51</span> <a class="code hl_function" href="group__dom.html#ga75baaa2734ed76a9f478beaafa87ae57">text</a>(<span class="stringliteral">&quot;value = &quot;</span> + std::to_string(value)),</div>
<div class="line"><a id="l00052" name="l00052"></a><span class="lineno"> 52</span> <a class="code hl_function" href="group__dom.html#gac1ef1cf6bf7cd0759ffa195071edb2a0">separator</a>(),</div>
<div class="line"><a id="l00053" name="l00053"></a><span class="lineno"> 53</span> buttons-&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="l00054" name="l00054"></a><span class="lineno"> 54</span> }) |</div>
<div class="line"><a id="l00055" name="l00055"></a><span class="lineno"> 55</span> flex | border;</div>
<div class="line"><a id="l00056" name="l00056"></a><span class="lineno"> 56</span> });</div>
<div class="line"><a id="l00057" name="l00057"></a><span class="lineno"> 57</span> </div>
<div class="line"><a id="l00058" name="l00058"></a><span class="lineno"> 58</span> <span class="keyword">auto</span> screen = <a class="code hl_function" href="group__component.html#a4f458e443ed672c2aea9fdd96531a621">ScreenInteractive::FitComponent</a>();</div>
<div class="line"><a id="l00059" name="l00059"></a><span class="lineno"> 59</span> screen.Loop(<a class="code hl_variable" href="gallery_8cpp.html#a768a57bc667a7482ea6e7fdadf02ba90">component</a>);</div>
<div class="line"><a id="l00060" name="l00060"></a><span class="lineno"> 60</span> <span class="keywordflow">return</span> 0;</div>
<div class="line"><a id="l00061" name="l00061"></a><span class="lineno"> 61</span>}</div>
</div>
<div class="ttc" id="acaptured__mouse_8hpp_html"><div class="ttname"><a href="captured__mouse_8hpp.html">captured_mouse.hpp</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="aelements_8hpp_html"><div class="ttname"><a href="elements_8hpp.html">elements.hpp</a></div></div>
<div class="ttc" id="aexamples_2component_2button_8cpp_html_a98e3b8d17caf902b7bf0fe47562cea08"><div class="ttname"><a href="examples_2component_2button_8cpp.html#a98e3b8d17caf902b7bf0fe47562cea08">Style</a></div><div class="ttdeci">ButtonOption Style()</div><div class="ttdef"><b>Definition</b> <a href="#l00018">examples/component/button.cpp:18</a></div></div>
<div class="ttc" id="aexamples_2component_2button_8cpp_html_ae66f6b31b5ad750f1fe042a706a4e3d4"><div class="ttname"><a href="examples_2component_2button_8cpp.html#ae66f6b31b5ad750f1fe042a706a4e3d4">main</a></div><div class="ttdeci">int main()</div><div class="ttdef"><b>Definition</b> <a href="#l00030">examples/component/button.cpp:30</a></div></div>
<div class="ttc" id="agallery_8cpp_html_a768a57bc667a7482ea6e7fdadf02ba90"><div class="ttname"><a href="gallery_8cpp.html#a768a57bc667a7482ea6e7fdadf02ba90">component</a></div><div class="ttdeci">auto component</div><div class="ttdef"><b>Definition</b> <a href="gallery_8cpp_source.html#l00127">gallery.cpp:127</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_a4f458e443ed672c2aea9fdd96531a621"><div class="ttname"><a href="group__component.html#a4f458e443ed672c2aea9fdd96531a621">ftxui::ScreenInteractive::FitComponent</a></div><div class="ttdeci">static ScreenInteractive FitComponent()</div><div class="ttdef"><b>Definition</b> <a href="screen__interactive_8cpp_source.html#l00346">screen_interactive.cpp:346</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_structftxui_1_1ButtonOption"><div class="ttname"><a href="group__component.html#structftxui_1_1ButtonOption">ftxui::ButtonOption</a></div><div class="ttdoc">AnimatedButton 元件的選項。</div><div class="ttdef"><b>Definition</b> <a href="component__options_8hpp_source.html#l00115">component_options.hpp:115</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_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_ga353c769068e25303eb41fa2da565c604"><div class="ttname"><a href="group__dom.html#ga353c769068e25303eb41fa2da565c604">ftxui::bold</a></div><div class="ttdeci">Element bold(Element)</div><div class="ttdoc">使用粗體字型,用於需要更多強調的元素。</div><div class="ttdef"><b>Definition</b> <a href="bold_8cpp_source.html#l00033">bold.cpp:33</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_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_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="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="ascreen__interactive_8hpp_html"><div class="ttname"><a href="screen__interactive_8hpp.html">screen_interactive.hpp</a></div></div>
<div class="ttc" id="astructftxui_1_1EntryState_html"><div class="ttname"><a href="structftxui_1_1EntryState.html">ftxui::EntryState</a></div><div class="ttdoc">來自 |ButtonOption|、|CheckboxOption|、 |RadioboxOption|、|MenuEntryOption|、|MenuOption| 的轉換參數。</div><div class="ttdef"><b>Definition</b> <a href="component__options_8hpp_source.html#l00024">component_options.hpp:24</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>