Creating Custom Components

Custom Component

In order to create a custom component, simply derive from any of the built-in component classes, ultimately from the ComponentBase class. Usually you will want to override the draw method to render the component and eventually the getDesiredSize method. A simple custom component is illustrated below:

Java

import java.awt.Color;
import java.awt.Graphics2D;import com.mindfusion.diagramming.RenderOptions;
import com.mindfusion.diagramming.components.ComponentBase;
public class RectangleComponent extends ComponentBase
{
    @Override
    public void draw(Graphics2D g2d, RenderOptions options)
    {
        g2d.setPaint(Color.RED);
        g2d.draw(getBounds());
    }
}

The above component only renders a red rectangle.

To provide custom component behavior based on the user input, override the onMouseDown, onMouseUp, onMouseMove, onKeyDown, onKeyUp and onKeyPress methods.

Custom Panel

To create a custom container component, you need to derive from the ContainerComponent class and override the arrangeComponents method and possibly the getDesiredSize method. From within the arrangeComponents method you position the individual child components by assigning values to their Bounds property according to their desired size and the arrangement logic of the panel. Below you can find the implementation of a very simple custom panel class, which arranges its children with a constant offset relative to each other.

Java

import java.awt.Graphics2D;
import java.awt.geom.Rectangle2D;
import java.awt.geom.Rectangle2D.Float;

import com.mindfusion.diagramming.XDimension2D.Double;
import com.mindfusion.diagramming.components.ComponentBase;
import com.mindfusion.diagramming.components.ContainerComponent;

public class OffsetPanel extends ContainerComponent
{
    @Override
    public void arrangeComponents(Float availableSpace, Graphics2D g2d)
    {
        float y = 0;
        for (ComponentBase component : getComponents())
        {
            // calculate the desired size of the component
            Double availableSize = new Double(availableSpace.getWidth(), availableSpace.getHeight());
            Double desiredSize = component.getDesiredSize(availableSize, g2d);
            component.setBounds(
                new Rectangle2D.Float(
                    y, y, (float)desiredSize.getWidth(), (float)desiredSize.getHeight()));
            component.arrangeComponents(component.getBounds(), g2d);

            y += 2;
        }
    }
 
    @Override
    public Double getDesiredSize(Double availableSize, Graphics2D g2d)
    {
        double width = 0;
        double height = 0;

        double y = 0;
        for (int i = 0; i < getComponents().size(); i++)
        {
            ComponentBase component = getComponents().get(i);

            Double desiredSize = component.getDesiredSize(availableSize, g2d);

            width = Math.max(width, desiredSize.getWidth() + y);
            height = Math.max(height, desiredSize.getHeight() + y);

            y += 2;
        }

        return new Double(width, height);
    }
}

Using Custom Components in XML

If you want to use custom components in XML you may need to supply a custom TypeResolver object to the loader. This is especially true if you want to use shortcut names for your components. Consider the above RectangleComponent in the following example:

XML

<Rectangle />

Loading this XML will fail unless you supply an TypeResolver, which can resolve "Rectangle" to RectangleComponent.