We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Identify the Shapes Dropped on the Page from the Palette

I saw how to do this in WPF, but I can't find anything on how to do this in Silverlight. I dynamically generate the SymbolPaletteItems from a database. I can drag and drop the items onto the page. That I all got working. On double click of one of the nodes, I want a child window to pop up with some info that is specific to that node, but I need to retrieve which of the SymbolPaletteItems it is. How do I do this?

7 Replies

MP Mohana Priya Raja Syncfusion Team August 12, 2014 11:06 AM UTC

Hi Chris Goodwin,

Internal behavior:

When the symbol is dropped from the SymbolPalette, the Content of the Symbol is serialized. In DiagramView OnDrop event, this serialized object will be desterilized to create a clone of SymbolPaletteItem’s Content. Next a new node will be created and the cloned object will be set as a Node’s content.

Determine which node is dropped:
To identify which Symbol has been dropped, Name property of the SymbolPaletteItem can be used to achieve this requirement. SymbolPaletteItemName property in NodeDrop event returns the Name of the dropped SymbolPaletteItem. We have provided a code snippet to represent this ,please refer to the code snippet.

Code Snippet:

     //Creating SymbolPaletteItem


   SymbolPaletteItem item = new SymbolPaletteItem();

   item.Width = 40;

   item.Height = 20;

   //Used for Identifying the Dropped Node

   item.Name = 'shape1';

   //spg1 is SymbolPalette group

   spg1.Items.Add(item);

   

   //Register the NodeDrop event of DiagramView

   diagramView.NodeDrop += new  NodeDroppedEventHandler(diagramView_NodeDrop);




//DiagramView NodeDrop Event

  void diagramView_NodeDrop(object sender, NodeDroppedRoutedEventArgs evtArgs)

     {

          if (evtArgs.SymbolPaletteItemName == 'shape1')

            {

               //Reference of the Dropped Node using evtArgs

                  Node dropNode = evtArgs.DroppedNode as Node;

            }

     }

Please let us know if you have any concerns

Regards,

MohanaPriya R



CN Chase Novack August 12, 2014 06:12 PM UTC

Hello Mohana,

My name is Chase Novack. I work on the same development team as Chris Goodwin, and since he is out of the office this week, I'm looking into this issue. 

The code you posted would be a great solution if we wanted to perform our event (opening a child window with relevant data from the database) on NodeDrop, but we want to be able to do this on NodeClick instead. Is there any way for us to access the Tag or Name property of a SymbolPaletteItem inside the NodeClick event that corresponds to the SymbolPaletteItem that is dropped onto the diagram? 

Thanks for your help,
Chase 


MP Mohana Priya Raja Syncfusion Team August 13, 2014 12:48 PM UTC

Hi Chase Novack,

 

Regarding “Access the Tag or Name property of a SymbolPaletteItem inside the NodeClick event” To identify which Symbol has been dropped, Your requirement can be achieved by using NodeDrop event of DiagramView and Tag property of Node. Please use the Tag property of the Node to save the SymbolPaletteItemName property in NodeDrop Event. We have provided code snippet to achieve your requirement. Please refer to the following code snippet.

 Code Snippet:


//DiagramView NodeDrop Event

  void diagramView_NodeDrop(object sender, NodeDroppedRoutedEventArgs evtArgs)

     {

          if (evtArgs.SymbolPaletteItemName == 'shape1')

            {

               //Reference of the Dropped Node using evtArgs

                  Node dropNode = evtArgs.DroppedNode as Node;

                 dropnode.Tag="shape1";

 

 

            }

     }

//DiagramView NodeClick Event

void diagramView_NodeClick(object sender, NodeRoutedEventArgs evtArgs)

{   

    Node dropnode = evtArgs.Node as Node;

    //use the Tag property of Node to identify the Clicked Node

}

 

Please let us know if you have any concerns

Regards,

MohanaPriya R


 



CN Chase Novack August 13, 2014 05:40 PM UTC

Mohana,

This is closer to what we need but I don't think using NodeDrop at all will work for us. We create our custom SymbolPaletteItems from the database using a loop like this in the constructor of a user control (we also assign the loop index to the tag property in the loop):
 for (int j = 0; j < MainPage.DomainContext.Equipment.Count; j++)
            {
                sItem[j] = new SymbolPaletteItem();
                sItem[j].Height = 50;
                sItem[j].Width = 50;
                sUri[j] = new Uri("/Project;component/Images/test.png", UriKind.Relative);
                bImage[j] = new BitmapImage(sUri[j]);
                sImage[j] = new Image();
                sImage[j].Stretch = Stretch.Fill;
                sImage[j].Source = bImage[j];
                //sItem[j].Content = sImage[j];
                sItem[j].Content = sImage[j];
                sItem[j].Tag = j;
                sItem[j].Name = j.ToString();
                group.Items.Add(sItem[j]);            
                MessageBox.Show("Tag: " + sItem[j].Tag);
            }

What we need/want to do is access either sItem[j].Tag or sItem[j].Name in the NodeClick event triggered when adding the SymbolPaletteItem  (sItem[j]) to the diagram. How would I do this?

Thanks.


CN Chase Novack August 13, 2014 05:43 PM UTC

Adding to this, in NodeClick I want to run code like this. 

Node item = sender as Node;
int equipIndex = (int)item.Tag;


and then use equipIndex as a parameter to my child window, but this doesn't work.


CG Chris Goodwin August 18, 2014 03:23 PM UTC

Mohana,
Thank you for all of your help. We were able to accomplish the task we needed by setting the SymbolPalleteItem's Name property to it's respective index in our database, then from there, setting the tag of each node upon drop to the name.Thank you for your help! 


SC Saranya Chandrasekaran Syncfusion Team August 20, 2014 04:24 AM UTC

Hi Chase,

Thanks for your update.

Please let us know if you require further assistance on this.

Regards,

Saranya C


Loader.
Live Chat Icon For mobile
Up arrow icon