diff --git a/README.md b/README.md index 4eb7cdee55..49379eecb4 100644 --- a/README.md +++ b/README.md @@ -11,15 +11,37 @@ # Textual -clock +Build cross-platform user interfaces with a simple Python API. Textual combines modern Python features with web development best practices, delivering an efficient cross-platform application development experience. -Build cross-platform user interfaces with a simple Python API. Run your apps in the terminal *or* a web browser. - -Textual's API combines modern Python with the best of developments from the web world, for a lean app development experience. -De-coupled components and an advanced [testing](https://textual.textualize.io/guide/testing/) framework ensure you can maintain your app for the long-term. +## Key Features +- 🖥️ Dual Rendering Engine - Write once, deploy to both terminal and web browsers +- 🧩 50+ Built-in Widgets - Buttons, tables, tree views and more out-of-the-box +- 🎨 Theme System - Multiple built-in UI themes with custom styling support +- 🛠️ Developer Tools - Real-time terminal app debugging +- ⚡ Async Core - Native async/await support Want some more examples? See the [examples](https://github.com/Textualize/textual/tree/main/examples) directory. +## Installing + +### Prerequisites: +- Python 3.10+ +- Terminal requirements: TrueColor-supported terminal (e.g. Windows Terminal, iTerm2) + +Install Textual via pip: + +``` +pip install textual textual-dev +``` +For development tools: + +``` +pip install "textual[dev]" +``` + + +## Quick Start + ```python """ An App to show the current time. @@ -54,14 +76,13 @@ if __name__ == "__main__": app.run() ``` +![UI Screenshots](images/screenshot1.png) + > [!TIP] > Textual is an asynchronous framework under the hood. Which means you can integrate your apps with async libraries — if you want to. > If you don't want or need to use async, Textual won't force it on you. - - - ## Widgets Textual's library of [widgets](https://textual.textualize.io/widget_gallery/) covers everything from buttons, tree controls, data tables, inputs, text areas, and more… @@ -76,13 +97,13 @@ Predefined themes ensure your apps will look good out of the box. - ![buttons](https://github.com/user-attachments/assets/2ac26387-aaa3-41ed-bc00-7d488600343c) + ![buttons](images/screenshot2.gif) -![tree](https://github.com/user-attachments/assets/61ccd6e9-97ea-4918-8eda-3ee0f0d3770e) +![tree](images/screenshot3.gif) @@ -93,13 +114,13 @@ Predefined themes ensure your apps will look good out of the box. - ![datatables](https://github.com/user-attachments/assets/3e1f9f7a-f965-4901-a114-3c188bd17695) + ![datatables](images/screenshot4.gif) -![inputs](https://github.com/user-attachments/assets/b02aa203-7c37-42da-a1bb-2cb244b7d0d3) +![inputs](images/screenshot5.gif) @@ -108,13 +129,13 @@ Predefined themes ensure your apps will look good out of the box. -![listview](https://github.com/user-attachments/assets/963603bc-aa07-4688-bd24-379962ece871) +![listview](images/screenshot6.gif) -![textarea](https://github.com/user-attachments/assets/cd4ba787-5519-40e2-8d86-8224e1b7e506) +![textarea](images/screenshot7.gif) @@ -124,21 +145,6 @@ Predefined themes ensure your apps will look good out of the box. - - -## Installing - -Install Textual via pip: - -``` -pip install textual textual-dev -``` - -See [getting started](https://textual.textualize.io/getting_started/) for details. - - - - ## Demo @@ -154,8 +160,6 @@ Or try the [textual demo](https://github.com/textualize/textual-demo) *without* uvx --python 3.12 textual-demo ``` - - ## Dev Console devtools @@ -168,7 +172,6 @@ In addition to system messages and events, your logged messages and print statem See [the guide](https://textual.textualize.io/guide/devtools/) for other helpful tools provided by the `textual-dev` package. - ## Command Palette @@ -181,7 +184,6 @@ It is easy to extend the command palette with [custom commands](https://textual. ![Command Palette](https://github.com/user-attachments/assets/94d8ec5d-b668-4033-a5cb-bf820e1b8d60) - # Textual ❤️ Web @@ -203,9 +205,7 @@ Since Textual apps have low system requirements, you can install them anywhere P No desktop required! - - - ## Join us on Discord Join the Textual developers and community on our [Discord Server](https://discord.gg/Enf6Z3qhVr). + diff --git a/README.zh.md b/README.zh.md new file mode 100644 index 0000000000..1929f5f5c6 --- /dev/null +++ b/README.zh.md @@ -0,0 +1,207 @@ + + +[![Discord](https://img.shields.io/discord/1026214085173461072)](https://discord.gg/Enf6Z3qhVr) +[![支持的Python版本](https://img.shields.io/pypi/pyversions/textual/1.0.0)](https://pypi.org/project/textual/) +[![PyPI版本](https://badge.fury.io/py/textual.svg?)](https://badge.fury.io/py/textual) +![操作系统支持](https://img.shields.io/badge/OS-macOS%20Linux%20Windows-red) + +![textual-splash](https://github.com/user-attachments/assets/4caeb77e-48c0-4cf7-b14d-c53ded855ffd) + +# Textual + +使用简单的Python API构建终端和Web双平台用户界面。Textual结合了现代Python特性和Web开发的最佳实践,提供高效的跨平台应用开发体验。 + +## 项目特点 +- 🖥️ 终端+浏览器双渲染引擎 - 一次开发,多端部署 +- 🧩 50+内置组件 - 按钮/表格/树形控件等开箱即用 +- 🎨 主题系统 - 内置多套UI主题,支持自定义样式 +- 🛠️ 开发者工具 - 实时调试终端应用 +- ⚡ 异步核心 - 原生支持async/await语法 + +需要更多示例?请查看[示例目录](https://github.com/Textualize/textual/tree/main/examples)。 + +## 安装指南 + +### 前置条件: +- Python 3.10+ +- 终端要求:支持TrueColor的终端(如Windows Terminal/iTerm2) + +通过pip安装Textual: + +``` +pip install textual +``` + +开发工具包: + +``` +pip install textual textual-dev +``` + +```python + + +## 快速入门 + +""" +显示当前时间的应用 +""" + +from datetime import datetime +from textual.app import App, ComposeResult +from textual.widgets import Digits + + +class ClockApp(App): + CSS = """ + Screen { align: center middle; } + Digits { width: auto; } + """ + + def compose(self) -> ComposeResult: + yield Digits("") + + def on_ready(self) -> None: + self.update_clock() + self.set_interval(1, self.update_clock) + + def update_clock(self) -> None: + clock = datetime.now().time() + self.query_one(Digits).update(f"{clock:%T}") + + +if __name__ == "__main__": + app = ClockApp() + app.run() + +![项目界面截图](images/screenshot1.png) + +>[!TIP] +>Textual底层是异步框架。这意味着您可以将应用与异步库集成——如果您需要的话。 +>如果您不想或不需要使用异步,Textual不会强制您使用。 + + +## 组件库 + +Textual的组件库包含按钮、树形控件、数据表格、输入框、文本区域等等... +结合灵活的布局系统,您可以实现任何需要的用户界面。 + +预定义的主题确保您的应用开箱即用,简便美观。 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + ![按钮](images/screenshot2.gif) + + + +![树形控件](images/screenshot3.gif) + +
! + + [数据表格](images/screenshot4.gif) + + + +![输入框](images/screenshot5.gif) + +
+ +![列表视图](images/screenshot6.gif) + + + +![文本区域](images/screenshot7.gif) + +
+ + +## 演示程序 + + +运行以下命令查看Textual的部分功能: + +``` +python -m textual +``` + +或者尝试[textual演示](https://github.com/textualize/textual-demo)无需安装(需要uv): + +```bash +uvx --python 3.12 textual-demo +``` + +## 开发者控制台 + +开发者工具 + + +如何调试一个也在终端中运行的终端应用? + +textual-dev包提供了一个开发者控制台,可以从另一个终端连接到您的应用程序。 +除了系统消息和事件外,您记录的日志消息和print语句也会显示在开发者控制台中。 + +请[参阅指南](https://textual.textualize.io/guide/devtools/)了解textual-dev包提供的其他有帮助的工具。 + + +## 命令面板 + + +Textual应用具有模糊搜索命令面板。 +按`ctrl+p`打开命令面板。 + +您可以通过自定义命令轻松扩展命令面板。 + +[自定义命令](https://github.com/user-attachments/assets/94d8ec5d-b668-4033-a5cb-bf820e1b8d60) + + +## Textual ❤️ Web + +textual-serve + + +Textual应用在浏览器中和终端中同样适用。任何Textual应用都可以用Web部署启动——这样您就可以在Web上分享您的创作。 +以下是启动演示应用的方法: + +``` +Web部署 "python -m textual" +``` + +除了本地服务应用外,您还可以使用Textual Web服务应用。[Textual Web](https://github.com/Textualize/textual-web). + +Textual Web的穿透防火墙技术可以服务无限数量的应用程序。 + +由于Textual应用的系统要求低,您可以在任何能运行Python的设备上安装它们。将任何设备变成联网设备。 +这无需桌面环境! + + +## 加入我们的Discord + +加入Textual开发者和社区,访问我们的Discord服务器。[Discord Server](https://discord.gg/Enf6Z3qhVr). diff --git a/docs.md b/docs.md index 63c47ed6a6..2fe422eb8f 100644 --- a/docs.md +++ b/docs.md @@ -1,16 +1,16 @@ -# Documentation Workflow +# Documentation Workflow * Ensure you're inside a *Python 3.10+* virtual environment * Run the live-reload server using `mkdocs serve` from the project root * Create new pages by adding new directories and Markdown files inside `docs/*` -## Commands +## Commands - `mkdocs serve` - Start the live-reloading docs server. - `mkdocs build` - Build the documentation site. - `mkdocs -h` - Print help message and exit. -## Project layout +## Project layout mkdocs.yml # The configuration file. docs/ diff --git a/images/screenshot1.png b/images/screenshot1.png new file mode 100644 index 0000000000..899949fd7e Binary files /dev/null and b/images/screenshot1.png differ diff --git a/images/screenshot2.gif b/images/screenshot2.gif new file mode 100644 index 0000000000..f78bf76367 Binary files /dev/null and b/images/screenshot2.gif differ diff --git a/images/screenshot3.gif b/images/screenshot3.gif new file mode 100644 index 0000000000..1f1d307119 Binary files /dev/null and b/images/screenshot3.gif differ diff --git a/images/screenshot4.gif b/images/screenshot4.gif new file mode 100644 index 0000000000..04528c61f8 Binary files /dev/null and b/images/screenshot4.gif differ diff --git a/images/screenshot5.gif b/images/screenshot5.gif new file mode 100644 index 0000000000..4ff03e825a Binary files /dev/null and b/images/screenshot5.gif differ diff --git a/images/screenshot6.gif b/images/screenshot6.gif new file mode 100644 index 0000000000..f79e9a8c40 Binary files /dev/null and b/images/screenshot6.gif differ diff --git a/images/screenshot7.gif b/images/screenshot7.gif new file mode 100644 index 0000000000..5bb8aef311 Binary files /dev/null and b/images/screenshot7.gif differ