- Notifications
You must be signed in to change notification settings - Fork464
💻 C++ Functional Terminal User Interface. ❤️
License
ArthurSonzogni/FTXUI
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
Documentation ·Report a Bug ·Examples .Request Feature ·Send a Pull Request
Functional Terminal (X) User interface
A simple cross-platform C++ library for terminal based user interfaces!
- Functional style. Inspired by1andReact
- Simple and elegant syntax (in my opinion)
- Keyboard & mouse navigation.
- Support forUTF8 andfullwidth chars (→ 测试)
- Support for animations.Demo 1,Demo 2
- Support for drawing.Demo
- No dependencies
- Cross platform: Linux/MacOS (main target), WebAssembly, Windows (Thanks to contributors!).
- Learn byexamples, andtutorials
- Multiple packages: CMake FetchContent (preferred), vcpkg, pkgbuild, conan.
- Good practices: documentation, tests, fuzzers, performance tests, automated CI, automated packaging, etc...
vbox({hbox({text("one") | border,text("two") | border | flex,text("three") | border | flex, }),gauge(0.25) |color(Color::Red),gauge(0.50) |color(Color::White),gauge(0.75) |color(Color::Blue), });
This module defines a hierarchical set of Element. An Element manages layout and can be responsive to the terminal dimensions.
They are declared in<ftxui/dom/elements.hpp>
Layout
Element can be arranged together:
- horizontally with
hbox
- vertically with
vbox
- inside a grid with
gridbox
- wrap along one direction using the
flexbox
.
Element can become flexible using the theflex
decorator.
Example usinghbox
,vbox
andfiller
.
Example using gridbox:
Example using flexbox:
Style
An element can be decorated using the functions:
bold
italic
dim
inverted
underlined
underlinedDouble
blink
strikethrough
color
bgcolor
hyperlink
FTXUI supports the pipe operator. It means:decorator1(decorator2(element))
andelement | decorator1 | decorator2
can be used.
Border and separator
Use decorator border and element separator() to subdivide your UI:
auto document = vbox({text("top"),separator(),text("bottom"),}) | border;
Demo:
Text and paragraph
A simple piece of text is represented usingtext("content")
.
To support text wrapping following spaces the following functions are provided:
Elementparagraph(std::string text);ElementparagraphAlignLeft(std::string text);ElementparagraphAlignRight(std::string text);ElementparagraphAlignCenter(std::string text);ElementparagraphAlignJustify(std::string text);
Canvas
Drawing can be made on a Canvas, using braille, block, or simple characters:
Simpleexample:
Complexexamples:
ftxui/component produces dynamic UI, reactive to the user's input. It defines a set of ftxui::Component. A component reacts to Events (keyboard, mouse, resize, ...) and Renders as an Element (see previous section).
Prebuilt components are declared in<ftxui/component/component.hpp>
- Want to share a useful Component for FTXUI? Feel free to add yours here
- ftxui-grid-container
- ftxui-ip-input
- ftxui-image-view: For Image Display.
Feel free to add your projects here:
- json-tui
- git-tui
- ostree-tui
- rgb-tui
- chrome-log-beautifier
- x86-64 CPU Architecture Simulation
- ltuiny
- i3-termdialogs
- simpPRU
- Pigeon ROS TUI
- hastur
- CryptoCalculator
- todoman
- TimeAccumulator
- vantage
- tabdeeli
- tiles
- cachyos-cli-installer
- beagle-config
- turing_cmd
- StartUp
- eCAL monitor
- Path Finder
- rw-tui
- resource-monitor
- ftxuiFileReader
- ftxui_CPUMeter
- Captain's log
- FTowerX
- Caravan
- Step-Writer
- XJ music
- UDP chat
- 2048-cpp
- Memory game
- Terminal Animation
- pciex
- Fallout terminal hacking
- Lazylist
- TUISIC
- inLimbo
- BestEdrOfTheMarket
- terminal-rain
- keywords (Play web version ❤️)
- FTB - tertminal file browser
Several games using the FTXUI have been made during the Game Jam:
- TermBreaker[Play web version]
- Minesweeper Marathon[Play web version]
- Grand Rounds
- LightsRound
- DanteO
- Sumo
- Drag Me aROUND
- DisarmSelfDestruct
- TheWorld
- smoothlife
- Consu
It ishighly recommended to use CMake FetchContent to depend on FTXUI so you may specify which commit you would like to depend on.
include(FetchContent)FetchContent_Declare(ftxui GIT_REPOSITORY https://github.com/ArthurSonzogni/ftxui GIT_TAG v5.0.0)FetchContent_GetProperties(ftxui)if(NOT ftxui_POPULATED) FetchContent_Populate(ftxui) add_subdirectory(${ftxui_SOURCE_DIR}${ftxui_BINARY_DIR}EXCLUDE_FROM_ALL)endif()
If you don't, FTXUI may be used from the following packages:
If you choose to build and link FTXUI yourself,ftxui-component
must be first in the linking order relative to the other FTXUI libraries, i.e.
g++... -lftxui-component -lftxui-dom -lftxui-screen...
About
💻 C++ Functional Terminal User Interface. ❤️