パッケージ、リポジトリ、アプリカテゴリを検索

fl_nodes のカバー
パッケージ詳細v0.5.0+1

fl_nodes

軽量でスケーラブルかつ高度にカスタマイズ可能なパッケージ。Flutter開発者が、動的でインタラクティブかつ視覚的に魅力的なノードベースのUIを構築できるように支援します。

AndroidiOSWebmacOSWindowsLinux
30日間ダウンロード
34
いいね数
61
Pub ポイント
130

パッケージをインストール

flutter pub add fl_nodes

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

fl_nodes は、動的でインタラクティブなノードベースのユーザーインターフェースを構築するために設計された軽量かつ高カスタマイズ性を持つFlutterパッケージです。開発者がドラッグアンドドロップによるノード、接続、リアルタイム更新をサポートする視覚的に魅力的な図やワークフローを簡単に作成できるようにします。フローチャート、データパイプライン、またはデザインツールなど、視覚的な論理表現が必要なアプリケーションに最適です。このパッケージはスケーラブルであり、モバイル、Web、デスクトップを含むすべての主要プラットフォームで動作します。

用途

  • インタラクティブなフローチャートを作成する
  • データパイプラインの可視化を構築する
  • 図解ツールの設計
  • ワークフローエディターの実装
  • ビジュアルプログラミングインターフェースの開発

主な機能

  • ドラッグアンドドロップノード操作
  • カスタマイズ可能なノードおよび接続のスタイル
  • リアルタイム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 件

ソースリポジトリ

このパッケージを使用しているプロジェクト

データはまだありません。