Оригинал англоязычного поста: Day #1: Mouse Events in Silverlight
В своем первом посте «31 день с Silverlight», мы сосредоточимся на обработчиках событий мыши. В случае интерактивных приложений, вы всегда желаете знать, когда пользователи работают с вашим приложением при помощи мыши. Это руководство расскажет о различных событиях мыши, и о том, как их использовать. Итак, давайте же сделаем первый шаг, на пути к освоению этой не сложной, но очень интересной темы
Событие MouseEnter
Я собираюсь продемонстрировать работу этого события на двух уровнях. Первым будет событие MouseEnter по всему Silverlight-контролу. Это событие будет возбуждено, когда курсор мыши входит в пространство, занимаемое Silverlight-контролом. Второе событие будет срабатывать при наведении мыши на круг, находящийся середине пользовательского контрола. Вот наш начальный XAML код.
<UserControl x:Class="SilverlightMouseEvents.MouseEnterDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300">
<Grid x:Name="LayoutRoot" Background="White">
<Ellipse x:Name="myEllipse" Fill="Blue" Width="150" Height="150" />
</Grid>
</UserControl>
Теперь я добавлю обработчики событий в XAML, и покажу вам, как сделать это в C# коде. Вот измененный XAML код вместе с добавленными обработчиками событий.
<UserControl x:Class="SilverlightMouseEvents.MouseEnterDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300" MouseEnter="UserControl_MouseEnter">
<Grid x:Name="LayoutRoot" Background="White">
<Ellipse x:Name="myEllipse" Fill="Blue" Width="150" Height="150" MouseEnter="myEllipse_MouseEnter" />
</Grid>
</UserControl>
Теперь нам необходимо перейти на code-behind файл кодом на C#, для реализации обработчика событий. Как только я создал обработчиков событий в XAML коде, студия автоматически создала для меня заготовки методов обработки событий в C# коде. Вот как выглядит первоначальное содержимое C# code-behind файла:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseEnterDemo : UserControl
{
public MouseEnterDemo()
{
InitializeComponent();
}
private void UserControl_MouseEnter(object sender, MouseEventArgs e)
{
}
private void myEllipse_MouseEnter(object sender, MouseEventArgs e)
{
}
}
}
Для того, чтобы сохранить разумной длину этого поста, я не буду делать ничего сложного в моих обработчиках событий, но я покажу вам, как изменить цвет эллипса. Я добавил одну строку кода в каждый метод, и каждый из них закрашивает эллипс другим цветом. Сейчас, когда мы перемещаем курсор мыши в области Silverlight приложения — круг будет залит зеленым цветом, а когда курсор мыши окажется внутри круга — фигура будет закрашена пурпурным.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseEnterDemo : UserControl
{
public MouseEnterDemo()
{
InitializeComponent();
}
private void UserControl_MouseEnter(object sender, MouseEventArgs e)
{
myEllipse.Fill = new SolidColorBrush(Colors.Green);
}
private void myEllipse_MouseEnter(object sender, MouseEventArgs e)
{
myEllipse.Fill = new SolidColorBrush(Colors.Purple);
}
}
}
Событие MouseLeave
Это событие работает практически точно также, как и событие MouseEnter. MouseLeave срабатывает тогда, когда курсор мыши ПОКИДАЕТ некую область. Что еще можно сюда добавить, а? На этот раз, однако, я вообще не делал изменений в моем XAML коде. Так вот, еще раз привожу начальный XAML код.
<UserControl x:Class="SilverlightMouseEvents.MouseLeaveDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300">
<Grid x:Name="LayoutRoot" Background="White">
<Ellipse x:Name="myEllipse" Fill="Blue" Width="150" Height="150" />
</Grid>
</UserControl>
На этот раз я сделаю все в C#-коде. Я добавлю обработчики событий в момент инициализации приложения. Вот мое окончательное решение на C#:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseLeaveDemo : UserControl
{
public MouseLeaveDemo()
{
InitializeComponent();
this.MouseLeave += new MouseEventHandler(MouseLeaveDemo_MouseLeave);
myEllipse.MouseLeave += new MouseEventHandler(myEllipse_MouseLeave);
}
void myEllipse_MouseLeave(object sender, MouseEventArgs e)
{
myEllipse.Fill = new SolidColorBrush(Colors.Purple);
}
void MouseLeaveDemo_MouseLeave(object sender, MouseEventArgs e)
{
myEllipse.Fill = new SolidColorBrush(Colors.Green);
}
}
}
Событие MouseLeftButtonDown
В этом случае, я продолжаю использовать тот же самый XAML код. Единственным изменением является ссылка на наш новый класс MouseLeftButtonDownDemo из XAML кода нашего юзер-контрола. Я уже показал, как использовать обработчики событий как в XAML, так и в C# коде. Вы уже видели XAML, так что я просто покажу только C# код.
Событие MouseLeftButtonDown, как вы уже догадались, срабатывает при нажатии левой кнопки мыши Пожалуйста, обратите внимание, что код этого примера так же охватывает пример события MouseLeftButtonUp, которое рассматривается ниже, и то, что значительной разницы между ними нет. Это будет особенно очевидно, когда мы займемся реализацией Drag & Drop. Вот пример добавления события MouseLeftButtonDown в наш код.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseLeftButtonDownDemo : UserControl
{
public MouseLeftButtonDownDemo()
{
InitializeComponent();
this.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftButtonDownDemo_MouseLeftButtonDown);
myEllipse.MouseLeftButtonDown += new MouseButtonEventHandler(myEllipse_MouseLeftButtonDown);
}
void myEllipse_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
myEllipse.Fill = new SolidColorBrush(Colors.Green);
}
void MouseLeftButtonDownDemo_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
LayoutRoot.Background = new SolidColorBrush(Colors.Purple);
}
}
}
Событие MouseLeftButtonUp
До сих пор мы создавали отдельные методы-обработчики событий для каждого отдельного события. Во множестве случаев, вы обязательно захотите, чтобы разные элементы управления вызывали один и тот же метод обработки событий, чтобы каждый раз не писать один и тот же код обработки событий. В следующем примере, я добавлю еще один круг внутрь StackPanel. Обе эти фигуры будут менять свой фон на оранжевый. Вот наш новый, дополненный, XAML код:
<UserControl x:Class="SilverlightMouseEvents.MouseLeftButtonUpDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300">
<StackPanel x:Name="LayoutRoot" Background="White" Orientation="Horizontal" HorizontalAlignment="Center" >
<Ellipse x:Name="myEllipse" Fill="Blue" Width="150" Height="150" />
<Ellipse x:Name="myEllipse2" Fill="Red" Width="150" Height="150" />
</StackPanel>
</UserControl>
Теперь мы добавим обработчик события MouseLeftButtonUp в нашем C# коде:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseLeftButtonUpDemo : UserControl
{
public MouseLeftButtonUpDemo()
{
InitializeComponent();
myEllipse.MouseLeftButtonUp += new MouseButtonEventHandler(Ellipse_MouseLeftButtonUp);
myEllipse2.MouseLeftButtonUp += new MouseButtonEventHandler(Ellipse_MouseLeftButtonUp);
}
void Ellipse_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
Ellipse myCircle = sender as Ellipse;
myCircle.Fill = new SolidColorBrush(Colors.Orange);
}
}
}
Как видите, в теперь наш обработчик состоит из двух строк кода. Теперь нам необходимо получить ссылку на эллипс, который на самом деле вызвал метод-обработчик. Параметр «sender» содержит эту информацию, так что, с его помощью мы и получаем ссылку на эллипс, и заполняем фигуру необходимым цветом.
Событие MouseMove
В этом последнем примере, мы используем событие MouseMove. Это событие срабатывает каждый раз, когда курсор мыши меняет свои координаты. Вы можете контролировать перемещение мыши как по всей площади приложения, так и для конкретного элемента. В любом случае, вы можете сделать довольно много полезных вещей при помощи этого события, в том числе и реализовать перетаскивания элементов (Drag and Drop). (Drag and Drop мы рассмотрим в будущем посте).
Мой XAML настоящее время состоит из двух TextBox'ов на странице. Первый я, ловко, назвал Xbox, а второй — Ybox. Мы будем отображать новые X и Y координаты мыши в этих полях, каждый раз, в момент перемещения пользователем курсора мыши.
<UserControl x:Class="SilverlightMouseEvents.MouseMoveDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300" VerticalAlignment="Center">
<StackPanel x:Name="LayoutRoot" Background="White">
<TextBox x:Name="Xbox" Width="200" Height="35" Text="X" />
<TextBox x:Name="Ybox" Width="200" Height="35" Text="Y"/>
</StackPanel>
</UserControl>
Сейчас C# code behind файл выглядит не слишком сложными. В данном примере мы используем параметр MouseEventArgs, от которого мы получим текущие координаты мыши. После чего, просто запишем значения координат в текстовые поля.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SilverlightMouseEvents
{
public partial class MouseMoveDemo : UserControl
{
public MouseMoveDemo()
{
InitializeComponent();
this.MouseMove += new MouseEventHandler(MouseMoveDemo_MouseMove);
}
void MouseMoveDemo_MouseMove(object sender, MouseEventArgs e)
{
Xbox.Text = e.GetPosition(null).X.ToString();
Ybox.Text = e.GetPosition(null).Y.ToString();
}
}
}
Резюме
Это был краткий обзор событий мыши, которые доступны вам в Silverlight. Используя их вместе, можно создать очень интерактивный и динамичный интерфейс для пользователя. В завтрашнем посте, мы поговорим об интересных способах работы с экраном в Silverlight. И не только о возможности перехода с одного XAML файла на другой, но и о том, как реализовать PowerPoint-подобные переходы с одного экрана на другой.
Такой тип программиста может успешно сыграть роль Гэндальфа во "Властелине колец". У него (или у нее! :) длинная борода по колено, глупая шляпа; может носить плащ или накидку зимой. К счастью для команды, на рабочем месте, это адепт белой магии, прямо как Гэндальф. К несчастью для команды, они должны будут терпеть часы рассказов Гэндальфа о том, как он или она шел в гору, по снегу, чтобы доставить перфокарты в далекий вычислительный центр. Гэндальф ¬¬– это ваш наилучший ударник IT-шного труда, но если вы попробуйте оставить его позади команды – это вызовет отчаяние.
В любой другой профессии, Мученик – это обычный "трудоголик". Но в области разработки, мученик выходит за эти рамки в другое измерение. По крайней мере, трудоголики уходят домой, в душ – и спать. А мученики гордятся тем, что просыпаться на рабочем столе среди пустых коробок из-под пиццы. Проблема в том, что никто не просил Мученика так работать. И он или она пытается заставить остальную часть команды почувствовать себя виноватыми, такими фразами как: "Да, пойду я домой, хотя бы пообедаю. Сегодня ночью закончил с участком кода, на который отводились ближайшие три недели.
Следите за Фанатиком. Если он или она настигнет вас врасплох, и прижмет в угол, то вы будете обречены, прослушать трехчасовую лекцию о превосходстве Opera по сравнению с Firefox, или почему Playstation 3 лучше, чем XB 360. На рабочем столе Фанатика разложены плакаты, фигурки и другие безделушки, связанные с его навязчивыми идеями, скорее всего, привезенные из Японии. С фанатиками невозможно иметь дело, они тратят настолько много времени на свою одержимость (внутри и вне офиса), что они совершенно не понимают, когда нужно выполнять работу, для которой их наняли.
Это человек около сорока лет, который живет в далеком к 1984 году. Длинные волосы, потертые стираные джинсы и бандана. На протяжении рабочего дня, 
Ниндзя это самый ценный человек в вашей команде, хотя об этом никто и не знает. Подобно легендарным самураям, вы не знаете находиться ли он в офисе, работает ли он, но вы обнаруживаете доказательства, представленные в первой половине дня. Вы проверяете систему управления версиями и видите, что в 4 утра Ниндзя решил ту проблему в коде, на которую вы планировали потратить всю следующую неделю, и вы даже не знаете, что Ниндзя было известно о проекте! Видите ли, пока вы были на еще одном совещании, Ниндзя работал.
Теоретик знает все, что нужно знать о программировании. Он или она может посвятить четыре часа лекции об истории непонятного языка программирования или предоставление доказательств того, что код, который вы написали не совсем оптимальной и вполне может потратить три лишние наносекунд для запуска. Проблема в том, что теоретик не знает ничего о процессе разработки программного обеспечения. Теоретик пишет код, который настолько изыскан, что простые смертные просто не могут найти в нем смысл. Его или ее любимая техника программирования – это рекурсия, и каждый блок кода настолько разогнан до максимума... в ущерб срыва сроков и нечитабельности.
Ковбой – это стихия, которую нельзя остановить. Он или она – это почти всегда эффективный программист, который может сделать работу два или три раза быстрее, чем кто-либо еще. Проблема в том, что, по крайней мере, половину всей этой скорости происходит путем срезания углов. Ковбой считает, что заливка кода в систему контроля версий занимает слишком много времени, хранения конфигурационных данных вне самого кода занимает слишком много времени, общение с кем-либо занимает слишком много времени ... ну, вы поняли идею.
Вы видели фильмы, где единственным Коммандос, сброшенный с воздуха в глубокий тыл противника, выходит оттуда с секретными стратегическими документами, планами противника, и спасает сотни военнопленных? В команде разработчиков ПО -- это Десантник. Десантник -- это последняя надежда, чтобы спасти умирающий проект. У десантников не хватает терпения для того, чтобы работать на долгосрочной основе, но их лучшие качество -- это способностью, быстро изучить незнакомый код и как работать с ним. Другие программисты могут потратить недели или месяцы для того, чтобы изучить все необходимое о проекте для эффективной работы над ним. У Десантника это займет несколько часов или дней. Десантники могут не изучать всего необходимого для работы с основным кодом, но их скорость и высокая обучаемость помогут преуспеть там, где вся команда может потерпеть неудачу.
"Достаточно хорошо" это лучшее, что вы можете получить от Посредственного Человека. Он или она всегда тратят больше времени для создания худшего кода, чем у кто-либо в команде. "Тише едешь – дальше будешь" – так можно описать проекты П.Ч. Но П.Ч. всегда просто "достаточно хорош" чтобы не быть уволенным.
Независимо от того в какой среде вы работаете , евангелист настаивает на том, что он может быть улучшена путем выброса всех ваших текущих инструментов и процессов и замены их на что-то другое. Евангелист – это противоположность Теоретика. Евангелиста откровенен, знает очень много о разработке программного обеспечения, но, программирует очень мало .
