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

fl_nodes 封面
套件詳情v0.5.0+1

fl_nodes

一個輕量、可擴展且高度可自訂的套件,讓 Flutter 開發者能夠建立動態、互動式且視覺上吸引人的節點式介面。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
34
喜歡數
61
Pub 分數
130

安裝套件

flutter pub add fl_nodes

套件介紹

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

fl_nodes 是一個輕量級且高度可自訂的 Flutter 套件,專為建立動態、互動式的節點式使用者介面而設計。它讓開發者能輕鬆建立視覺上吸引人的圖表與工作流程,支援拖曳節點、連結及即時更新等功能。適合需要視覺化邏輯呈現的應用程式,例如流程圖、資料流程或設計工具。此套件具備良好擴展性,並可在所有主要平台運作,包含行動裝置、網頁與桌面端。

適用情境

  • 建立互動式流程圖
  • 構建數據管道可視化
  • 設計繪圖工具
  • 實施工作流編輯器
  • 開發可視化程式設計介面

主要特色

  • 拖曳節點互動
  • 可自定義的節點和連接樣式
  • 即時UI更新
  • 跨平台相容性
  • 可擴展的架構
  • 可擴充的外掛系統

適合對象

  • 使用 Flutter 的 UI/UX 設計師
  • 開發視覺編輯器的開發者
  • 教育類應用開發者
  • 工作流自動化工具
  • 資料視覺化專案

使用建議

  • 需要理解節點基礎的邏輯
  • 大型圖可能需要效能優化
  • 樣式自定義需要熟悉 Flutter 小部件
  • 有限的內建範本
  • 最適合中大型互動式圖表

原始 README

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

🏗️ FlNodes Framework

Dart Flutter Maintained Melos

Pub Downloads Likes Stars Repo Size

What do you think of badges? YES!

The FlNodes Framework is a modular, scalable ecosystem for building sophisticated node-based applications in Flutter. Designed for developers who need professional-grade visual editors, workflow tools, and graph-based interfaces, FlNodes provides a complete solution from low-level rendering to high-level abstractions.


  FlNodes Example

A screenshot from our visual scripting example app


💡 Use Cases

Whether you're building tools for developers, designers, or end-users, FlNodes provides the building blocks for:

  • 🎮 Visual Scripting Editors – Game logic, automation flows, or state machines.
  • 🛠 Workflow & Process Designers – Business rules, decision trees, and automation paths.
  • 🎨 Shader & Material Graphs – Build custom shaders visually.
  • 📊 Dataflow Tools – ETL pipelines, AI workflows, and processing graphs.
  • 🤖 ML Architecture Visualizers – Visualize and configure neural networks.
  • 🔊 Modular Audio Systems – Synthesizers, effect chains, or sequencing tools.
  • 🧠 Graph-Based UIs – Mind maps, dependency trees, and hierarchical structures.

🏗️ Framework Architecture

The FlNodes Framework is organized as a monorepo with specialized packages:

📦 Core Packages
  • fl_nodes_core – The engine that powers the FlNodes Framework.

  • fl_nodes – A proxy export package that maintains backward compatibility with earlier versions of the FlNodes framework.

🔌 Coming Soon
  • fl_nodes_visual_scripting
  • fl_nodes_mind_maps
  • fl_nodes_flow_graphs

📚 Getting Started

For a fast and easy setup, check out our Quickstart Guide. It covers the basics to get you up and running with FlNodes in no time!

If you're migrating from an earlier version, the fl_nodes package maintains backward compatibility while providing access to the new modular architecture.


📦 Installation

Choose the package that fits your needs:

dependencies:
  # For most users - high-level API with full features
  fl_nodes: ^latest_version

  # For advanced users needing low-level control
  fl_nodes_core: ^latest_version

Regardless of the package you choose you must add the following asset:

flutter:
  shaders:
    - packages/fl_nodes_core/shaders/grid.frag

Then, run:

flutter pub get

🧩 Examples & Demo

Explore fully working examples:


🕹️ Current input support

Legend:

  • ✅ Supported
  • ❌ Unsupported
  • ⚠️ Partial
  • 🧪 Untested
🖥️Desktop and 💻 laptop: Windows Linux macOS
native/mouse ✅ ✅ ✅
native/trackpad ✅ 🧪 ✅
web/mouse ✅ ✅ ✅
web/trackpad ✅ ✅ 🧪
📱Mobile Android iOS
native ✅ 🧪
web ✅ 🧪

🙌 Contributing

We'd love your help in making FlNodes even better! You can contribute by:


📜 License

FlNodes is open-source and released under the MIT License. Contributions are welcome!


🚀 Let's Build Together!

Enjoy using FlNodes and create amazing node-based UIs for your Flutter apps and/or get involved in library's development! 🌟

Made with contrib.rocks.

所屬分類

依賴

依賴清單 4 項

原始碼儲存庫

使用此套件的專案

暫無相關資料。