稳扎稳打Silverlight(13) - 2.0交互之鼠标事件和键盘事件

[索引页]
[源码下载]


稳扎稳打Silverlight(13) - 2.0交互之鼠标事件和键盘事件


作者: webabcd


介绍
Silverlight 2.0 人机交互:响应用户的鼠标操作和键盘操作
    MouseEnter - 鼠标进入时触发的事件(显然,此事件不能冒泡)
    MouseLeave - 鼠标离开时触发的事件(显然,此事件不能冒泡)
    MouseLeftButtonDown - 鼠标左键单击按下时触发的事件
    MouseLeftButtonUp - 鼠标左键单击按下并放开时触发的事件
    MouseMove - 鼠标移动时触发的事件
    MouseEventArgs.GetPosition() - 鼠标相对于指定元素的坐标
    MouseButtonEventArgs.Handled - 此事件是否已被处理
    KeyDown - 鼠标按下时触发的事件
    KeyUp - 鼠标按下并放开时触发的事件
    KeyEventArgs.Key - 与事件相关的键盘的按键 [System.Windows.Input.Key枚举]
    KeyEventArgs.Handled - 是否处理过此事件
    System.Windows.Input.Keyboard.Modifiers - 当前按下的辅助键 [System.Windows.Input.ModifierKeys枚举]


在线DEMO
http://webabcd.blog.51cto.com/1787395/342779 


示例
1、Mouse.xaml
<UserControl x:Class="Silverlight20.Interactive.Mouse" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
         
        <!--路由事件是一种可以针对元素树中的多个侦听器(而不是仅针对引发该事件的对象)调用处理程序的事件--> 
         
        <!-- 
        MouseLeftButtonDown, MouseLeftButtonUp和MouseMove均为向上冒泡的路由事件 
        本例的事件路由为:Ellipse -> StackPanel -> UserControl 或 Rectangle -> Canvas -> StackPanel -> UserControl 
        如果不想向上冒泡,则可以使用 MouseButtonEventArgs.Handled = true 告知事件已被处理 
        --> 
        <StackPanel HorizontalAlignment="Left" MouseLeftButtonDown="StackPanel_MouseLeftButtonDown" > 

                <!-- 
                MouseEnter - 鼠标进入时触发的事件(显然,此事件不能冒泡) 
                MouseLeave - 鼠标离开时触发的事件(显然,此事件不能冒泡) 
                 
                MouseLeftButtonDown - 鼠标左键单击按下时触发的事件 
                MouseLeftButtonUp - 鼠标左键单击按下并放开时触发的事件 
                MouseMove - 鼠标移动时触发的事件 
                --> 
                <Ellipse x:Name="ellipse" Width="200" Height="100" Fill="Red" Margin="5"    
                        MouseEnter="ellipse_MouseEnter"    
                        MouseLeave="ellipse_MouseLeave" 
                        MouseLeftButtonDown="ellipse_MouseLeftButtonDown" 
                        MouseLeftButtonUp="ellipse_MouseLeftButtonUp" 
                > 
                </Ellipse> 

                <Canvas Margin="5"> 

                        <!--用于演示拖放的矩形--> 
                        <Rectangle x:Name="rectangle" Fill="Blue" Width="50" Height="50" 
                                MouseLeftButtonDown="rectangle_MouseLeftButtonDown" 
                                MouseLeftButtonUp="rectangle_MouseLeftButtonUp" 
                                MouseMove="rectangle_MouseMove" 
                        /> 
                         
                </Canvas> 

        </StackPanel> 
</UserControl>
 
