Добавление графики и эффектов анимации

Свойство Location

Чтобы переместить объект одновременно в вертикальном и горизонтальном направлении, довольно просто использовать комбинацию значений свойств Left и Top. Например, чтобы переместить объект области вывода изображений в координаты (300, 200), можно ввести следующий код программы:

PictureBox1.Left = 300
PictureBox1.Top = 200

Однако разработчики Visual Basic .NET не рекомендуют использовать два оператора программы для перемещения объекта, если вы планируете делать много перемещений объектов программы (например, если во время сложного анимационного эффекта вы планируете перемещать объекты сотни или тысячи раз). Вместо этого Microsoft рекомендует использовать свойство Location, имеющее синтаксис

объект .Location = New Point(по-горизонтали, по-вертикали)

где объект - это имя объекта, по-горизонтали - это горизонтальная координата по оси x, по-вертикали - это вертикальная координата по оси y, а Point - это структура, определяющая положение верхнего левого угла объекта в пикселях. Например, следующий оператор программы перемещает объект области вывода изображений в координаты (300, 200):

PictureBox1.Location = New Point(300, 200)

Чтобы с помощью свойства Location выполнить относительное перемещение, требуются свойства Location.X и Location.Y. Например, оператор программы

PictureBox1.Location = New Point(PictureBox1.Location.X - 50, _
PictureBox1.Location.Y - 40)

перемещает объект области вывода изображений формы на 50 пикселей влево и на 40 пикселей вверх. Хотя эта конструкция кажется несколько громоздкой, она является рекомендуемым способом перемещения объектов вашей формы во время выполнения программы.

Создание анимации с помощью объекта Timer

Фокус с созданием анимации в программе состоит в помещении в процедуру события таймера одного или нескольких изменений свойства Location. При этом через определенные интервалы времени таймер будет заставлять один или несколько объектов перемещаться по экрану. В "Циклы и таймеры" вы узнали о том, как использовать объект таймера для обновления раз в секунду простой утилиты часов так, что она отображала правильное время. Когда вы создаете анимацию, вы устанавливаете свойство Interval таймера на ускоренное обновление - 1/5 секунды (200 миллисекунд), 1/10 секунды (100 миллисекунд) или меньше. Точная скорость зависит от того, на сколько быстро с вашей точки зрения должна выполняться анимация.

Еще один фокус состоит в использовании свойств Top и Left и размера формы для определения краев этой формы. Использование в процедуре события этих значений позволит вам останавливать анимацию (отключать таймер), когда объект достигает границы формы. Используя свойство Top, свойство Left, свойства, содержащие размер формы, и структуру выбора If...Then или Select Case, вы можете заставить объект отскакивать от одного или нескольких краев формы.

Следующее упражнение демонстрирует, как вы можете с помощью свойства Location и объекта таймера анимировать область вывода изображений, содержащую значок солнца (Sun.ico). В этом упражнении для обнаружения верхнего края формы вы будете использовать свойство Top, а для обнаружения нижнего края - свойство Size.Height. Значок солнца будет перемещаться вверх-вниз между этими двумя границами каждый раз, когда вы щелкаете на кнопке.

Анимация значка Солнца на вашей форме

1. Щелкните на команде Close Solution (Закрыть решение) в меню File (Файл), а затем создайте в папке c:\vbnet03sbs\Гл.16 новый проект с именем My Moving Icon.
2. Используя элемент управления Button, нарисуйте в нижнем левом углу формы две кнопки.
3. Используя элемент управления PictureBox, нарисуйте в нижнем правом углу формы небольшой прямоугольный объект области вывода изображений. Это объект программы, который вы будете анимировать.
4. Сделайте двойной щелчок мышью на элементе управления Timer, находящемся на закладке Windows Forms окна Toolbox (Область элементов), чтобы добавить его в область компонент, находящуюся ниже формы. Таймер будет управлять скоростью анимации. Вспомните, что таймер сам по себе не отображается на форме, так что он показывается под формой в области компонент, предназначенной для невидимых объектов.

5. Установите для формы и объектов кнопки, области вывода изображений и таймера следующие свойства:

   Объект	Свойство	Установка
   Button1	Text	Переместить вверх
   Button2	Text	Переместить вниз
   PictureBox1	Image	c:\vbnet03sbs\Гл.16\sun.ico
   	SizeMode	StretchImage
   Timer1	Enabled	False
   	Interval	75
   Form1	Text	Простая анимация

   Когда вы установите эти свойства, ваша форма будет выглядеть примерно так, как показано на рисунке ниже.

   

   
   
6. Чтобы отредактировать процедуру события для кнопки Переместить вверх, сделайте на ней двойной щелчок мышью. В Редакторе кода появится процедура события Button1_Click.

7. Введите следующий код программы:

   GoingUp = True
   Timer1.Enabled = True

   Эта простая процедура события устанавливает переменную GoingUp на значение True и включает объект таймера. Реальный код программы для перемещения объекта области вывода изображений и определения правильного направления находится в процедуре события Timer1_Tick.

8. Прокрутите программный код формы в самый верх и под тегом "Windows Form Designer generated code" ("Код, автоматически созданный конструктором форм Windows") введите следующее объявление переменной:

   Dim GoingUp As Boolean		'GoingUp хранит текущее направление

   Это объявление переменной делает переменную GoingUp видимой для всех процедур событий формы. Я использовал переменную типа Boolean потому, что у нас в этой программе есть только два возможных направления перемещения - вверх и вниз.

9. Снова отобразите форму, дважды щелкните мышью на кнопке Переместить вниз, а затем введите в процедуре события Button2_Click следующий код программы:

   GoingUp = False
   Timer1.Enabled = True

   Эта процедура очень похожа на процедуру события Button1_Click, за исключением того, что она меняет направление на движение вниз.

10. Снова отобразите форму, дважды щелкните мышью на объекте Timer1, а затем введите в процедуре события Timer1_Tick следующий код программы:

    If GoingUp = True Then
    	'перемещаем область вывода изображений вверх
    	If PictureBox1.Top > 10 Then
    		PictureBox1.Location = New Point _
    		(PictureBox1.Location.X - 10, _
    		PictureBox1.Location.Y - 10)
    	End If
    	Else
    	'перемещаем область вывода изображений вниз
    	If PictureBox1.Top < (Me.Size.Height - 75) Then
    		PictureBox1.Location = New Point _
    		(PictureBox1.Location.X + 10, _
    		PictureBox1.Location.Y + 10)
    	End If
    End If

    Как только таймер будет включен, эта структура выбора If...Then будет выполняться каждые 75 миллисекунд. Первая строка процедуры проверяет, установлена ли переменная GoingUp типа Boolean на значение True, указывающее, что значок перемещается вверх по форме. Если она установлена на True, процедура перемещает объект области вывода изображений на 10 пикселей ближе к левому краю и на 10 пикселей ближе к верхнему краю формы.

    Если переменная GoingUp содержит значение False, структура выбора перемещает значок вниз. В этом случае объект области вывода изображений перемещается до тех пор, пока не будет достигнута граница формы. Высота формы может быть определена с помощью свойства Me.Size.Height. (Я вычитаю из высоты значение 75, так что значок не исчезает с формы за ее пределами.) Объект Me в этом примере представляет саму форму ( Form1 ).

    Как вы увидите при запуске программы, это перемещение дает значку анимационный эффект плавного перемещения. Чтобы заставить его перемещаться быстрее, нужно уменьшить значение Interval для объекта таймера. Чтобы заставить значок двигаться медленнее, измените параметр Interval на большее значение.