Урок 28. Добавление анимации для объектов Windows Form

Урок из серии: «Программирование на Visual Basic.NET для школьников»

В предыдущем уроке  вы узнали, как можно анимировать рисунок, созданный с помощью графических методов Visual Basic.NET.

В этом уроке рассказывается, как перемещать на экране объекты Windows Form изменяя свойства Top и Left этих объектов, управлять скоростью анимации с помощью объекта таймер.

Мы  создадим проект, в котором с помощью командных кнопок можно будет управлять движением графического поля PictureBox, содержащего рисунок.

Справочная информация

Свойство Описание
Left Горизонтальная (по оси x) координата левого края объекта. Может быть использовано для горизонтального перемещения объекта (влево или вправо).
Top Вертикальная (по оси y) координата верхнего края объекта. Может быть использовано для вертикального перемещения объекта (вверх или вниз).
Location Координаты верхнего левого угла объекта. Может быть использовано для перемещения объекта в указанное место.

Чтобы переместить объект в горизонтальном направлении, нужно присвоить свойству Left объекта новое значение:

 объект.Left = по-горизонтали

здесь  объект — это имя объекта формы, который вы хотите переместить, а по-горизонтали — это новая горизонтальная (по оси x) координата левого края объекта, измеренная в пикселях.

Оператор программы

PictureBox1.Left = 300

перемещает объект PictureBox1 в точку, расположенную в 300 пикселях справа от левого края окна.

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

Оператор

PictureBox1.Left = PictureBox1.Left + 50
переместить объект PictureBox1 на 50 пикселей вправо.

Аналогично, вы можете изменить вертикальное положение объекта на форме, установив его свойство Top, или добавляя или вычитая пиксели из текущего значения свойства Top.

Чтобы переместить объект одновременно в вертикальном и горизонтальном направлении, можно  использовать комбинацию значений свойств Left и Top.

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

PictureBox1.Left = 300
PictureBox1.Top = 200

Если вы планируете делать много перемещений объекта (например, для создания анимационного эффекта), то вместо этих двух операторов рекомендуется использовать один оператор, изменяющий свойство Location объекта:

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

где  по-горизонтали, по-вертикали — координаты x и  y левого верхнего угла объекта в пикселях.

Например, оператор

PictureBox1.Location = New Point(300, 200)

перемещает объект PictureBox1 в точку с координатами (300, 200).

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

Например, операторы

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

перемещают объект PictureBox1 на 50 пикселей влево и на 40 пикселей вверх.

Проект  «Перемещение иконки»

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

Файл с графическим изображением скачать по прямой ссылке: //gospodaretsva.com/wp-content/uploads/2011/12/SUN.ico

  1. В среде программирования Bisual Basic.NET cоздайте проект с именем «Перемещение иконки»
  2. Разместите на форме:
    • две кнопки: Button1, Button2;
    • графическое поле PictureBox1-это объект программы, который вы будете анимировать;
    • таймер Timer1.

    Урок 28. Добавление анимации для объектов Windows Form

    Таймер будет управлять скоростью анимации. Вспомните, что таймер сам по себе не отображается на форме, так что он показывается под формой в области компонент, предназначенной для невидимых объектов.

  3. Установите для формы и элементов управления следующие свойства:
    Объект Свойство Значение
    Button1 Text Пореместить вверх
    Button2 Text Переместить вниз
    PictureBox1 Image «C:\Documents and Settings\Ученик\Мои документы\sun.ico»
    Width 20
    Height 20
    SizeMode StretchImage
    Timer1 Enabled False
    Interval 75
    Form1 Text Простая анимация
  4. Откройте редактор кода. Ниже строки «Код, автоматически созданный конструктором форм Windows» введите объявление переменной:
    Dim GoingUp As Boolean	'GoingUp хранит текущее направление

    Это объявление делает переменную GoingUp видимой для всех процедур событий формы.

    Используется переменную типа Boolean потому, что у нас в этой программе есть только два возможных направления перемещения — вверх и вниз.

  5. Для кнопки Переместить вверхв процедуре Button1_Click поместите следующий код:
    GoingUp = True  'направление перемещения - вверх
    Timer1.Enabled = True 'включить таймер
  6. Для кнопки Переместить вниз в процедуре  Button2_Click поместите код:
    GoingUp = False  'Направление перемещения - вниз
    Timer1.Enabled = True

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

  7. Отобразите форму, дважды щелкните мышью на объекте 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

    Как только таймер будет включен, программный код этой процедуры будет выполняться каждые 75 миллисекунд.

    Оператор ветвления проверяет значение логической переменной GoingUp.

    Если она имеет значение  True (направление перемещения —  вверх), значок солнца перемещается на 10 пикселей влево и на 10 пикселей вверх.

    Иначе значок перемещается вниз до тех пор, пока не будет достигнута граница формы.

    Нижняя граница вычисляется как разность между высотой формы Me.Size.Height (Объект Me представляет саму форму) и значением 75.

  8. Запустите проект. Щелкните на кнопке Переместить вверх. Значок солнца переместится по диагонали вверх, как показано ниже.Viisial-Basic.NET-Urok29-2

    Через некоторое время объект остановится около верхнего края формы.

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

В этом уроке вы узнали, как с помощью свойств Top,  Left,  Location и таймера можно анимировать объекты Windows Form.

В следующем уроке начнем создавать проект «Графический редактор».

Следующий урок: Проект Графический редактор.

До встречи на следующем уроке.

Подписаться
Уведомить о
guest

2 комментариев
Новые
Старые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии
Нияз
Нияз
7 лет назад

Да, спасибо adminу за пример использования таймера.

Людмила
Людмила
11 лет назад

Отличный урок. Спасибо