subhasundardass/retui
GitHub: subhasundardass/retui
RetUI 是一个基于 Go 的声明式终端 UI 框架，用组件、Hooks 和 Flexbox 布局让开发者像构建 Web 应用一样构建终端界面。
Stars: 12 | Forks: 1
# retui
像构建现代 Web 应用一样使用 Go 构建终端应用 —— 使用组件、hooks 和 flexbox 风格的布局系统，而无需手动向屏幕绘制字符。
## 这究竟是什么？
如果你用过 React（或类似的工具），retui 会让你感到熟悉：
- 你的 UI 由小型的**返回 `Element` 的函数**构建而成 —— 即组件。
- **Hooks**（`UseState`、`UseEffect`、`UseContext`）让组件在多次渲染之间记住状态。
- **flexbox 风格的布局系统**（`Box`、`Row`、`Column`）负责定位，因此你无需手动计算坐标。
- RetUI 会自动计算出哪些部分发生了变化，并且只重绘那些部分 —— 你的终端应用即使在不断扩展中也能保持快速。
无需任何终端 UI 开发经验。只要你能写 Go 函数，就能使用 retui 进行构建。
## 安装
```
go get github.com/subhasundardass/retui
```
要求 **Go 1.26+**。
## 快速开始
这是一个完整且可运行的应用 —— 一个通过 Enter 键控制的计数器：
```
package main
import (
"fmt"
"github.com/subhasundardass/retui/retui"
)
func App(props retui.Props) retui.Element {
count, setCount := retui.UseState(0)
if retui.CurrentKey.Code == retui.KeyEnter {
setCount(count + 1)
}
return retui.Box(
retui.Props{Direction: retui.Column, Gap: 1, Padding: [4]int{1, 2, 1, 2}},
retui.NewStyle(),
retui.Text("Press Enter to count, Ctrl-C to quit", retui.NewStyle()),
retui.Text(fmt.Sprintf("Count: %d", count), retui.NewStyle().Bold(true).Foreground(retui.Cyan)),
)
}
func main() {
app := retui.NewApp(0, 0)
app.Run(App, retui.Props{})
}
```
运行：
```
go run .
```
就这么简单。一个函数，一次对 `app.Run` 的调用，你就拥有了一个可运行的终端应用。
### 尝试示例应用
本代码库附带了一个演示，它展示了内置组件的各种用法 —— 这是在你开始构建自己的应用之前，了解其功能的好方法：
```
go run ./cmd/app
```
## 学习 retui —— Wiki
README 只是“hello world”。其他所有内容都在 Wiki 中，其编写方式适合新手按顺序阅读，也适合已经明确目标的用户直接跳转阅读：
| 页面 | 涵盖内容 |
| ---------------------------------------- | ------------------------------------------------------------------------------------------------ |
| **Core Concepts** | retui 背后的 8 个核心概念 —— 如果你是新手，请从这里开始 |
| **Layout System** | `Box`、`Row`/`Column`、尺寸、间距、内边距、对齐方式、排列方式 |
| **Hooks** | `UseState`、`UseStateKeyed`、`UseEffect`、`UseContext` 以及感知焦点的 key hooks |
| **Components** | 每个内置组件（`Button`、`TextInput`、`List`、`Tree` 等）以及如何构建你自己的组件 |
| **Styling** | 颜色、边框、文本属性，以及样式如何沿树状结构向下继承 |
| **Navigation & Focus** | 在不同屏幕之间导航，以及控制哪个组件获取键盘焦点 |
| **Window System** | 浮动、重叠的窗口 —— 对话框、弹出窗口和模态窗口 |
| **Advanced: Runtime, Renderer & Screen** | retui 内部的实际工作原理 —— 渲染循环、布局引擎和终端 diffing |
👉 新手？请先阅读 **Core Concepts**，然后是 **Layout System** 和 **Hooks** —— 仅这三个页面就足以构建大多数简单的应用。当你有需要时，再回来查看 **Components**、**Styling**、**Navigation & Focus** 和 **Window System**。
## 许可证
MIT —— 见 [LICENSE.md](LICENSE.md)。
## 这究竟是什么？
如果你用过 React（或类似的工具），retui 会让你感到熟悉：
- 你的 UI 由小型的**返回 `Element` 的函数**构建而成 —— 即组件。
- **Hooks**（`UseState`、`UseEffect`、`UseContext`）让组件在多次渲染之间记住状态。
- **flexbox 风格的布局系统**（`Box`、`Row`、`Column`）负责定位，因此你无需手动计算坐标。
- RetUI 会自动计算出哪些部分发生了变化，并且只重绘那些部分 —— 你的终端应用即使在不断扩展中也能保持快速。
无需任何终端 UI 开发经验。只要你能写 Go 函数，就能使用 retui 进行构建。
## 安装
```
go get github.com/subhasundardass/retui
```
要求 **Go 1.26+**。
## 快速开始
这是一个完整且可运行的应用 —— 一个通过 Enter 键控制的计数器：
```
package main
import (
"fmt"
"github.com/subhasundardass/retui/retui"
)
func App(props retui.Props) retui.Element {
count, setCount := retui.UseState(0)
if retui.CurrentKey.Code == retui.KeyEnter {
setCount(count + 1)
}
return retui.Box(
retui.Props{Direction: retui.Column, Gap: 1, Padding: [4]int{1, 2, 1, 2}},
retui.NewStyle(),
retui.Text("Press Enter to count, Ctrl-C to quit", retui.NewStyle()),
retui.Text(fmt.Sprintf("Count: %d", count), retui.NewStyle().Bold(true).Foreground(retui.Cyan)),
)
}
func main() {
app := retui.NewApp(0, 0)
app.Run(App, retui.Props{})
}
```
运行：
```
go run .
```
就这么简单。一个函数，一次对 `app.Run` 的调用，你就拥有了一个可运行的终端应用。
### 尝试示例应用
本代码库附带了一个演示，它展示了内置组件的各种用法 —— 这是在你开始构建自己的应用之前，了解其功能的好方法：
```
go run ./cmd/app
```
## 学习 retui —— Wiki
README 只是“hello world”。其他所有内容都在 Wiki 中，其编写方式适合新手按顺序阅读，也适合已经明确目标的用户直接跳转阅读：
| 页面 | 涵盖内容 |
| ---------------------------------------- | ------------------------------------------------------------------------------------------------ |
| **Core Concepts** | retui 背后的 8 个核心概念 —— 如果你是新手，请从这里开始 |
| **Layout System** | `Box`、`Row`/`Column`、尺寸、间距、内边距、对齐方式、排列方式 |
| **Hooks** | `UseState`、`UseStateKeyed`、`UseEffect`、`UseContext` 以及感知焦点的 key hooks |
| **Components** | 每个内置组件（`Button`、`TextInput`、`List`、`Tree` 等）以及如何构建你自己的组件 |
| **Styling** | 颜色、边框、文本属性，以及样式如何沿树状结构向下继承 |
| **Navigation & Focus** | 在不同屏幕之间导航，以及控制哪个组件获取键盘焦点 |
| **Window System** | 浮动、重叠的窗口 —— 对话框、弹出窗口和模态窗口 |
| **Advanced: Runtime, Renderer & Screen** | retui 内部的实际工作原理 —— 渲染循环、布局引擎和终端 diffing |
👉 新手？请先阅读 **Core Concepts**，然后是 **Layout System** 和 **Hooks** —— 仅这三个页面就足以构建大多数简单的应用。当你有需要时，再回来查看 **Components**、**Styling**、**Navigation & Focus** 和 **Window System**。
## 许可证
MIT —— 见 [LICENSE.md](LICENSE.md)。标签：EVTX分析, Go, Ruby工具, TUI, 前端组件, 开发框架, 日志审计, 终端UI