搜尋套件、儲存庫與 APP 分類

套件詳情v0.32.0

vyuh_node_flow

一個靈活且高效率的節點式流程編輯器,適用於 Flutter。用來建立視覺化程式設計介面、工作流程編輯器、圖表與資料流程。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
6920
喜歡數
168
Pub 分數
150

安裝套件

flutter pub add vyuh_node_flow

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

Vyuh Node Flow 是一個高效率、彈性的節點式流程編輯器,專為 Flutter 設計,讓開發者能夠建立視覺化程式介面、工作流程編輯器、圖表與資料流程。它提供直覺的拖曳與放置介面,用來建構具備可自訂輸入、輸出與連接的互聯節點。設計上支援跨平台使用,相容於 Android、iOS、Web、macOS、Windows 與 Linux。此套件非常適合需要動態視覺邏輯呈現之應用,例如低程式碼工具、資料處理工作流程或互動式繪圖系統。

適用情境

  • 可視化程式介面
  • 工作流程與流程設計
  • 數據管道可視化
  • 互動式圖表編輯器
  • 低程式碼應用開發

主要特色

  • 拖曳節點操作
  • 可自訂的節點範本
  • 即時連接處理
  • 跨平台相容性
  • 高效能渲染
  • 可擴展的外掛架構

適合對象

  • 開發互動式圖表工具的開發者
  • 建立低代碼平台的團隊
  • 具有視覺邏輯的教育應用程式
  • 資料流和管道可視化
  • 需要基於節點的工作流程的UI密集型應用程式

使用建議

  • 需要理解節點基礎的邏輯設計
  • 複雜的UI可能需要自定樣式
  • 效能取決於節點數量與複雜度
  • 有限的內建節點類型(可透過外掛擴充)
  • 新使用者進行初始設定時,可能需要一段學習曲線

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

Vyuh Node Flow

Vyuh Node Flow Banner

A flexible, high-performance node-based flow editor for Flutter applications, inspired by React Flow. This monorepo contains the core library and demo application.

Pub Version License Live Demo

📦 Packages

This repository is organized as a Dart workspace with the following packages:

vyuh_node_flow

The core Flutter package providing the node-based flow editor functionality.

Features:

  • High-performance reactive rendering with MobX
  • Level of Detail (LOD) for automatic visual simplification at zoom levels
  • Type-safe node data with generics
  • Fully customizable themes for nodes, connections, and ports
  • Flexible port system with multiple shapes and positions
  • Connection animation effects (flowing dashes, particles, gradients, pulse)
  • Multiple connection styles (bezier, smoothstep, straight, step) with customizable endpoints
  • AutoPan when dragging near viewport edges
  • Viewport animations for smooth navigation transitions
  • Annotations (sticky notes, markers, groups)
  • Built-in minimap for navigation
  • Comprehensive keyboard shortcuts
  • Read-only viewer mode
  • JSON serialization for saving/loading flows
  • Extension architecture for modular, pluggable features

Installation:

dependencies:
  vyuh_node_flow: <latest version>
demo

A comprehensive demo application showcasing all features of the Vyuh Node Flow editor.

Includes:

  • Interactive workbench with full editor controls
  • Multiple example workflows (manufacturing, healthcare, IoT, etc.)
  • Theme customization controls
  • Layout and alignment tools
  • Connection validation examples
  • Annotation demonstrations

Try it online: 🚀 Live Demo

🚀 Getting Started

Prerequisites
  • Flutter SDK 3.32.0 or higher
  • Dart SDK 3.9.0 or higher
Development Setup

This project uses Melos for workspace management.

  1. Clone the repository:

    git clone https://github.com/vyuh-tech/vyuh_node_flow.git
    cd vyuh_node_flow
    
  2. Install dependencies:

    dart pub get
    
  3. Bootstrap the workspace:

    dart run melos bootstrap
    
  4. Run the demo:

    cd packages/demo
    flutter run -d chrome
    

Documentation

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details.


Made with ❤️ by the Vyuh Team

所屬分類

依賴

依賴清單 7 項

原始碼儲存庫

使用此套件的專案

暫無相關資料。