|
在設計 WinForm 程序時,我們可以很方便的同時選擇窗體上的多個控件來調整控件的位置。在 Silverlight 應用程序中有時我們也想實現同樣的功能,以提供更好的用戶體驗。本文將要介紹的就是在 Silverlight 程序中實現同時選中和移動多個控件。
1、實現鼠標拖動選擇時顯示所選區域
要實現鼠標拖動選擇時顯示所選區域功能,可以在鼠標拖動時在 Canvas 容器中動態添加一個 Rectangle 來顯示類似在 Windows 資源管理器拖動選擇文件時的選擇框。實現前面所述功能的操作:在 Canvas 容器中按下鼠標左鍵并拖動鼠標來修改選擇區域,選定目標區域后松開鼠標按鍵,這時顯示一個表示所選區域的矩形選框。由實現的操作可知,我們需要在鼠標左鍵按下時在 Canvas 容器中添加一個矩形框,然后在鼠標移動時根據鼠標的位置更新矩形框的大小,最后在鼠標左鍵彈起顯示最終的選擇區域并查找出在選擇區域中的控件。
private Point origPoint; /* 鼠標點擊的位置 */
private Rectangle rect; /* 選擇的區域 */
private Rect selectedRect; /* 選擇的矩形區域 */
private bool isMultipleSelected;
private List<FrameworkElement> selectedElements = new List<FrameworkElement>();
public MainPage()
{
InitializeComponent();
this.rootCanvas.MouseLeftButtonDown += Handle_MouseLeftButtonDown;
}
private void Handle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
if (e.OriginalSource is Canvas)
{
if (rect != null)
{
isMultipleSelected = false;
rootCanvas.Children.Remove(rect);
rect = null;
}
else
{
isMultipleSelected = true;
rect = new Rectangle();
origPoint = e.GetPosition(rootCanvas);
rootCanvas.Children.Add(rect);
rect.SetValue(Canvas.LeftProperty, origPoint.X);
rect.SetValue(Canvas.TopProperty, origPoint.Y);
rect.Fill = new SolidColorBrush(Colors.LightGray);
rect.Stroke = new SolidColorBrush(Colors.Black);
rect.StrokeThickness = 3;
rect.Opacity = .5;
rect.MouseLeftButtonDown += Handle_MouseLeftButtonDown;
rootCanvas.MouseMove += Handle_MouseMove;
rootCanvas.MouseLeftButtonUp += Handle_MouseLeftButtonUp;
}
}
else if (e.OriginalSource is Rectangle)
{
isMultipleSelected = false;
origPoint = e.GetPosition(rootCanvas);
rect.MouseMove += Handle_MouseMove;
rect.MouseLeftButtonUp += Handle_MouseLeftButtonUp;
rect.CaptureMouse();
/*
* 查找在選擇范圍內的控件
*
*/
double rLeft = (double)rect.GetValue(Canvas.LeftProperty);
double rTop = (double)rect.GetValue(Canvas.TopProperty);
foreach (FrameworkElement item in rootCanvas.Children)
{
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); /* 判斷控件所在的矩形區域與選擇的矩形區域是否相交 */
if (rc1 != Rect.Empty)
{
if (!selectedElements.Contains(item))
selectedElements.Add(item);
}
}
}
}
private void Handle_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
if (isMultipleSelected)
{
/* 所選區域的矩形 */
selectedRect = new Rect((double)rect.GetValue(Canvas.LeftProperty),
(double)rect.GetValue(Canvas.TopProperty), rect.Width, rect.Height);
rootCanvas.MouseLeftButtonUp -= Handle_MouseLeftButtonUp;
rootCanvas.MouseMove -= Handle_MouseMove;
}
}
private void Handle_MouseMove(object sender, MouseEventArgs e)
{
if (isMultipleSelected)
{
Point curPoint = e.GetPosition(rootCanvas);
if (curPoint.X > origPoint.X)
{
rect.Width = curPoint.X - origPoint.X;
}
if (curPoint.X < origPoint.X)
{
rect.SetValue(Canvas.LeftProperty, curPoint.X);
rect.Width = origPoint.X - curPoint.X;
}
if (curPoint.Y > origPoint.Y)
{
rect.Height = curPoint.Y - origPoint.Y;
}
if (curPoint.Y < origPoint.Y)
{
rect.SetValue(Canvas.TopProperty, curPoint.Y);
rect.Height = origPoint.Y - curPoint.Y;
}
}
}
NET技術:Silverlight 中用鼠標同時選中和移動多個控件,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。