NodeFlowViewer<T> class

A simplified viewer for node flow graphs.

This widget provides a read-only view of a node flow graph. It is a wrapper around NodeFlowEditor configured with NodeFlowBehavior.preview, which allows navigation (pan, zoom, select, drag) but prevents structural changes (create, update, delete).

For full editing capabilities, use NodeFlowEditor with NodeFlowBehavior.design.

For a completely non-interactive display, use NodeFlowEditor with NodeFlowBehavior.present.

Example:

NodeFlowViewer<MyData>(
  controller: controller,
  theme: NodeFlowTheme.light,
  nodeBuilder: (context, node) {
    return Text(node.data.toString());
  },
  onNodeTap: (node) {
    print('Tapped: ${node?.id}');
  },
)

For convenience, you can also use NodeFlowViewer.withData to create a viewer with pre-loaded data:

NodeFlowViewer.withData<MyData>(
  theme: NodeFlowTheme.light,
  nodeBuilder: (context, node) => MyNodeWidget(node: node),
  nodes: myNodesMap,
  connections: myConnectionsList,
)
Inheritance
Available extensions

Constructors

NodeFlowViewer({Key? key, required NodeFlowController<T> controller, required Widget nodeBuilder(BuildContext context, Node<T> node), required NodeFlowTheme theme, Widget nodeContainerBuilder(BuildContext context, Node<T> node, Widget content)?, bool scrollToZoom = true, bool showAnnotations = false, ValueChanged<Node<T>?>? onNodeTap, ValueChanged<Node<T>?>? onNodeSelected, ValueChanged<Connection?>? onConnectionTap, ValueChanged<Connection?>? onConnectionSelected})
const

Properties

controller → NodeFlowController<T>
The controller managing the node flow state.
final
hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
nodeBuilder → Widget Function(BuildContext context, Node<T> node)
Builder function for rendering node content.
final
nodeContainerBuilder → Widget Function(BuildContext context, Node<T> node, Widget content)?
Optional builder for customizing the node container.
final
onConnectionSelected → ValueChanged<Connection?>?
Called when a connection's selection state changes.
final
onConnectionTap → ValueChanged<Connection?>?
Called when a connection is tapped.
final
onNodeSelected → ValueChanged<Node<T>?>?
Called when a node's selection state changes.
final
onNodeTap → ValueChanged<Node<T>?>?
Called when a node is tapped.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
scrollToZoom → bool
Whether trackpad scroll gestures should cause zooming.
final
showAnnotations → bool
Whether to show annotation layers (sticky notes, markers, groups).
final
theme → NodeFlowTheme
The theme configuration for visual styling.
final

Methods

build(BuildContext context) → Widget
Describes the part of the user interface represented by this widget.
override
createElement() → StatelessElement
Creates a StatelessElement to manage this widget's location in the tree.
inherited
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited
withAnnotationLayer(NodeFlowController<T> controller) → Widget

Available on Widget, provided by the AnnotationLayerSupport extension

Wraps this widget with an annotation layer.

Operators

operator ==(Object other) → bool
The equality operator.
inherited

Static Methods

withData<T>({Key? key, required NodeFlowTheme theme, required Widget nodeBuilder(BuildContext context, Node<T> node), required Map<String, Node<T>> nodes, required List<Connection> connections, NodeFlowConfig? config, Widget nodeContainerBuilder(BuildContext context, Node<T> node, Widget content)?, bool scrollToZoom = true, bool showAnnotations = false, ValueChanged<Node<T>?>? onNodeTap, ValueChanged<Node<T>?>? onNodeSelected, ValueChanged<Connection?>? onConnectionTap, ValueChanged<Connection?>? onConnectionSelected, GraphViewport? initialViewport}) → NodeFlowViewer<T>
Convenience factory to create a viewer with data pre-loaded.