Silverlight select and move multiple controls-remove border detection and automatically include all selected controls in the selection box

In the previous article, we introduced how to select and move multiple controls simultaneously in Silverlight, but we didn't check whether the control is removed from the border. Therefore, we can drag the control out of the container boundary, this is certainly not allowed in practical applications. In addition, only the selected control is included in the selected area, and the entire control is not automatically included in the selected area. Here is a brief introduction to the solutions to the two problems mentioned above.

1. For the first problem, you only need to make a judgment on the new position of the control when moving the control. The following figure shows the modifiedCode:

/* Rect's X axis value and Y axis value */Double rleft = (double) rect. getvalue (canvas. leftproperty); double rtop = (double) rect. getvalue (canvas. topproperty); double DeltaV = E. getposition (rootcanvas ). y-origpoint. y; double deltah = E. getposition (rootcanvas ). x-origpoint. x; double newtop = DeltaV + rtop; double newleft = deltah + rleft; If (newtop <0) // has been dragged out of the top edge {newtop = 0; DeltaV = 0 ;} else if (newtop> rootcanvas. actualheight-rect. actualheight) // the bottom edge has been dragged out {newtop = rootcanvas. actualheight-rect. actualheight; DeltaV = newtop-rtop;} If (newleft <0) // you have dragged the left edge {newleft = 0; deltah = 0;} else if (newleft> rootcanvas. actualwidth-rect. actualwidth) // you have dragged the right edge {newleft = rootcanvas. actualwidth-rect. actualwidth; deltah = newleft-rleft;} foreach (VAR Se in selectedelements) {double cleft = deltah + (double) se. getvalue (canvas. leftproperty); double ctop = DeltaV + (double) se. getvalue (canvas. topproperty); se. setvalue (canvas. leftproperty, cleft); se. setvalue (canvas. topproperty, ctop );}

 

Note that the judgment on the bottom edge should be based on the height of the container minus the height of the rect (select region). The judgment on the right edge should also be based on the width of the container minus the width of the rect, because E. getposition (uielement ). X and E. getposition (uielement ). the Y value is the left and top of the uielement from the left and top of the container.

2. For the second problem, if a control is selected, you only need to expand the selection area to include the rectangular area of the control (which can be implemented through the Union method of rect ), the modified code is as follows:

Rect finalrect = rect. Empty; // The selected region to be displayed. rect temp = rect. Empty; do {If (finalrect! = Rect. empty) temp = new rect (finalrect. x, finalrect. y, finalrect. width, finalrect. height); foreach (frameworkelement item in rootcanvas. children) {If (item as rectangle! = NULL) continue; double cleft = (double) item. getvalue (canvas. leftproperty); double ctop = (double) item. getvalue (canvas. topproperty); rect RC1 = new rect (selectedrect. x, selectedrect. y, selectedrect. width, selectedrect. height); rect RC2 = new rect (cleft, ctop, item. actualwidth, item. actualheight); rc1.intersect (RC2);/* determines whether the area of the rectangle where the control is located matches the area of the selected rectangle */If (RC1! = Rect. empty) {selectedrect. union (RC2);/* When selectedrect is extended, a new control may be included in the selected area. Therefore, do while loop is used to judge */finalrect. union (RC2); If (! Selectedelements. Contains (item) selectedelements. Add (item) ;}} while (temp! = Finalrect);/* If temp = finalrect, no new control is selected */If (finalrect! = Rect. empty) {/* reset the size and position of the selected region */rect. setvalue (canvas. topproperty, finalrect. y); rect. setvalue (canvas. leftproperty, finalrect. x); rect. setvalue (rectangle. widthproperty, finalrect. width); rect. setvalue (rectangle. heightproperty, finalrect. height );}

 

At the same time, the above Code is moved from the mouse clicking event to the mouse clicking event, so that when the mouse is up, the selected control can be automatically included in the selection area. Code can be downloaded from the http://zdd.me/myfiles.

Demo address http://v.zdd.me/testpage.html