DrawingManager

Overview

DrawingManager is the central coordinator of the Beep.Skia canvas ecosystem. It maintains the master list of all components and connection lines, routes mouse and keyboard interactions to the appropriate handlers, manages zooming and panning transforms, renders the background grid, and provides the public API for adding, removing, connecting, and disconnecting diagram elements.

Rather than being a monolithic class, DrawingManager delegates specialized responsibilities to a set of helper classes:

using SkiaSharp;

var drawingManager = new DrawingManager();

using var surface = SKSurface.Create(new SKImageInfo(1200, 800));
var canvas = surface.Canvas;

drawingManager.GridSpacing = 20;
drawingManager.ShowGrid = true;
drawingManager.SnapToGrid = true;

drawingManager.RequestRedraw();

Partial Files

The DrawingManager class is split across 5 partial files for maintainability and clear separation of concerns:

Component Management

Components are the primary entities managed by DrawingManager. The component API handles the full lifecycle of diagram nodes:

var node = new ProcessNode("Validate Order");
node.X = 300;
node.Y = 150;
drawingManager.AddComponent(node);

var found = drawingManager.FindComponentAt(new SKPoint(310, 160));
if (found != null)
{
    Console.WriteLine($"Found component: {((SkiaComponent)found).NodeProperties["Text"].Value}");
}

drawingManager.RemoveComponent(node);
node.Dispose();

Connection Management

Connection lines visually link two ports and represent relationships between diagram components. The DrawingManager provides a type-safe API for creating, validating, and removing connections:

drawingManager.ConnectComponents(startNode, endNode);

// Style the newest line
var connection = drawingManager.GetLines().Last();
connection.Paint.PathEffect = SKPathEffect.CreateDash(new[] { 6f, 4f }, 0);
connection.RoutingMode = LineRoutingMode.Orthogonal;

drawingManager.DisconnectComponents(startNode, endNode);

Selection

Selection state is managed cooperatively between DrawingManager and SelectionManager. The drawing manager exposes the selection API while delegating implementation to the selection helper:

Zoom & Pan

The DrawingManager exposes viewport controls that transform the canvas without modifying individual component positions:

drawingManager.ZoomFactor = 1.5f;

drawingManager.PanOffset = new SKPoint(-100, -50);

var worldPoint = drawingManager.ScreenToWorld(
    new SKPoint(mouseX, mouseY));

drawingManager.ResetView();

drawingManager.ZoomToFit();

Events

DrawingManager exposes a rich set of events that allow external code to react to diagram state changes:

drawingManager.ComponentAdded += (sender, args) =>
{
    Console.WriteLine($"Component added: {args.Component.GetType().Name}");
    UpdatePropertyGrid(args.Component);
};

drawingManager.ConnectionEstablished += (sender, args) =>
{
    Console.WriteLine($"Connected: {args.Connection.Start.Component} -> " +
                      $"{args.Connection.EndPoint.Owner}");
    ValidateDiagramIntegrity();
};

drawingManager.SelectionChanged += (sender, args) =>
{
    UpdateToolbarState(
        drawingManager.SelectedComponents.Any(),
        drawingManager.SelectedConnection != null);
};