Урок 34. Анимация из двух картинок

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

В предыдущем уроке мы создали эффект анимации введением переменных в параметры графического метода.

Для управления перерисовкой изображения с новыми параметрами использовался элемент управления Timer. Через определенный интервал времени он вызывал метод Refresh, обновляя изображение на экране.

В этом уроке для создания анимации мы будем использовать элементы управления PictureBox (Графическое поле) и Timer (Таймер).

Элемент управления PictureBox используется для отображения графических файлов, содержащих последовательные кадры изображения, а Timer (Таймер) — для смены кадров на экране через определенный интервал времени.

Проект «Два кадра»

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

Ход выполнения проекта

1. 1. В системе программирования Visual Basic.NET создайте новый проект под именем «Два кадра».
   2. Установите на форме два графических поля PictureBox1 и PictureBox2.
   3. В PictureBox1 поместить рисунок с первым кадром изображения, в PictureBox2 – рисунок со вторым кадром.Для того чтобы выбрать нужное изображение:
      • Выделите элемент управления PictureBox на форме.
      • Настройте свойство Image, щелкнув на кнопке с многоточием. В открывшемся диалоговом окне выберите нужный графический файл.
   4. Для того чтобы графическая область приняла форму рисунка, измените значение свойства SizeMode графического поля на AutoSize.
   5. Для осуществления  анимации, установите на форме два таймера, по одному таймеру для каждой  картинки.
   6. В настройках первого таймера устанавливаем следующие свойства:
      • Interval: 400
      • Enabled: True

      Интервал определяет, через какое время будет происходить смена кадров. Если установим меньшее значение, то смена кадров будет производиться быстрее (глаз будет подмигивать чаще).

      Устанавливая значение True для Enabled мы включаем первый таймер.

1. Двойным щелчком откройте обработчик события Timer1_Tick для первого таймера и запишите следующий код:

    PictureBox1.Visible = False 'сделать 1 картинку невидимой
    Timer1.Enabled = False      'вюкл. первый таймер
    PictureBox2.Visible = True  'сделать  2 картинку видимой 
    Timer2.Enabled = True       'включить второй таймер
    Timer2.Interval = 400

2. Программный код второго таймера код будет тот-же, только нужно поменять местами номера 1 и 2.Получится следующий код:

    PictureBox2.Visible = False 'сделать 2 картинку невидимой
    Timer2.Enabled = False      'вюкл. второй таймер
    PictureBox1.Visible = True  'сделать 1 картинку невидимой
    Timer1.Enabled = True       'включить первый таймер
    Timer1.Interval = 400

3. Весь код готов. Теперь Вы можете запустить программу и проверить, как она работает. Вы видите, что картинка анимирована.

В этом уроке мы создали анимацию на Visual basic.NET с помощью 2-х картинок.

Задание для самостоятельного выполнения. Создать анимацию прыгающего смайлика из 6 кадров.

Для выполнения задания можно использовать приведенные ниже картинки.

Картинки сохраните на своем компьютере в виде графических файлов.
Урок в видеоформате:

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