withData<T, C> static method

NodeFlowViewer<T, C> withData<T, C>({
  1. Key? key,
  2. required NodeFlowTheme theme,
  3. required Widget nodeBuilder(
    1. BuildContext context,
    2. Node<T> node
    ),
  4. required Map<String, Node<T>> nodes,
  5. required List<Connection<C>> connections,
  6. NodeFlowConfig? config,
  7. ValueChanged<Node<T>?>? onNodeTap,
  8. ValueChanged<Node<T>?>? onNodeSelected,
  9. ValueChanged<Connection<C>?>? onConnectionTap,
  10. ValueChanged<Connection<C>?>? onConnectionSelected,
  11. GraphViewport? initialViewport,
})

Convenience factory to create a viewer with data pre-loaded.

This factory creates a NodeFlowController internally and populates it with the provided nodes and connections. Useful for quickly displaying a graph without manually managing the controller.

Parameters:

  • theme: Required theme for styling the viewer
  • nodeBuilder: Required function to build node content
  • nodes: Map of node IDs to Node objects
  • connections: List of Connection objects
  • config: Optional configuration for viewport and interaction behavior
  • initialViewport: Optional starting viewport position and zoom

Example:

final viewer = NodeFlowViewer.withData<String>(
  theme: NodeFlowTheme.light,
  nodeBuilder: (context, node) => Text(node.data),
  nodes: {
    'node1': Node(id: 'node1', data: 'First Node'),
    'node2': Node(id: 'node2', data: 'Second Node'),
  },
  connections: [
    Connection(
      id: 'conn1',
      sourceNodeId: 'node1',
      targetNodeId: 'node2',
      sourcePortId: 'out',
      targetPortId: 'in',
    ),
  ],
);

Implementation

static NodeFlowViewer<T, C> withData<T, C>({
  Key? key,
  required NodeFlowTheme theme,
  required Widget Function(BuildContext context, Node<T> node) nodeBuilder,
  required Map<String, Node<T>> nodes,
  required List<Connection<C>> connections,
  NodeFlowConfig? config,
  ValueChanged<Node<T>?>? onNodeTap,
  ValueChanged<Node<T>?>? onNodeSelected,
  ValueChanged<Connection<C>?>? onConnectionTap,
  ValueChanged<Connection<C>?>? onConnectionSelected,
  GraphViewport? initialViewport,
}) {
  final controller = NodeFlowController<T, C>(
    initialViewport: initialViewport,
    config: config,
  );

  // NOTE: Theme is not set here - it's handled by NodeFlowEditor.initState()
  // which calls initController with all required parameters.

  // Load nodes
  for (final node in nodes.values) {
    controller.addNode(node);
  }

  // Load connections
  for (final connection in connections) {
    controller.addConnection(connection);
  }

  return NodeFlowViewer<T, C>(
    key: key,
    controller: controller,
    nodeBuilder: nodeBuilder,
    theme: theme,
    onNodeTap: onNodeTap,
    onNodeSelected: onNodeSelected,
    onConnectionTap: onConnectionTap,
    onConnectionSelected: onConnectionSelected,
  );
}