Бесплатные видео-уроки

Adobe Edge Animate

Создание графики, анимации и интерактивного контента для веб

  • бесплатно
  • перспективно
  • быстро
  • доступно

Создание прямоугольников со скругленными углами в Edge Animate

Создавать прямоугольники, прямоугольники со скругленными углами и эллипсы в Adobe Edge Animate очень просто. Собственно, это можно делать, используя всего лишь один инструмент Rectangle (Прямоугольник), просто настраивая его свойства определенным образом.

Прямоугольники со скругленными углами в Edge Animate

Чтобы убедиться в этом — создайте с его помощью несколько форм и проанализируйте их свойства в панели Properties.

Вы можете превратить обычный прямоугольник в прямоугольник со скругленными углами, настроив соответствующим образом его свойства в подразделе Corners панели Properties, как показано на картинке.

Скругление углов

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

Создание прямоугольников со скругленными углами

Создайте новый проект в Edge Animate.

Создайте прямоугольник и оставьте его выделенным. Выберите инструмент Transform (Трансформация — Q) в панели инструментов программы, затем наведите мышь на маленький ромбик в подразделе Corners (Углы). В результате Вы увидите подсказку с надписью Add Keyframe for Border Radii (Добавить ключевой кадр для радиусов контура).

Вверху подраздела есть 3 кнопки, пронумерованные как 1, 4, 8. Ниже этих кнопок находится квадрат, разделенный на 4 части тоже в виде кнопок. Каждая кнопка соответствует одному из углов прямоугольника. Рядом с каждым углом находится цифра, изначально установленная на 0.

Когда радиус угла равен 0, то углы у фигуры прямые. Кликните на цифре и потащите мышь право, чтобы скруглить угол. Число может быть только положительным, поэтому перетаскивание влево будет безрезультатным. Заметьте, что маленькие черные ромбики по углам фигуры перемещаются к центру. Эти ромбики — не что иное , как контрольные точки для радиусов углов. Вы можете перемещать их вручную для создания и настройки радиусов.

Контрольные точки управления скруглением углов

Верните настройки фигуры к исходным, чтобы она вновь превратилась в прямоугольник. Теперь кликните на кнопке верхнего правого угла в подразделе Corners. Измените числовое значение радиуса. В результате Вы увидите, что у фигуры правый верхний угол останется прямым, в то время как другие скруглятся. Когда кнопка угла нажата — это изолирует угол при изменении настроек скругления.

Еще раз верните настройки фигуры к исходным. Кликните правую верхнюю кнопку, чтобы снять изоляцию угла. Кликните кнопку с цифрой 4. Рядом с каждым углом появятся цифры. Теперь Вы можете настраивать скругление углов индивидуально, придавая им различную степень скругления. Это дает Вам возможность создавать фигуры различных форм, хотя, технически, они будут оставаться четырехугольниками!

Добавьте к этим трансформациям искажения и масштабирование и у Вас могут получиться действительно интересные эффекты.

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

Создание круга из прямоугольника с помощью скругления углов

Поэкспериментируйте со свойствами в подразделе Corners, превращая прямоугольники в овалы и круги. Вот пример преобразования квадрата в круг:

Кликните на инструменте Rectangle (Прямоугольник) и удерживая клавишу Shift нажатой создайте квадрат. Клавиша Shift помогает создавать фигуры с равными сторонами.

В подразделе Corners кликните на кнопке 1. В результате радиусы всех углов будут одинаковыми.

Кликните на поле с числом и потяните вправо до тех пор пока квадрат превратится в круг.

Вы можете изменять и настраивать свойства Вашего круга точно также, как и любого другого объекта в Edge Animate. Превратите его в эллипс или овал, искажая и масштабируя его. И, конечно же, Вы можете создавать фигуры, промежуточные между квадратом и кругом — квадрат со скругленными углами, например.

Теперь давайте научимся добавлять падающие тени к объектам на сцене.


Добавьте комментарий
bbcode:
[br]  [b][/b]  [i][/i]  [u][/u]
[img]link image[/img]
[color=colour][/color]
[url]link[/url]
[url=link]title[/url]
 
* Введите проверочный код
* Поля с красной звездочкой необходимо заполнить