Search code examples
c#asp.netsilverlightsilverlight-4.0silverlight-3.0

How can I divide the figure into the fields using SilverLight


Can someone help me solve the question: How can I divide the figure into the fields, so depending on which area will be mouse click it will be carried out a specific event?

    private void LayoutRoot_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        //if (!isDragging)
        {
            //creating of my  user control element
            NodePicture node = new NodePicture();
            node.Width = 100;
            node.Height = 100;

            //use cursor position as the center of the figure
            Point point = e.GetPosition(this);
            node.SetValue(Canvas.TopProperty, point.Y - node.Height / 2);
            node.SetValue(Canvas.LeftProperty, point.X - node.Width / 2);
            node.MouseLeftButtonDown += controlReletionshipsLine;
            LayoutRoot.Children.Add(node);
        }
    }

    private void controlReletionshipsLine(object sender, MouseButtonEventArgs e)
    {
        //creating parant element of node
        ParentNode parentNode = new ParentNode();

        //creating connected element of the node
        ConnectedNode connectedNode = new ConnectedNode();

        //creating node element
        NodePicture node = (NodePicture)sender;

        //getting the relative position of the element
        Point point = e.GetPosition(this);

Solution

  • You can either divide the object mathematically, using the mouse position "relative to the object" to decide where you clicked, or you can overlay a number of polygons, each with the colour alpha-channel set to 1% (so they can be hit-tested, but are not visible).

    As you simply want to see which quarter of the circle you clicked in, call GetPosition on the LeftMouseButtonDown event args, passing the control itself as the parameter. This will give you back a Point object with the position relative to the top left corner of the control.

    Then it is just a matter of seeing which quarter it is in:

    private void ControlX_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        // Get the relative position of the element
        Point point = e.GetPosition(sender as UIElement);
    
        if (point.X > control.Width/2)
        {
            if (point.Y > control.Height/2)
            {
                // You are in the bottom right quarter
            }
            else
            {
                // You are in the top right quarter
            }
        }
        else
        {
            if (point.Y > control.Height/2)
            {
                // You are in the bottom left quarter
            }
            else
            {
                // You are in the top left quarter
            }
        }
    }
    

    In the sample code you sent me (in controlReletionshipsLine) you have:

    // getting the relative position of the element
    Point point = e.GetPosition(this);
    

    It should have been:

    // getting the relative position of the element
    Point point = e.GetPosition(sender as UIElement);