Silverlight: control (border, grid, etc) resize when drag in C#

Question

I created (using c#) a grid with border & the parent layout is another grid. When I try to rezise dynamically, it doesn't give the expected behaviour. I keep the start position (left-top) of border (with grid) fixed & only the right-bottom point is dragged to resize. In the Mouse move event, the width & height are changed depending on the current position. 1) But it always change the start point (left-top) when changing the width & height ? 2) When border get resized the child (grid) doesn't change its dimensions accordingly ? I cann't find any stretching method. But if border is moved, then the child grid moves with it.

    Point offsetParent;
    .....

    private void MouseMoveEvent(object sender, MouseEventArgs e)
    {
        if (bIsMouseDown)
        {
            ResizeControl(e);
            offsetParent = e.GetPosition(parentGrid); //reset offset to current                
        }
    }

    private void ResizeControl(MouseEventArgs e)
    {
        // get current point
        Point CurPosParent = e.GetPosition(parentGrid);

        // current & new position difference 
        Point diff = new Point(CurPosParent.X - offsetParent.X, CurPosParent.Y - offsetParent.Y);

        // keep start point (left-top position) of border fixed

        // adjust only width & height of border
        border1.Width += diff.X;  //changes start point (left-top position) ????
        border1.Height += diff.Y;              
    }

things to check.... What are the VerticalAlignment and HorizontalAlignment properties of the border? From my understanding of your description, they should be set to Top and Left respectively — Paul Roberts
Found out my mistake from this link Object Positioning and Layout Now I use a Canvas as the parent. Width & height of border & grid can be changed without changing the start point. — pepper
If you've solved the problem - post it as answer and then accept it. This is the Stack Overflow way. — ChrisF

pepper pepper · Accepted Answer · 2011-10-17T13:27:13

Found out my mistake from this link Object Positioning and Layout

Now I use a Canvas as the parent. Width & height of border & grid can be changed without changing the start point.

Point offsetParent; 
..... 

private void MouseMoveEvent(object sender, MouseEventArgs e) 
{ 
    if (bIsMouseDown) 
    { 
        ResizeControl(e); 
        offsetParent = e.GetPosition(parentCanvas); //reset offset to current                 
    } 
} 

private void ResizeControl(MouseEventArgs e) 
{ 
    // get current point 
    Point CurPosParent = e.GetPosition(parentCanvas); 

    // current & new position difference  
    Point diff = new Point(CurPosParent.X - offsetParent.X, CurPosParent.Y - offsetParent.Y); 

    // keep start point (left-top position) of border fixed 

    // adjust only width & height of border 
    border1.Width += diff.X;  
    border1.Height += diff.Y;   
    grid1.Width += diff.X;  
    grid1.Height += diff.Y;               
}

Silverlight: control (border, grid, etc) resize when drag in C#

1 Answers