Mouse interaction

Every node control allows you to easily interact with the mouse to change the default behavior. To do that, inherit your node control class as shown below and override the behavior for a mouse action that you need.

Here is the custom node control class NodeImageInteractive that draws red pixels on the image stored in the NodeWithImage node instance when the mouse is clicked and moved over the node control.

class NodeImageInteractive : NodeImage
{
    private bool _clicked;

    protected override void MouseDown(MouseActionArgs args, DrawContext context)
    {
        _clicked = true;
        // context.Bounds contains the node control bounds rectangle.
        DrawPoint(args.Node, context.Bounds, args.Location);
    }

    protected override void MouseUp(MouseActionArgs args)
    {
        _clicked = false;
    }

    protected override void MouseMove(MouseActionArgs args, DrawContext context)
    {
        DrawPoint(args.Node, context.Bounds, args.Location);
    }

    void DrawPoint(Node node, Rectangle bounds, Point mouseLocation)
    {
        if (!_clicked)
            return;

        // calculate the pixel position inside the image.
        Point pos = mouseLocation;
        pos.X -= bounds.Location.X;
        pos.Y -= bounds.Location.Y;

        Bitmap bmp = GetValue<Bitmap>(node);
        bmp.SetPixel(pos.X, pos.Y, Color.Red);
        // notify and invalidate the treeview after node control changes.
        OnControlChanged(eNodeControlChangeType.Look);
    }
}

// use our node control.
NodeImageInteractive nc = new NodeImageInteractive();
nc.AttachTo(tree);

// where ourImage is an image to display inside a node.
NodeWithImage n = new NodeWithImage(ourImage);      
n.AttachTo(tree);

Class NodeImageInteractive
    Inherits NodeImage
    Private _clicked As Boolean

    Protected Overrides Sub MouseDown(args As MouseActionArgs, context As DrawContext)
        _clicked = True
        ' context.Bounds contains the node control bounds rectangle.
        DrawPoint(args.Node, context.Bounds, args.Location)
    End Sub

    Protected Overrides Sub MouseUp(args As MouseActionArgs)
        _clicked = False
    End Sub

    Protected Overrides Sub MouseMove(args As MouseActionArgs, context As DrawContext)
        DrawPoint(args.Node, context.Bounds, args.Location)
    End Sub

    Private Sub DrawPoint(node As Node, bounds As Rectangle, mouseLocation As Point)
        If Not _clicked Then
            Return
        End If

        ' calculate the pixel position inside the image.
        Dim pos As Point = mouseLocation
        pos.X -= bounds.Location.X
        pos.Y -= bounds.Location.Y

        Dim bmp As Bitmap = GetValue(Of Bitmap)(node)
        bmp.SetPixel(pos.X, pos.Y, Color.Red)
        ' notify and invalidate the treeview after node control changes.
        OnControlChanged(eNodeControlChangeType.Look)
    End Sub
End Class

' use our node control.
Dim nc As New NodeImageInteractive()
nc.AttachTo(tree)

' where ourImage is an image to display inside a node.
Dim n As New NodeWithImage(ourImage)
n.AttachTo(tree)

This example demonstrates how to create a custom node control that responds to mouse events. The NodeImageInteractive class overrides the MouseDown, MouseUp, and MouseMove methods to handle mouse clicks and movements over the node control.