Macromedia Flash Professional 8. Графика и анимация

Параметры Х и Y определяют соответственно горизонтальную и вертикальную координаты конечной точки кривой (начальной же точкой является, опять же, точка, в которой в данный момент находится программное перо). А параметры АХ и AY указывают горизонтальную и вертикальную координаты точки искривления. Все эти координаты отсчитываются, опять же, относительно точки отсчета клипа.

Вот пример сценария, рисующего нечто похожее на окружность:

with (_root.paintBox) {

moveTo(300, 300);

curveTo(400, 300, 400, 200);

curveTo(400, 100, 300, 100);

curveTo(200, 100, 200, 200);

curveTo(200, 300, 300, 300);

}

Увы — более удобных способов программно нарисовать окружность Flash не предлагает. Приходится или создавать образец, рисовать в нем окружность и программно порождать от него экземпляры, или выходить из положения вышеописанным способом. Хотя, можно еще описать окружность в виде функции и нарисовать ее график.

Для рисования линии, неважно — прямой или кривой, будут использованы текущие параметры ее стиля: толщина, цвет и прозрачность. Задание текущего стиля выполняется с помощью метода linestyle. Он вызывается вот так:

<Клип>.lineStyle([<Толщина линии>, [<Цвет линии>,

[<Прозра чность линии>]]]);

Толщина линии задается в пикселах, от 0 до 255. Если она не задана, то линия нарисована не будет. Цвет линии задается в формате 0xRRGGBB, где RR — доля красного цвета, GG — зеленого и ВВ — синего соответственно. Пример задания цвета: 0x22FF44. Прозрачность линии может принимать значения от 0 (полная прозрачность) до 100 (полная непрозрачность).

Важный момент: перед рисованием любой линии лучше с помощью метода linestyle задать ее стиль. Flash сохранит его и сделает текущим; все последующие линии будут нарисованы с использованием текущего стиля.

Поэтому сценарий, рисующий треугольник, нам придется переписать:

with (_root.paintBox) {

lineStyle(2, 0x000000);

moveTo(100, 200);

lineTo (300, 200);

lineTo(200, 100);

lineTo (100, 200);

}

Здесь мы с помощью метода linestyle задали стиль линии: толщина в 2 пиксела и черный цвет. После этого треугольник уж точно будет нарисован.

А теперь давайте посмотрим на только что нарисованный треугольник и подумаем: чего же в нем не хватает? В главе 3 мы выяснили, что, если нарисовать замкнутую фигуру, Flash автоматически создаст заливку; при этом не имеет значения, какой инструмент рисования использовался. Здесь же заливки нет. Почему?

Вероятно, разработчики Flash решили, что, раз уж мы пользуемся сценариями ActionScript, значит, мы достаточно квалифицированные программисты, и нам не нужна помощь. Поэтому нам придется самостоятельно создавать заливку для нарисованных программно фигур.

Для создания заливки служат два метода. Первый из них — beginFill — указывает Flash, что с этого момента нужно отслеживать все операции программного рисования и после создания замкнутой фигуры учесть на будущее, что ей нужна заливка. Второй — endFill — прекращает отслеживание операций рисования и рисует собственно заливку (если, конечно, ее можно нарисовать, т. е. если нарисованный нами контур полностью или частично замкнут).

Формат вызова метода beginFill такой:

<Клип>.beginFill([<Цвет заливки>, [<Прозрачность заливки>]]);

Цвет заливки задается в том же формате 0xRRGGBB, а прозрачность — значением от 0 до 100. Если эти параметры не заданы, будут использованы текущие значения цвета и прозрачности заливки — те, что были указаны при предыдущем вызове метода beginFill. Поэтому при самом первом вызове этого метода нужно указать оба его параметра.

Метод endFill не принимает ни одного параметра:

<Клип>.endFill;

Теперь еще раз перепишем сценарий, чтобы он рисовал треугольник с заливкой:

with (_root.paintBox) {

lineStyle(2, 0x000000);

beginFill(0x222233, 100);

moveTo(100, 200);

lineTo(300, 200);

lineTo (200, 100);

lineTo(100, 200);

endFill ;

}

С помощью метода beginFill создается обычная, сплошная заливка. Если же нужно создать градиентную заливку, то придется воспользоваться методом beginGradientFill в паре с методом endFill. Полное описание этого метода приведено в интерактивной справке Flash.

Чтобы удалить все, что было нарисовано программно, нужно вызвать метод clear:

_root.paintBox.clear;

При этом будет также сброшен заданный с помощью метода linestyie стиль линий. Графика же, нарисованная вручную, удалена не будет.

Пример сценария, рисующего график функции

А теперь давайте попрактикуемся и напишем сценарий, рисующий график функции f(x) = х². Это, скорее, курьез, чем реально необходимый пример, но он поможет нам глубже изучить методы рисования объекта movieClip.

Сначала создадим новый документ Flash. И привяжем к единственному кадру анимации следующий сценарий:

var dx = 200;

// Величина отступа от левого края рабочего листа

var х = 0;

var у = 0;

// Временные переменные

// Каждая точка графика будет представлять собой небольшой квадрат с

// черной заливкой

lineStyle(1, 0x000000);

// Стиль линий контура этого квадрата

for(х = -20; х < 21; х++) {

// Используем цикл со счетчиком, чтобы вычислить значения функции

// для аргументов в пределах от -20 до 20

у = х * х;

// Вычисляем значение функции

beginFill(0x000000);

// Начинаем рисование заливки квадрата

// Рисуем квадрат

endFill ;

// Заканчиваем рисование заливки

}

Теперь запустим на воспроизведение готовый фильм в отдельном окне. Работает!

Правда, график наш рисуется вверх ногами. Чтобы исправить этот огрех, перепишем наш сценарий. Теперь он будет выглядеть вот так (добавленный и измененный код выделен полужирным шрифтом):

var dx = 200;

dy = 400;

// Величина отступа от верхнего края рабочего листа

var х = 0;

var у = 0;

lineStyle(1, 0x000000);

for(х = -20; х < 21; х++) {

у = х * х;

beginFill(0x000000);

moveTo(dx + х — 1, dy — у + 1);

lineTo(dx + x + 1, dy — у + 1);

lineTo(dx + x + 1, dy — у — 1);

lineTo(dx + х — 1, dy — у — 1);

lineTo(dx + x — 1, dy — у + 1);

endFill ;

}