vs2010 学习Silverlight学习笔记(5):事件响应
概要:
有时我在想这个学习LerryLee的Silverlight笔记还要不要写下去。首先我是菜鸟,也是边学边写,内容实在是没什么深度;其次Silverlight3与Silverlight2也就
那么一点差别,即使有什么问题大家到网上搜搜基本上都能找到。但我觉得既然当初开始了,那么就把它写完,至少也有始有终么。我就当是写在自己的笔记本上的,
给我自己看的。
事件的声明:
在C#中的事件声明有:声明事件,事件处理方法,事件与方法绑定。
silverlight也类似,可以在.maxl中声明事件,也可以在.cs文件中声明事件并绑定。
代码<Grid x:Name="LayoutRoot" Background="#46461F">
<Ellipse Width="120" Height="120" Fill="Orange"
Canvas.Top="60" Canvas.Left="80"
MouseEnter="Ellipse_MouseEnter"
MouseLeave="Ellipse_MouseLeave">
</Ellipse>
<Ellipse x:Name="ell" Width="50" Height="50" Fill="Orange"
Canvas.Top="60" Canvas.Left="280"
Margin="283,125,67,125">
</Ellipse>
</Grid>
代码public MainPage()
{
InitializeComponent();
ell.MouseEnter += new MouseEventHandler(Ellipse_MouseEnter);
ell.MouseLeave += new MouseEventHandler(Ellipse_MouseLeave);
}
private void Ellipse_MouseEnter(object sender, MouseEventArgs e)
{
Ellipse el=sender as Ellipse;
el.Fill=new SolidColorBrush(Colors.Yellow);
}
private void Ellipse_MouseLeave(object sender, MouseEventArgs e)
{
Ellipse ell = sender as Ellipse;
ell.Fill = new SolidColorBrush(Colors.Green);
}
效果也是一样的:
有人问sender as Ellipse;中的sender什么意思,显然object sender即事件的发送者,此例子中的sender即ellipse,因为是它触发的事件。
事件数据:
比如上个例子中的事件处理方法:void OnMouseLeave(object sender, MouseEventArgs e)
sender是事件发送者,那么e就是存储事件的数据。事件数据类从EventArgs继承来的。所以事件的数据要用到e。代码<Grid x:Name="LayoutRoot" Background="White">
<Rectangle Height="120" Margin="10,10,0,0" Width="200"
Fill="Orange" Stroke="White" StrokeThickness="2"
Canvas.Top="40" Canvas.Left="130" MouseMove="Rectangle_MouseMove" />
<TextBlock Margin="10,120,0,0" Name="txtb" Text="TextBlock" VerticalAlignment="Top" Width="120" />
</Grid>
代码注意e.OriginalSource是Silverlight3中的,代替了原e.Source。
private void Rectangle_MouseMove(object sender, MouseEventArgs e)
{
Point p = e.GetPosition(e.OriginalSource as FrameworkElement);
txtb.Text = String.Format("坐标位置({0}:{1})", p.X, p.Y);
}
路由事件:
我开始不知道什么叫路由事件,不过LerryLee也解释了:事件路由,使得我们可以在父节点上接收和处理来自于子节点的事件。
估计事件路由就是说在父容器声明的事件,也可以应用到子控件。不知这样对不对?
这个例子我试了一下,没什么困难,就不写上来了。
拖放功能:
拖放的这篇跟事件密切相关,我就一起学了。
逻辑:
1,按下鼠标——MouseLeftButtonDown
2,拖动鼠标——MouseMove
3,松开鼠标——MouseLeftButtonUp
听TerryLee这么一说,思路一下就清晰了。我就试着自己写写看。
知道是一会事,做起来是另外一回事。遇到好多问题,不过最后总算高明白了。
要在Canvas里,Grid不行。——这个是因为我在Grid里设置不了坐标,谁有办法的可以告诉我一下。
button控件不行,但我用Image是可以的。——因为Silverlight3里button点击只响应click事件,不响应MouseLeftButtonDown事件。
加上ClickMode="Hover",button就可以拖动了。代码<Canvas Background="#46461F">
<Image Source="/SilverlightAppDemo6;component/Images/aspxba8205_20081025143826_2.jpg" Width="50" Height="50"
MouseLeftButtonDown="OnMouseDown"
MouseMove="OnMouseMove"
MouseLeftButtonUp="OnMouseUp" ></Image>
<Button Canvas.Left="10" Canvas.Top="10" Content="Button" Height="23" Name="button1" Width="75"
MouseLeftButtonDown="OnMouseDown"
MouseMove="OnMouseMove"
MouseLeftButtonUp="OnMouseUp" />
</Canvas>
代码bool trackingMouseMove = false ;
Point mousePosition;
public MainPage()
{
InitializeComponent();
}
void OnMouseDown(object sender, MouseButtonEventArgs e)
{
FrameworkElement element = sender as FrameworkElement;
mousePosition = e.GetPosition(null);
trackingMouseMove = true;
if (null != element)
{
element.CaptureMouse();
element.Cursor = Cursors.Hand;
}
}
void OnMouseMove(object sender, MouseEventArgs e)
{
FrameworkElement element = sender as FrameworkElement;
if (trackingMouseMove)
{
double deltaV = e.GetPosition(null).Y - mousePosition.Y;
double deltaH = e.GetPosition(null).X - mousePosition.X;
double newTop = deltaV + (double)element.GetValue(Canvas.TopProperty);
double newLeft = deltaH + (double)element.GetValue(Canvas.LeftProperty);
element.SetValue(Canvas.TopProperty, newTop);
element.SetValue(Canvas.LeftProperty, newLeft);
mousePosition = e.GetPosition(null);
}
}
void OnMouseUp(object sender, MouseButtonEventArgs e)
{
FrameworkElement element = sender as FrameworkElement;
trackingMouseMove = false;
element.ReleaseMouseCapture();
mousePosition.X = mousePosition.Y = 0;
element.Cursor = null;
}这个代码基本上来自TerryLee,我自己写的也可以移动,不过移动时一抖一抖的。我晕了。
总目录
上一篇:vs2010 学习Silverlight学习笔记(4):界面布局
下一篇:vs2010 学习Silverlight学习笔记(6):全屏模式