Форум Flasher.ru - программное рисование пунктирной линии

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)

- ActionScript 1.0/2.0 (http://www.flasher.ru/forum/forumdisplay.php?f=93)

- - программное рисование пунктирной линии (http://www.flasher.ru/forum/showthread.php?t=66933)

программное рисование пунктирной линии

Как я понимаю у метода lineStyle объекта MovieClip нет свойства типа линии. Т.е. пунктирную линию придется рисовать как линию состоящую из кусочков (цвет линии и цвет фона)? Или нет?

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

Но есть в этом и оборотная сторона, по ходу: много клипиков могу перенагружать плейер - тем более, если рядом шуршит ресурсоемкая анимация.

ясно, спасибо.... перегрузка плейера - это ваще полная ж... =)))

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

Ив написал:

Код:

this.setShapeSelectorClass = function () {

        delete this.setShapeSelectorClass;

        var ShapeSelector = function () {

                this.shift = this.shift;

                this.points_array = [];

                ASSetPropFlags (this, "shift", 1, 1);

        };

        // create (static)

        ShapeSelector.create = function (thisObject, name, depth, initObject) {

                var mc = thisObject.createEmptyMovieClip (name, depth);

                mc.__proto__ = this.prototype;

                for (var i in initObject) {

                        mc[i] = initObject[i];

                }

                this.call (mc);

                return mc;

        };

        var tmp = ShapeSelector.prototype = new MovieClip ();

        // private

        tmp.shift = 0;

        // properties. defaults

        tmp.closed = true;

        tmp.gap = 5;

        tmp.line = 10;

        tmp.speed = 1;

        tmp.width = 0;

        tmp.height = 0;

        tmp.thickness = 0;

        tmp.color = 0;

        tmp.alpha = 100;

        tmp.closeShape = function () {

                this.closed = true;

        };

        tmp.addPoint = function (x, y) {

                if (this.closed) {

                        this.closed = false;

                        this.points_array = [];

                }

                this.points_array.push ({_x:x, _y:y});

        };

        // redraw

        tmp.onEnterFrame = function () {

                this.clear (), this.lineStyle (this.thickness, this.color, this.alpha);

                var shift = this.shift += this.speed;

                var arr = this.points_array;

                var len = arr.length;

                if (len < 2) {

                        return;

                }

                for (var i = 1; i < len; i++) {

                        shift = dashFromTo (this, arr[i - 1]._x, arr[i - 1]._y, arr[i]._x, arr[i]._y, shift) || 0;

                }

                if (this.closed) {

                        dashFromTo (this, arr[len - 1]._x, arr[len - 1]._y, arr[0]._x, arr[0]._y, shift) || 0;

                }

        };

        // private: shifted dashed line drawing

        var dashFromTo = function (mc, sx, sy, ex, ey, shift) {

                var line = mc.line, gap = mc.gap;

                var dx = ex - sx, dy = ey - sy;

                var dist = Math.sqrt (dx * dx + dy * dy);

                var sin = dy / dist, cos = dx / dist;

                var poz = 0, step = (line + gap);

                shift = (shift % step + step) % step;

                mc.moveTo (sx, sy);

                if (shift) {

                        if (shift > gap) {

                                poz = (shift - gap);

                                if (poz > dist) {

                                        mc.lineTo (dist * cos + sx, dist * sin + sy);

                                        return poz + gap - dist;

                                }

                                mc.lineTo (poz * cos + sx, poz * sin + sy);

                                poz += gap;

                        } else {

                                poz = shift;

                                if (poz > dist) {

                                        mc.moveTo (dist * cos + sx, dist * sin + sy);

                                        return poz - dist;

                                }

                        }

                        mc.moveTo (poz * cos + sx, poz * sin + sy);

                }

                while (Math.abs (poz) < dist) {

                        poz += line;

                        if (poz > dist) {

                                mc.lineTo (dist * cos + sx, dist * sin + sy);

                                return poz + gap - dist;

                        }

                        mc.lineTo (poz * cos + sx, poz * sin + sy);

                        poz += gap;

                        if (poz > dist) {

                                mc.moveTo (dist * cos + sx, dist * sin + sy);

                                return poz - dist;

                        }

                        mc.moveTo (poz * cos + sx, poz * sin + sy);

                }

                return poz - dist;

        };

        _global.org = _global.org || {};

        _global.org.dembicki = _global.org.dembicki || {};

        _global.org.dembicki.ShapeSelector = ShapeSelector;

};

this.setShapeSelectorClass ();

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//                                                         USAGE EXAMPLE

//                         (AS1 and AS2 compatible)

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

// import org.dembicki.ShapeSelector;

trace ("Just draw something");

org.dembicki.ShapeSelector.create (this, "default_outline_mc", 0, {_x:sx, _y:sy});

this.onMouseDown = function () {

        this.onMouseMove = function () {

                this.default_outline_mc.addPoint (this._xmouse, this._ymouse);

        };

        this.onMouseUp = function () {

                this.default_outline_mc.closeShape ();

                delete this.onMouseMove;

                delete this.onMouseUp;

        };

};

Прикольная штуковина , помнится Ваня показывал её на одном из семинаров в RealTime ...

да и не говори, тема на 100 баллов =)))

У IV`a подругому не бывает )))

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

с кучей мувиклипов - будет тормозить..
эм...
если по прямой - то почему бы не воспользоваться moveTo() lineTo() (в цикле)?
если по кривой, то впринципе то же самое, только нужно алгоритм продумывать...

P.S.
Вот за 4 минуты накидал... И это при том что я тока третий день ковыряю флеш ;)

Код:

if(interval==NULL) {

var interval = 10; //Интервал между линиями.

var line = 10; //Длина линии.

var lenght = 500; //Длина, который покрывает весь пунктир.

var sx = 20; //Стартовая точка X

var sy = 20; //Стартовая точка Y

var dir = "hor"; //Направление. Вертикально чертить пунктир или горизонтально ( hor | var )

lineStyle(1,0x000000,100); //Стиль вашей линии (толщина, цвет, альфа).

var times = int(lenght/(line+interval)); // Это и все что дальше - не трогать.

}

moveTo(sx,sy);

while(times>0) {

 if(dir=="hor") {

 if(queue==1) {

                moveTo(sx+interval,sy);

                sx=sx+line;

                queue=0;

 } else {

                lineTo(sx+line,sy);

                sx=sx+line;

                queue=1;

 }

 }

 if(dir=="ver") {

 if(queue==1) {

                moveTo(sx,sy+interval);

                sy=sy+line;

                queue=0;

 } else {

                lineTo(sx,sy+line);

                sy=sy+line;

                queue=1;

 }

 }

 times--;

}

Вот... пользуйтесь если кому нада.. впринципе сделать с кривыми - тож не сложно...

Как применять? Просто создаете два кадра (ну или мувиклип с двумя кадрами (но только один ключевой)) и вставляете туда этот код, чут ьменяете переменные и все...