mirror of
https://github.com/ArthurSonzogni/FTXUI.git
synced 2024-10-30 07:57:40 +08:00
Add example to use system ftxui
Fixed: https://github.com/ArthurSonzogni/FTXUI/issues/814
This commit is contained in:
ArthurSonzogni
parent
810657dab8
commit
f495ce029c
@ -50,42 +50,17 @@ int main(void) {
|
||||
└────┘└────────────────────────────────────┘└─────┘
|
||||
```
|
||||
|
||||
# Build {#build}
|
||||
## Configure {#configure}
|
||||
### Using CMake and find_package {#build-cmake-find-package}
|
||||
|
||||
## Using CMake {#build-cmake}
|
||||
Assuming FTXUI is available or installed on the system.
|
||||
|
||||
This is an example configuration for your **CMakeLists.txt**
|
||||
|
||||
CMakeLists.txt
|
||||
**CMakeLists.txt**
|
||||
```cmake
|
||||
cmake_minimum_required (VERSION 3.11)
|
||||
|
||||
# --- Fetch FTXUI --------------------------------------------------------------
|
||||
include(FetchContent)
|
||||
|
||||
set(FETCHCONTENT_UPDATES_DISCONNECTED TRUE)
|
||||
FetchContent_Declare(ftxui
|
||||
GIT_REPOSITORY https://github.com/ArthurSonzogni/ftxui
|
||||
# Important: Specify a GIT_TAG XXXXX here.
|
||||
GIT_TAG main
|
||||
)
|
||||
|
||||
FetchContent_GetProperties(ftxui)
|
||||
if(NOT ftxui_POPULATED)
|
||||
FetchContent_Populate(ftxui)
|
||||
add_subdirectory(${ftxui_SOURCE_DIR} ${ftxui_BINARY_DIR} EXCLUDE_FROM_ALL)
|
||||
endif()
|
||||
|
||||
# ------------------------------------------------------------------------------
|
||||
|
||||
project(ftxui-starter
|
||||
LANGUAGES CXX
|
||||
VERSION 1.0.0
|
||||
)
|
||||
|
||||
find_package(ftxui 5 REQUIRED)
|
||||
project(ftxui-starter LANGUAGES CXX VERSION 1.0.0)
|
||||
add_executable(ftxui-starter src/main.cpp)
|
||||
target_include_directories(ftxui-starter PRIVATE src)
|
||||
|
||||
target_link_libraries(ftxui-starter
|
||||
PRIVATE ftxui::screen
|
||||
PRIVATE ftxui::dom
|
||||
@ -94,7 +69,33 @@ target_link_libraries(ftxui-starter
|
||||
|
||||
```
|
||||
|
||||
Subsequently, you build the project in the standard fashion as follows:
|
||||
### Using CMake and FetchContent {#build-cmake}
|
||||
|
||||
If you want to fetch FTXUI using cmake:
|
||||
|
||||
**CMakeLists.txt**
|
||||
```cmake
|
||||
cmake_minimum_required (VERSION 3.11)
|
||||
|
||||
include(FetchContent)
|
||||
set(FETCHCONTENT_UPDATES_DISCONNECTED TRUE)
|
||||
FetchContent_Declare(ftxui
|
||||
GIT_REPOSITORY https://github.com/ArthurSonzogni/ftxui
|
||||
GIT_TAG main # Important: Specify a version or a commit hash here.
|
||||
)
|
||||
FetchContent_MakeAvailable(ftxui)
|
||||
|
||||
project(ftxui-starter LANGUAGES CXX VERSION 1.0.0)
|
||||
add_executable(ftxui-starter src/main.cpp)
|
||||
target_link_libraries(ftxui-starter
|
||||
PRIVATE ftxui::screen
|
||||
PRIVATE ftxui::dom
|
||||
PRIVATE ftxui::component # Not needed for this example.
|
||||
)
|
||||
```
|
||||
|
||||
## Build
|
||||
|
||||
```bash
|
||||
mkdir build && cd build
|
||||
cmake ..
|
||||
|
||||
@ -1,65 +1,92 @@
|
||||
// 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/component.hpp>
|
||||
#include <ftxui/component/screen_interactive.hpp>
|
||||
#include <ftxui/dom/elements.hpp>
|
||||
#include <ftxui/screen/screen.hpp>
|
||||
|
||||
#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/component/screen_interactive.hpp" // for ScreenInteractive
|
||||
#include "ftxui/dom/elements.hpp" // for separator, gauge, text, Element, operator|, vbox, border
|
||||
#include <array>
|
||||
#include <iostream>
|
||||
#include <string>
|
||||
|
||||
using namespace ftxui;
|
||||
using namespace std;
|
||||
|
||||
// This is a helper function to create a button with a custom style.
|
||||
// The style is defined by a lambda function that takes an EntryState and
|
||||
// returns an Element.
|
||||
// We are using `center` to center the text inside the button, then `border` to
|
||||
// add a border around the button, and finally `flex` to make the button fill
|
||||
// the available space.
|
||||
ButtonOption ButtonStyle() {
|
||||
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;
|
||||
}
|
||||
enum class ConnectionMethod { ByName, ByAddress };
|
||||
|
||||
void promptForConnectionMethod();
|
||||
|
||||
void promptForServerName();
|
||||
void promptForServerAddress();
|
||||
void promptForServerManager();
|
||||
|
||||
int main() {
|
||||
int value = 50;
|
||||
promptForConnectionMethod();
|
||||
|
||||
// The tree of components. This defines how to navigate using the keyboard.
|
||||
auto buttons = Container::Vertical({
|
||||
Container::Horizontal({
|
||||
Button(
|
||||
"-1", [&] { value--; }, ButtonStyle()),
|
||||
Button(
|
||||
"+1", [&] { value++; }, ButtonStyle()),
|
||||
}) | flex,
|
||||
Container::Horizontal({
|
||||
Button(
|
||||
"-10", [&] { value -= 10; }, ButtonStyle()),
|
||||
Button(
|
||||
"+10", [&] { value += 10; }, ButtonStyle()),
|
||||
}) | flex,
|
||||
});
|
||||
|
||||
// Modify the way to render them on screen:
|
||||
auto component = Renderer(buttons, [&] {
|
||||
return vbox({
|
||||
text("value = " + std::to_string(value)),
|
||||
separator(),
|
||||
buttons->Render() | flex,
|
||||
}) |
|
||||
flex | border;
|
||||
});
|
||||
|
||||
auto screen = ScreenInteractive::Fullscreen();
|
||||
screen.Loop(component);
|
||||
return 0;
|
||||
}
|
||||
|
||||
void promptForConnectionMethod() {
|
||||
auto screen = ScreenInteractive::TerminalOutput();
|
||||
std::vector<std::string> connect_choice{
|
||||
"Connect by name...",
|
||||
"Connect by address and port...",
|
||||
"Exit",
|
||||
};
|
||||
int selected = 0;
|
||||
MenuOption option;
|
||||
option.on_enter = [&] {
|
||||
if (selected == 0) {
|
||||
promptForServerManager();
|
||||
} else if (selected == 1) {
|
||||
promptForServerAddress();
|
||||
} else if (selected == 2) {
|
||||
screen.Exit();
|
||||
}
|
||||
};
|
||||
|
||||
auto connect_menu = Menu(&connect_choice, &selected, option);
|
||||
|
||||
auto renderer = Renderer(connect_menu, [&] {
|
||||
return vbox({
|
||||
text("Welcome, my client!") | color(Color::Red3Bis) | bold |
|
||||
center,
|
||||
text(""),
|
||||
text("Selected = " + std::to_string(selected)) |
|
||||
color(Color::LightGreenBis) | bold | center,
|
||||
|
||||
text(""),
|
||||
text("Welcome to my first working multiplayer game, Medium "
|
||||
"Boxes.") |
|
||||
color(Color::LightSkyBlue1),
|
||||
text(""),
|
||||
text("Now, choose how you'd prefer to connect to a server!") |
|
||||
color(Color::LightCyan3) | center,
|
||||
text(""),
|
||||
connect_menu->Render() | border,
|
||||
}) |
|
||||
center;
|
||||
});
|
||||
|
||||
screen.Loop(renderer);
|
||||
}
|
||||
|
||||
void promptForServerName() {}
|
||||
|
||||
void promptForServerAddress() {
|
||||
auto screen = ScreenInteractive::TerminalOutput();
|
||||
}
|
||||
|
||||
void promptForServerManager() {
|
||||
auto screen = ScreenInteractive::TerminalOutput();
|
||||
auto renderer = Renderer([&] {
|
||||
return vbox({
|
||||
text("Now, please enter the server manager's address and "
|
||||
"port, so that you'll be able to see all the available "
|
||||
"public servers!") |
|
||||
color(Color::LightGreenBis),
|
||||
gauge(0),
|
||||
}) |
|
||||
center;
|
||||
});
|
||||
|
||||
screen.Loop(renderer);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user