Skip to content

longbridge/gpui-component

Repository files navigation

GPUI Component

Build Status

UI components for building fantastic desktop applications using GPUI.

Features

  • Richness: 40+ cross-platform desktop UI components.
  • Native: Inspired by macOS and Windows controls, combined with shadcn/ui design for a modern experience.
  • Ease of Use: Stateless RenderOnce components, simple and user-friendly.
  • Customizable: Built-in Theme and ThemeColor, supporting multi-theme and variable-based configurations.
  • Versatile: Supports sizes like xs, sm, md, and lg.
  • Flexible Layout: Dock layout for panel arrangements, resizing, and freeform (Tiles) layouts.
  • High Performance: Virtualized Table and List components for smooth large-data rendering.
  • Content Rendering: Native support for Markdown and simple HTML.
  • Charting: Built-in charts for visualization your data.
  • Code Highlighting: Code Editor and Syntax highlighting.
  • Wef: (Experimental) Offscreen rendering webview based on CEF.

Showcase

Here is the first application: Longbridge Pro, built using GPUI Component.

Image

We built multi-theme support in the application. This feature is not included in GPUI Component itself, but is based on the Theme feature, so it's easy to implement.

Usage

GPUI and GPUI Component are still in development, so you need to add dependencies by git.

gpui = { git = "https://github.com/zed-industries/zed.git" }
gpui-component = { git = "https://github.com/longbridge/gpui-component.git" }

WebView

Still early and experimental; there are a lot of limitations.

GPUI Component has a WebView element based on Wry. This is an optional feature, which you can enable with a feature flag.

gpui-component = { git = "https://github.com/longbridge/gpui-component.git", features = ["webview"] }

More usage examples can be found in the story directory.

Icons

GPUI Component has an Icon element, but it does not include SVG files by default.

The example uses Lucide icons, but you can use any icons you like. Just name the SVG files as defined in IconName. You can add any icons you need to your project.

Development

We have a gallery of applications built with GPUI Component.

cargo run

More examples can be found in the examples directory. You can run them with cargo run --example <example_name>.

Check out CONTRIBUTING.md for more details.

Compare to others

Features GPUI Component Iced egui QT 6
Language Rust Rust Rust C++/QML
Core Render GPUI wgpu wgpu QT
License Apache 2.0 MIT MIT/Apache 2.0 Commercial
Min Binary Size 1 12MB 11MB 5M 20MB 2
Cross-Platform Yes Yes Yes Yes
Documentation No Simple Simple Good
Web No Yes Yes Yes
UI Style Modern Basic Basic Basic
CJK Support Yes Yes Bad Yes
Chart Yes No No Yes
Table (Large dataset) Yes
(Virtual Rows, Columns)
No Yes
(Virtual Rows)
Yes
(Virtual Rows, Columns)
Table Column Resize Yes No Yes Yes
CodeEditor Simple Simple Simple Basic API
Dock Layout Yes Yes Yes Yes
Syntax Highlight Tree Sitter Syntect Syntect QSyntaxHighlighter
Markdown Rendering Yes Yes Basic No
Markdown mix HTML Yes No No No
HTML Rendering Basic No No Yes
Text Selection TextView No Any Label No
Themes Yes No No No
I18n Yes Yes Yes Yes

Please submit an issue or PR if any mistakes or outdated are found.

License

Apache-2.0

Footnotes

  1. Release builds by use simple hello world example.

  2. Reducing Binary Size of Qt Applications