Mouse.xaml.cs
InBlock.gif using System; 
InBlock.gif using System.Collections.Generic; 
InBlock.gif using System.Linq; 
InBlock.gif using System.Net; 
InBlock.gif using System.Windows; 
InBlock.gif using System.Windows.Controls; 
InBlock.gif using System.Windows.Documents; 
InBlock.gif using System.Windows.Input; 
InBlock.gif using System.Windows.Media; 
InBlock.gif using System.Windows.Media.Animation; 
InBlock.gif using System.Windows.Shapes; 
InBlock.gif 
InBlock.gif namespace Silverlight20.Interactive 
InBlock.gif
InBlock.gif         public partial  class Mouse : UserControl 
InBlock.gif        { 
InBlock.gif                 public Mouse() 
InBlock.gif                { 
InBlock.gif                        InitializeComponent(); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 void ellipse_MouseEnter( object sender, MouseEventArgs e) 
InBlock.gif                { 
InBlock.gif                        ellipse.Fill =  new SolidColorBrush(Colors.Yellow); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 void ellipse_MouseLeave( object sender, MouseEventArgs e) 
InBlock.gif                { 
InBlock.gif                        ellipse.Fill =  new SolidColorBrush(Colors.Red); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void ellipse_MouseLeftButtonUp( object sender, MouseButtonEventArgs e) 
InBlock.gif                { 
InBlock.gif                        ellipse.Fill =  new SolidColorBrush(Colors.Yellow); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void ellipse_MouseLeftButtonDown( object sender, MouseButtonEventArgs e) 
InBlock.gif                { 
InBlock.gif                        ellipse.Fill =  new SolidColorBrush(Colors.Blue); 
InBlock.gif 
InBlock.gif                         // MouseButtonEventArgs.Handled - 此事件是否已被处理 
InBlock.gif                         //         false - 未被处理,事件的路由为向上冒泡 
InBlock.gif                         //         true - 已被处理,事件的路由为不再冒泡 
InBlock.gif                        e.Handled =  true
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void StackPanel_MouseLeftButtonDown( object sender, MouseButtonEventArgs e) 
InBlock.gif                { 
InBlock.gif                         // 如果鼠标单击 rectangle 对象,则 会 执行到此句 
InBlock.gif                         // 如果鼠标单击 ellipse 对象,则 不会 执行到此句,因为之前 ellipse 对象的 MouseLeftButtonDown 事件中已经设置 e.Handled = true ,所以事件不会冒泡至此 
InBlock.gif                        ellipse.Fill =  new SolidColorBrush(Colors.Black); 
InBlock.gif                } 
InBlock.gif                 
InBlock.gif 
InBlock.gif 
InBlock.gif                 // 是否正在捕获鼠标 
InBlock.gif                 private  bool _isMouseCaptured; 
InBlock.gif 
InBlock.gif                 // 鼠标垂直方向上的坐标 
InBlock.gif                 private  double _mouseY; 
InBlock.gif 
InBlock.gif                 // 鼠标水平方向上的坐标 
InBlock.gif                 private  double _mouseX; 
InBlock.gif 
InBlock.gif                 private  void rectangle_MouseLeftButtonDown( object sender, MouseButtonEventArgs e) 
InBlock.gif                { 
InBlock.gif                         // MouseButtonEventArgs.GetPosition() - 鼠标相对于指定元素的坐标 
InBlock.gif                        _mouseY = e.GetPosition( null).Y; 
InBlock.gif                        _mouseX = e.GetPosition( null).X; 
InBlock.gif 
InBlock.gif                         // CaptureMouse() - 在指定的元素上捕获鼠标 
InBlock.gif                        rectangle.CaptureMouse(); 
InBlock.gif                        _isMouseCaptured =  true
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 public  void rectangle_MouseMove( object sender, MouseEventArgs e) 
InBlock.gif                { 
InBlock.gif                         if (_isMouseCaptured) 
InBlock.gif                        { 
InBlock.gif                                 // 移动前和移动后的鼠标 垂直方向 和 水平方向 的位置的差值 
InBlock.gif                                 double v = e.GetPosition( null).Y - _mouseY; 
InBlock.gif                                 double h = e.GetPosition( null).X - _mouseX; 
InBlock.gif 
InBlock.gif                                 // 移动后的 rectangle 对象相对于 Canvas 的坐标 
InBlock.gif                                 double newTop = v + ( double)rectangle.GetValue(Canvas.TopProperty); 
InBlock.gif                                 double newLeft = h + ( double)rectangle.GetValue(Canvas.LeftProperty); 
InBlock.gif 
InBlock.gif                                 // 设置 rectangle 对象的位置为新的坐标. 
InBlock.gif                                rectangle.SetValue(Canvas.TopProperty, newTop); 
InBlock.gif                                rectangle.SetValue(Canvas.LeftProperty, newLeft); 
InBlock.gif 
InBlock.gif                                 // 更新鼠标的当前坐标 
InBlock.gif                                _mouseY = e.GetPosition( null).Y; 
InBlock.gif                                _mouseX = e.GetPosition( null).X; 
InBlock.gif                        } 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void rectangle_MouseLeftButtonUp( object sender, MouseButtonEventArgs e) 
InBlock.gif                { 
InBlock.gif                         // ReleaseMouseCapture() - 如果指定的元素具有鼠标捕获,则释放该捕获 
InBlock.gif                        rectangle.ReleaseMouseCapture(); 
InBlock.gif                        _isMouseCaptured =  false
InBlock.gif                } 
InBlock.gif        } 
InBlock.gif}
 
 
2、Keyboard.xaml
<!-- 
KeyDown - 鼠标按下时触发的事件 
KeyUp - 鼠标按下并放开时触发的事件 
--> 
<!-- 
KeyDown和KeyUp均为向上冒泡的路由事件,本例的事件路由为:TextBox -> Canvas -> UserControl 
--> 
<UserControl x:Class="Silverlight20.Interactive.Keyboard" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    
        x:Name="userControl" 
        KeyDown="userControl_KeyDown"> 
         
        <Canvas> 
                         
                <TextBox x:Name="textBox" Text="TextBox" /> 
                 
        </Canvas> 
         
</UserControl>
 
Keyboard.xaml.cs
InBlock.gif using System; 
InBlock.gif using System.Collections.Generic; 
InBlock.gif using System.Linq; 
InBlock.gif using System.Net; 
InBlock.gif using System.Windows; 
InBlock.gif using System.Windows.Controls; 
InBlock.gif using System.Windows.Documents; 
InBlock.gif using System.Windows.Input; 
InBlock.gif using System.Windows.Media; 
InBlock.gif using System.Windows.Media.Animation; 
InBlock.gif using System.Windows.Shapes; 
InBlock.gif 
InBlock.gif namespace Silverlight20.Interactive 
InBlock.gif
InBlock.gif         public partial  class Keyboard : UserControl 
InBlock.gif        { 
InBlock.gif                 public Keyboard() 
InBlock.gif                { 
InBlock.gif                        InitializeComponent(); 
InBlock.gif 
InBlock.gif                         this.Loaded +=  new RoutedEventHandler(Keyboard_Loaded); 
InBlock.gif 
InBlock.gif                         // 为 UserControl 注册 KeyUp 事件 
InBlock.gif                        userControl.KeyUp +=  new KeyEventHandler(userControl_KeyUp); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 void Keyboard_Loaded( object sender, RoutedEventArgs e) 
InBlock.gif                { 
InBlock.gif                         // 让 UserControl 获得焦点,这样该 UserControl 内的元素才能监听到键盘事件 
InBlock.gif                        userControl.Focus(); 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void userControl_KeyDown( object sender, KeyEventArgs e) 
InBlock.gif                { 
InBlock.gif                         // 获取 textBox 对象的相对于 Canvas 的 x坐标 和 y坐标 
InBlock.gif                         double x = ( double)textBox.GetValue(Canvas.LeftProperty); 
InBlock.gif                         double y = ( double)textBox.GetValue(Canvas.TopProperty); 
InBlock.gif 
InBlock.gif                         // KeyEventArgs.Key - 与事件相关的键盘的按键 [System.Windows.Input.Key枚举] 
InBlock.gif                         switch (e.Key) 
InBlock.gif                        { 
InBlock.gif                                 // 按 Up 键后 textBox 对象向 上 移动 1 个像素 
InBlock.gif                                 // Up 键所对应的 e.PlatformKeyCode == 38    
InBlock.gif                                 // 当获得的 e.Key == Key.Unknown 时,可以使用 e.PlatformKeyCode 来确定用户所按的键 
InBlock.gif                                 case Key.Up: 
InBlock.gif                                        textBox.SetValue(Canvas.TopProperty, y - 1); 
InBlock.gif                                         break
InBlock.gif 
InBlock.gif                                 // 按 Down 键后 textBox 对象向 下 移动 1 个像素 
InBlock.gif                                 // Down 键所对应的 e.PlatformKeyCode == 40 
InBlock.gif                                 case Key.Down: 
InBlock.gif                                        textBox.SetValue(Canvas.TopProperty, y + 1); 
InBlock.gif                                         break
InBlock.gif 
InBlock.gif                                 // 按 Left 键后 textBox 对象向 左 移动 1 个像素 
InBlock.gif                                 // Left 键所对应的 e.PlatformKeyCode == 37 
InBlock.gif                                 case Key.Left: 
InBlock.gif                                        textBox.SetValue(Canvas.LeftProperty, x - 1); 
InBlock.gif                                         break
InBlock.gif 
InBlock.gif                                 // 按 Right 键后 textBox 对象向 右 移动 1 个像素 
InBlock.gif                                 // Right 键所对应的 e.PlatformKeyCode == 39    
InBlock.gif                                 case Key.Right: 
InBlock.gif                                        textBox.SetValue(Canvas.LeftProperty, x + 1); 
InBlock.gif                                         break
InBlock.gif 
InBlock.gif                                 default
InBlock.gif                                         break
InBlock.gif                        } 
InBlock.gif 
InBlock.gif                         // 同上:Key.W - 向上移动; Key.S - 向下移动; Key.A - 向左移动; Key.D - 向右移动 
InBlock.gif                         switch (e.Key) 
InBlock.gif                        { 
InBlock.gif                                 // KeyEventArgs.Handled - 是否处理过此事件 
InBlock.gif 
InBlock.gif                                 // 如果在文本框内敲 W ,那么文本框会向上移动,而且文本框内也会被输入 W 
InBlock.gif                                 // 如果只想移动文本框,而不输入 W ,那么可以设置 KeyEventArgs.Handled = true 告知此事件已经被处理完毕 
InBlock.gif                                 case Key.W: 
InBlock.gif                                        textBox.SetValue(Canvas.TopProperty, y - 1); 
InBlock.gif                                        e.Handled =  true
InBlock.gif                                         break
InBlock.gif                                 case Key.S: 
InBlock.gif                                        textBox.SetValue(Canvas.TopProperty, y + 1); 
InBlock.gif                                        e.Handled =  true
InBlock.gif                                         break
InBlock.gif                                 case Key.A: 
InBlock.gif                                        textBox.SetValue(Canvas.LeftProperty, x - 1); 
InBlock.gif                                        e.Handled =  true
InBlock.gif                                         break
InBlock.gif                                 case Key.D: 
InBlock.gif                                        textBox.SetValue(Canvas.LeftProperty, x + 1); 
InBlock.gif                                        e.Handled =  true
InBlock.gif                                         break
InBlock.gif                                 default
InBlock.gif                                         break
InBlock.gif                        } 
InBlock.gif                } 
InBlock.gif 
InBlock.gif                 private  void userControl_KeyUp( object sender, KeyEventArgs e) 
InBlock.gif                { 
InBlock.gif                         /* 
InBlock.gif                        System.Windows.Input.Keyboard.Modifiers - 当前按下的辅助键 [System.Windows.Input.ModifierKeys枚举] 
InBlock.gif                                ModifierKeys.None - 无 
InBlock.gif                                ModifierKeys.Alt - Alt 键 
InBlock.gif                                ModifierKeys.Control - Ctrl 键 
InBlock.gif                                ModifierKeys.Shift - Shift 键 
InBlock.gif                                ModifierKeys.Windows - Windows 键 
InBlock.gif                                ModifierKeys.Apple - Apple 键(苹果电脑) 
InBlock.gif                        */
 
InBlock.gif 
InBlock.gif                         // 按 Ctrl + M 则将 textBox 的位置设置为其初始位置 
InBlock.gif                         if (System.Windows.Input.Keyboard.Modifiers == ModifierKeys.Control && e.Key == Key.M) 
InBlock.gif                        { 
InBlock.gif                                textBox.SetValue(Canvas.LeftProperty, 0d); 
InBlock.gif                                textBox.SetValue(Canvas.TopProperty, 0d); 
InBlock.gif                        } 
InBlock.gif                } 
InBlock.gif        } 
InBlock.gif}
 
 

     本文转自webabcd 51CTO博客,原文链接: http://blog.51cto.com/webabcd/343044 ,如需转载请自行联系原作者


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值