examples/component/button.cpp

Go to the documentation of this file.

// Copyright 2020 Arthur Sonzogni. All rights reserved.
// Use of this source code is governed by the MIT license that can be found in
// the LICENSE file.
#include <memory>  // for shared_ptr, __shared_ptr_access
#include <string>  // for operator+, to_string
 
#include "ftxui/component/app.hpp"             // for App
#include "ftxui/component/captured_mouse.hpp"  // for ftxui
#include "ftxui/component/component.hpp"  // for Button, Horizontal, Renderer
#include "ftxui/component/component_base.hpp"  // for ComponentBase
#include "ftxui/dom/elements.hpp"  // for separator, gauge, text, Element, operator|, vbox, border
 
using namespace ftxui;
 
// これは、カスタムスタイルでボタンを作成するためのヘルパー関数です。
// スタイルは、EntryState を受け取り、
// Element を返すラムダ関数によって定義されます。
// ボタン内のテキストを中央に配置するために `center` を使用し、次に `border` を使用して
// ボタンの周りに境界線を追加し、最後に `flex` を使用してボタンが
// 利用可能なスペースを埋めるようにします。
ButtonOption Style() {
  auto option = ButtonOption::Animated();
  option.transform = [](const EntryState& s) {
    auto element = text(s.label);
    if (s.focused) {
      element |= bold;
    }
    return element | center | borderEmpty | flex;
  };
  return option;
}
 
int main() {
  int value = 50;
 
  // clang-format off
  auto btn_dec_01 = Button("-1", [&] { value -= 1; }, Style());
  auto btn_inc_01 = Button("+1", [&] { value += 1; }, Style());
  auto btn_dec_10 = Button("-10", [&] { value -= 10; }, Style());
  auto btn_inc_10 = Button("+10", [&] { value += 10; }, Style());
  // clang-format on
 
  // コンポーネントのツリー。これは、キーボードを使用してナビゲートする方法を定義します。
// 選択された `row` は、グリッドレイアウトを取得するために共有されます。
  int row = 0;
  auto buttons = Container::Vertical({
      Container::Horizontal({btn_dec_01, btn_inc_01}, &row) | flex,
      Container::Horizontal({btn_dec_10, btn_inc_10}, &row) | flex,
  });
 
  // スクリーン上でのレンダリング方法を変更する:
  auto component = Renderer(buttons, [&] {
    return vbox({
               text("value = " + std::to_string(value)),
               separator(),
               buttons->Render() | flex,
           }) |
           flex | border;
  });
 
  auto screen = App::FitComponent();
  screen.Loop(component);
  return 0;
}