charmbracelet/bubbles

# Bubbles [](https://github.com/charmbracelet/bubbles/releases) [](https://pkg.go.dev/github.com/charmbracelet/bubbles) [](https://github.com/charmbracelet/bubbles/actions) [](https://goreportcard.com/report/charmbracelet/bubbles) [Bubble Tea](https://github.com/charmbracelet/bubbletea) 应用程序的基元。这些组件已在 [Crush][crush] 和 [许多其他应用][otherstuff] 的生产环境中使用。 ## Spinner 一个旋转器，用于指示正在进行某种操作。 有几个默认的样式，但你也可以传递自定义的“帧”。 - [示例代码，基础 spinner](https://github.com/charmbracelet/bubbletea/blob/main/examples/spinner/main.go) - [示例代码，各种 spinner](https://github.com/charmbracelet/bubbletea/blob/main/examples/spinners/main.go) ## Text Input 一个文本输入字段，类似于 HTML 中的 ``。支持 Unicode、粘贴、当值超过元素宽度时的原地滚动，以及常见的和许多自定义选项。 - [示例代码，单字段](https://github.com/charmbracelet/bubbletea/blob/main/examples/textinput/main.go) - [示例代码，多字段](https://github.com/charmbracelet/bubbletea/blob/main/examples/textinputs/main.go) ## Text Area 一个文本区域字段，类似于 HTML 中的 ``。允许跨多行的输入。支持 Unicode、粘贴、当值超过元素的宽度和高度时的垂直滚动，以及许多自定义选项。 - [示例代码，聊天输入](https://github.com/charmbracelet/bubbletea/blob/main/examples/chat/main.go) - [示例代码，故事时间输入](https://github.com/charmbracelet/bubbletea/blob/main/examples/textarea/main.go) ## Table <img src="https://stuff.charm.sh/bubbles-examples/table.gif" width="400" alt="Table Example"> 一个用于显示和导航表格数据（列和行）的组件。支持垂直滚动和许多自定义选项。 - [示例代码，国家与人口](https://github.com/charmbracelet/bubbletea/blob/main/examples/table/main.go) ## Progress <img src="https://stuff.charm.sh/bubbles-examples/progress.gif" width="800" alt="Progressbar Example"> 一个简单、可自定义的进度条，可通过 [Harmonica][harmonica] 实现可选动画。支持实心和渐变填充。空白和填充的字符可以设置为你喜欢的任何样式。百分比读数是可自定义的，也可以完全省略。 - [动画示例](https://github.com/charmbracelet/bubbletea/blob/main/examples/progress-animated/main.go) - [静态示例](https://github.com/charmbracelet/bubbletea/blob/main/examples/progress-static/main.go) ## Paginator <img src="https://stuff.charm.sh/bubbles-examples/pagination.gif" width="200" alt="Paginator Example"> 一个用于处理分页逻辑并可选地绘制分页 UI 的组件。支持“圆点样式”分页（类似于你在 iOS 上看到的）和数字页码，但你也可以仅使用此组件的逻辑部分，并按你喜欢的方式可视化分页。 - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/paginator/main.go) ## Viewport <img src="https://stuff.charm.sh/bubbles-examples/viewport.gif" width="600" alt="Viewport Example"> 一个用于垂直滚动内容的视口。可选地包含标准 pager 键绑定和鼠标滚轮支持。对于使用交替屏幕缓冲区的应用程序，还提供高性能模式。 - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/pager/main.go) 此组件与 [Reflow][reflow] 配合使用效果极佳，可用于 ANSI 感知的缩进和文本换行。 ## List <img src="https://stuff.charm.sh/bubbles-examples/list.gif" width="600" alt="List Example"> 一个可自定义的、开箱即用的组件，用于浏览一组项目。具有分页、模糊过滤、自动生成的帮助、活动 spinner 和状态消息等功能，所有这些都可以根据需要启用或禁用。提取自 [Glow][glow]。 - [示例代码，默认列表](https://github.com/charmbracelet/bubbletea/blob/main/examples/list-default/main.go) - [示例代码，简单列表](https://github.com/charmbracelet/bubbletea/blob/main/examples/list-simple/main.go) - [示例代码，全功能](https://github.com/charmbracelet/bubbletea/blob/main/examples/list-fancy/main.go) ## File Picker <img src="https://vhs.charm.sh/vhs-yET2HNiJNEbyqaVfYuLnY.gif" width="600" alt="File picker example"> 一个可自定义的组件，用于从文件系统中选取文件。可浏览目录并选择文件，可选地限制为特定的文件扩展名。 - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/file-picker/main.go) ## Timer 一个简单、灵活的倒计时组件。更新频率和输出可以按你的喜好进行自定义。 <img src="https://stuff.charm.sh/bubbles-examples/timer.gif" width="400" alt="Timer example"> - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/timer/main.go) ## Stopwatch <img src="https://stuff.charm.sh/bubbles-examples/stopwatch.gif" width="400" alt="Stopwatch example"> 一个简单、灵活的计时（正计时）组件。更新频率和输出可以按你认为合适的方式进行自定义。 - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/stopwatch/main.go) ## Help <img src="https://stuff.charm.sh/bubbles-examples/help.gif" width="500" alt="Help Example"> 一个可自定义的水平迷你帮助视图，可根据你的键绑定自动生成。它具有单行和多行模式，用户可以选择在两者之间切换。如果终端对于内容来说太宽，它会优雅地截断。 - [示例代码](https://github.com/charmbracelet/bubbletea/blob/main/examples/help/main.go) ## Key 一个用于管理键绑定的非可视化组件。它对于允许用户重新映射键绑定以及生成与你的键绑定对应的帮助视图非常有用。 ``` type KeyMap struct { Up key.Binding Down key.Binding } var DefaultKeyMap = KeyMap{ Up: key.NewBinding( key.WithKeys("k", "up"), // actual keybindings key.WithHelp("↑/k", "move up"), // corresponding help text ), Down: key.NewBinding( key.WithKeys("j", "down"), key.WithHelp("↓/j", "move down"), ), } func (m Model) Update(msg tea.Msg) (tea.Model, tea.Cmd) { switch msg := msg.(type) { case tea.KeyPressMsg: switch { case key.Matches(msg, DefaultKeyMap.Up): // The user pressed up case key.Matches(msg, DefaultKeyMap.Down): // The user pressed down } } return m, nil } ``` ## 这里还有更多 要查看社区维护的 Bubbles，请参阅 [Charm & Friends][charmandfriends]。 做了一个很酷的 Bubble 想要分享？欢迎提交 [PR][prs]！ ## 反馈 我们很想听听你关于这个项目的想法。欢迎给我们留言！ - [Twitter](https://twitter.com/charmcli) - [The Fediverse](https://mastodon.social/@charmcli) - [Discord](https://charm.sh/chat) ## 许可证 [MIT](https://github.com/charmbracelet/bubbletea/raw/main/LICENSE) [Charm](https://charm.land) 的一部分。 <a href="https://charm.sh/"><img alt="The Charm logo" src="https://stuff.charm.sh/charm-banner-next.jpg" width="400"></a> Charm热爱开源 • Charm loves open source </div><div><strong>标签：</strong>BubbleTea, Charmbracelet, EVTX分析, Golang包, Go语言, Spinner, TextArea, TextInput, TUI组件, UI组件库, 交互式应用, 前端组件, 加载动画, 命令行界面, 威胁情报, 开发框架, 开发者工具, 开源库, 控制台应用, 搜索引擎爬虫, 文本输入框, 日志审计, 程序破解, 终端UI, 终端应用</div></article></div> <!-- 人机验证 --> <script> (function () { var base = (document.querySelector('base') && document.querySelector('base').getAttribute('href')) || ''; var path = base.replace(/\/?$/, '') + '/cap-wasm/cap_wasm.min.js'; window.CAP_CUSTOM_WASM_URL = new URL(path, window.location.href).href; })(); </script> </body> </html>