Corona Урок 5 « Анимация и Переходы «Transition» ».

Поделиться.

Всем доброго времени суток , сегодня наш урок посвящен анимация и переходам.

Transition - это библиотека заготовлена командой разработчиков Corona для нашего с вами удобства, она позволяет создавать эффекты мерцания объекта, плавного перехода одного изображения в другое, эффект затухания, масштабирования, а также движения.

Начнем, Создадим новый проект, откроем в редакторе и подготовим его к работе.

Для начала, создадим Локальные переменные, переменные которые будут хранить в себе ширину и высоту экрана.

Локальные переменные - это переменные которые используются локально, если мы объявили локальную переменную в скрипте, то она может быть использована только этим скриптом, если мы объявили локальную переменную в функции, то она может быть использована только  этой функцией.

local X = display.contentWidth
local Y = display.contentHeight

Теперь, Добавим Фоновое изображение, скачайте изображение по ссылке ниже и поместите его в папку с проектом.

СКАЧАТЬ КАРТИНКУ

Затем, введите в редакторе следующий код:

local Ground = display.newImageRect("GrOne.jpg", X, Y )
Ground.x = X/2
Ground.y = Y/2

Если изображение не на весь экран, откройте файл config.lua он находится в папке с проектом и замените строчку  scale = "letterbox", на scale = "zoomEven",

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

Теперь, отрисуем нашу луну, для этого в редакторе введите код:

local Moon = display.newImageRect("moon.png", X/2, X/2)
Moon.x = X/2
Moon.y = Y/2

Заставим нашу луну мигать, для этого в редакторе введите этот код:

transition.blink( Moon, { time=1000 } )

Мы обратились к библиотеке transition, к функции blink ,она принимает два обязательных аргумента

1)объект который мы хотим заставить мигать.

2)Время (Частота мигания в миллисекундах).

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

local Sun = display.newImageRect("sun.png", X/2, X/2)
Sun.x = X/2
Sun.y = Y/2 

Установим прозрачность солнца на нулевое значение:

Sun.alpha = 0

и наконец введем саму функцию:

transition.dissolve( Moon, Sun, 5000)

Мы обратились к библиотеке transition, к функции dissolve ,она принимает два обязательных аргумента

1)начальный объект

2)конечный объект

3)Время перехода

Рассмотрим следующую функцию проявление, заменим последнюю строчку кода на:

Moon.alpha = 0
transition.fadeIn( Moon, { time=10000 } )

Мы сделали луну невидимой, обратились к библиотеке transition, к функции fadeIn ,она принимает два обязательных аргумента

1)объект который нужно проявить.

2)Время.

Следующая функция масштабирование, как по мне одна из самый клевых и востребованных. Замените две последние строчки кода на :

Moon.alpha = 1
transition.scaleBy( Moon, { xScale=2, yScale=2, time=10000 } )

Мы сделали луну полностью видимой, обратились к библиотеке transition, к функции scaleBy ,она принимает три обязательных аргумента

1)Конечный масштаб по X координате

2)Конечный масштаб по Y координате

3)Время масштабирования

Следующая функция перемещение объекта, заменим последнюю строчку кода на:

transition.to( Moon, {time=5000, x=(X/2), y=(Y/5)} )

мы обратились к библиотеке transition, к функции to ,она принимает два обязательных аргумента

1)Объект который нужно переместить

2)Свойства перемещения , минимальный набор {Время, Конечные координаты по X, Конечные координаты по Y} об остальных свойствах читайте на официальном сайте Corona Labs https://docs.coronalabs.com/api/library/transition/to

На этом все, Удачи 🙂


Поделиться.

Добавить комментарий

Войти с помощью: 

Ваш e-mail не будет опубликован. Обязательные поля помечены *