Виготовлення флеш малювання - портал про все цікаве в дизайні
undo = false; //означає, що скасовувати зараз нічого rep = false; //Поторять спочатку теж нічого
kolor = "0xFF0000";//дефолтний колір pole.instrument = 1;//дефолтний інструмент (пензель)
diam = 10; //розмір кисті smp.k._height = _root.diam; smp.k._w > al = 100; // Жорсткість пензля
Приступаємо до оформлення клавіш для вибору інструменту. Усередині кожного мувика робимо два кадри: перший – неактивна кнопка, другий – активна, перший кадр кожної вішаємо stop();
Інструментом за замовчуванням буде кисть, тому на кадр у часовій діаграмі додаємо
Зробимо перемикання інструментів. Не знаю хто як, а я звик вішати скрипти - обробники натискань на самі кнопки, так можна швидше їх знаходити. На кнопку кисть вішаємо:
on (rollOver) if (_root.pole.instrument != 1) gotoAndStop(2); > >
on (press) if (_root.pole.instrument != 1) gotoAndStop(3); > >
on (rollOut, releaseOutside) if (_root.pole.instrument != 1) gotoAndStop(1); > >
_root.i1.gotoAndStop(1); _root.i2.gotoAndStop(1); _root.i3.gotoAndStop(1); _root.pole.instrument=1; gotoAndStop(3); >
if (_root.pole.instrument != 2) gotoAndStop(2); > >
on (press) if (_root.pole.instrument != 2) gotoAndStop(3); > >
on (rollOut, releaseOutside) if (_root.pole.instrument != 2) gotoAndStop(1); > >
_root.i1.gotoAndStop(1); _root.i2.gotoAndStop(1); _root.i3.gotoAndStop(1); _root.pole.instrument = 2; gotoAndStop(3); >
if (_root.pole.instrument != 3) gotoAndStop(2); > >
on (press) if (_root.pole.instrument != 3) gotoAndStop(3); > >
on (rollOut, releaseOutside) if(_root.pole.instrument != 3) gotoAndStop(1); > >
on (release) _root.i1.gotoAndStop(1); _root.i2.gotoAndStop(1); _root.i3.gotoAndStop(1); _root.pole.instrument=3; gotoAndStop(3); >
Кнопки Скасування та Повтор матимуть три кадри: перший – активна кнопка, яку можна натиснути, другий – кнопка при наведенні на неї курсора, третій – неактивна кнопка. Спочатку зупиняємо кнопки на третьому кадрі. Далі приступимо до створення самого «движка» - скриптів для малювання. Вішатимемо їх на кліп pole. Для початку всередині кліпу pole ініціалізуємо дві змінні для зберігання кіл-ва кліпів і глибин. m = 0; n = 0;
Тепер починаємо писати обробник натискання кнопки миші на мувіку pole.on (press)
if (instrument == 1) < //якщо обрано кисть m++; // нарощуємо лічильник глибин _root.otm.gotoAndStop(1); //перекладаємо кнопку Скасування в активне становище _root.undo = true; // означає, що можна скасувати _root.norep(); // Функція, яку ми напишемо пізніше.
aa = this.createEmptyMovieClip("ff"+m, m); // створюємо новий кліп // переміщуємо його на початок координат aa._x = 0; aa._y = 0;
// запам'ятовуємо позицію курсора коли натиснули кнопку x = aa._xmouse y = aa._ymouse // застосовуємо налаштування стилю для ліній aa.lineStyle(_root.diam, _root.kolor, _root.al); aa.moveTo(x, y); // Для того, щоб при простому натисканні та відпусканні кнопки // миші у нас з'являлася точка, пишемо: aa.lineTo( aa._xmouse +0.2, aa._ymouse+0.2); // при кожному русі миші домальовуємо ще одну лінію
onMouseMove = function() aa.lineTo( aa._xmouse, aa._ymouse) xx = aa._xmouse yy = aa._ymouse > >
if (instrument == 2) < // якщо вибрано інструмент лінія // початок аналогічноперший варіант m++; _root.otm.gotoAndStop(1); _root.undo = true; _root.norep(); var ttt = this.createEmptyMovieClip("ff" + m, m);
ttt._x = 0; ttt._y = 0; // запам'ятовуємо положення курсору xx = this._xmouse; yy = this._ymouse;
onMouseMove = function():Void ttt.clear(); // очищаємо кліп // застосовуємо стиль ttt.lineStyle(_root.diam, _root.kolor, _root.al); // малюємо лінію з першої точки (при натисканні на кнопку) // у те місце, де зараз курсор ttt.moveTo(xx, yy); ttt.lineTo(this._xmouse, this._ymouse);
if (instrument == 3) < //якщо вибрано інструмент прямокутник // все те саме: створення кліпу, застосування стилю, // запам'ятовування позиції курсору m++; ot = m; _root.otm.gotoAndStop (1); _root.undo = true; _root.norep(); var ttt = this.createEmptyMovieClip("ff" + m, m); trace (ttt); ttt._x = 0; ttt._y = 0; xx = this._xmouse; yy = this._ymouse; onMouseMove = function():Void ttt.clear();
ttt.lineStyle(_root.diam, _root.kolor, _root.al); ttt.moveTo(xx, yy); // малюємо сам прямокутник ttt.lineTo(this._xmouse, yy); ttt.lineTo(this._xmouse, this._ymouse); ttt.lineTo(xx, this._ymouse); ttt.lineTo(xx, yy);
> > // нарощуємо лічильник кліпів на 1 n++; > // додаємо обробник відпускання кнопки on (release, releaseOutside) delete onMouseMove; >
Тепер зробимо робітниками кнопки Скасувати та Повторити. На кнопку Скасувати вішаємо
if (_root.undo) < // undo - булева величина, зберігає відомості про те, чи є що зараз скасувати gotoAndStop(2); > > on (rollOut, releaseOutside) if (_root.undo) gotoAndStop(1); > else gotoAndStop(3); > >
if (_root.undo) // приховуємо останнійкліп _root.pole["ff"+_root.pole.m]._alpha = 0; // зменшуємо лічильник _root.pole.m--; // тепер ми можемо повторити _root.rep = true; _root.povt.gotoAndStop(1);
if (_root.pole.m == 1) _root.undo = false; gotoAndStop(3); >
На кнопку Повторити: on (rollOver) if (_root.rep) gotoAndStop(2); > >
on (rollOut, releaseOutside) if (_root.rep) < //якщо можна повторити gotoAndStop(1); > else gotoAndStop(3); > >
on (release) if (_root.rep) _root.pole.m++; // показуємо кліп _root.pole["ff"+_root.pole.m]._alpha = 100; >
q = _root.pole.m+1; // перевіряємо, чи можна ще повторювати if (_root.pole["ff"+q] == undefined) < //якщо не можна _root.rep = false; gotoAndStop(3); > >
var i = _root.pole.m; while (true) < // Нескінченний цикл if (_root.pole.m _root.smp.k._height = _root.diam;
on (release, releaseOutside) this.stopDrag(); delete onMouseMove; >
_parent.p._x = this._xmouse; _root.diam = Math.round((_root.diametr.p._x / 80) * 30 + 2); _root.smp.k._w > _root.smp.k._height = _root.diam;
this.startDrag(false, 0, 0, 80, 0); this.onMouseMove = function() _root.al = Math.round((_root.opacity.p._x / 80) * 100); _root.smp.k._alpha=_root.al;
on (release, releaseOutside) this.stopDrag(); delete onMouseMove; >
Ну ось і все, завантажити вихідний з цією малювалкою можна тут: