NodeFlowViewer<T> class

A simplified read-only viewer for node flow graphs.

This widget provides a read-only view of a node flow graph with pan and zoom capabilities but no editing functionality. It is a wrapper around NodeFlowEditor configured for display-only purposes.

Use this widget when you need to display a graph without allowing users to:

• Drag or move nodes
• Create or delete connections
• Modify the graph structure

Users can still:

• Pan the viewport (if enablePanning is true)
• Zoom in/out (if enableZooming is true)
• Select items (if allowSelection is true)
• Tap on nodes/connections (with callbacks)

Example:

NodeFlowViewer<MyData>(
  controller: controller,
  theme: NodeFlowTheme.light,
  nodeBuilder: (context, node) {
    return Text(node.data.toString());
  },
  enablePanning: true,
  enableZooming: true,
  allowSelection: true,
  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,
)