Do not allow Node that is left outside the specified area in SfDiagram.

[Özgür]

Hello,

I have a field like in the picture. I have created a page field with the following settings.

PageHeight="480"

PrintMargin="0"

ShowPageBreaks="True">

What I want to do is to take the area I have determined in the middle of the page and I do not want a picture selected in the Stencil to be left outside that area. It should only be left in the specified area.

Is this possible ? Can you help if possible?

Also: My images in the Middle Size field are larger in size but they don't fit. How do I get images of different sizes to be displayed inside the stencil?

When I do as follows, when the item selected from the Stencil is left outside the area I do not want, I can move it to a point of the relevant area. But if I want to put out an item that is already in the field, I was not sure which event I should use.

    private void MainWindow_ItemDropEvent(object sender, ItemDropEventArgs args)

        {

            if (args.Source != null && args.Source is INode)

            {

                INode node = args.Source as INode;

                if(node.OffsetX > 800 || node.OffsetY > 600)

                {

                    node.OffsetX = 50;

                    node.OffsetY = 50;

                }

            }

        }

[Prakash Perumal]

Hi Ozgur,

Please find the response for the query.

Query	Response
To move an existing item that has been dropped outside of the desired area into it, similar to dropping an item from the stencil.	We have achieved your requirement using the NodeChangedEvent,. Please refer to the code provided below.   private void MainWindow_NodeChangedEvent(object sender, ChangeEventArgs<object, NodeChangedEventArgs> args) {     if (args.Item is INode && args.NewValue.InteractionState == NodeChangedInteractionState.Dragged)     {         ResetNodeOffset(args.Item as INode);     } }   private void MainWindow_ItemDropEvent(object sender, ItemDropEventArgs args) {     if (args.Source != null && args.Source is INode)     {         ResetNodeOffset(args.Source as INode);     } }   private void ResetNodeOffset(INode node) {     if (node.OffsetX > 800 || node.OffsetY > 600)     {         node.OffsetX = 50;         node.OffsetY = 50;     } }
How do I get images of different sizes to be displayed inside the stencil?	Would you like to display the image in its original size, or would you like to stretch it to fit the stencil's symbol? Could you please provide us with more information so that we can help you further?

Regards,

Prakash

[Özgür]

Thank you for your answer. My first problem is solved.

For my second question; Actually, I want to do both. I would be glad if you could guide me in both.

[Özgür]

Hello,

I can resize when I drop my tool to the diagram as below. I just couldn't find how to show it in its own size in the stencil. Can you help me ?

private void SetNodeSize(INode node, double witdth, double height)

        {

            node.UnitHeight = height;

            node.UnitWidth = witdth;

        }

[Prakash Perumal]

Hi Ozgur,

Stencil does not provide an option to render symbols with their own unique size, since this could lead to a visually unappealing arrangement. However, you can define a uniform size for all symbols within the Stencil as outlined in the User Guide documentation linked below.

UG docs: Appearance of stencil in WPF Diagram control | Syncfusion

We have also attached sample for your reference.

Hope this helps!

Regards,

Prakash

Attachment: DiagramSampleSymbol_2b3dea9d.zip