Форум Flasher.ru

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)
-   API приложений и сред (http://www.flasher.ru/forum/forumdisplay.php?f=61)
-   -   [Starling] Рисование ломаных (http://www.flasher.ru/forum/showthread.php?t=209291)

mikhailk 27.10.2014 17:06

Рисование ломаных
 
Потребовалось рисовать ломаные линии, начал искать аналог реализации line.graphics.lineTo для старлинга. И, что интересно, нашел:
https://github.com/StarlingGraphics/...nsion-Graphics

Вот тут можно посмотреть пример, как рисуется линия:
http://www.emanueleferonato.com/2013...g-api-methods/

Но беда в том, что при наклоне в 45 градусов очень заметы зубчики. Да и в целом выглядит топорно. Разблюрить не получилось. Может кто подскажет несложную реализацию? Нужно несколько точек (от трех до семи) соединить отрезками, чтобы получилась нормальная ломаная шириной где-то 6-8 пикселей.

ЗЫ. Подозреваю, что могу собрать практически идеальную ломаную из кружков и отрезков разной длины, но хотелось бы более общее решение.

Добавлено через 14 минут
В общем я пока выкрутился - рисую ломаную во флешовый битмап, а потом создаю старлинговский имадж на основе этого битмапа. Но пока не уверен по производительности.

Добавлено через 5 часов 15 минут
Не выход. Работает очень медленно.

Alex Lexcuk 28.10.2014 21:58

Вот похоже
http://silin.su/#starling/display/line/bin

mikhailk 29.10.2014 00:40

Я примерно представляю себе как это сделано. Если приложение запустилось на планшете 2560x1600 и надо нарисовать ломаную через весь экран, то будет задержка, пока отрисуется. Там формируется BitmapData, на основе которой потом создается Image. Причем, основные затраты будут именно на создание Image, поскольку BitmapData отрисуется быстро.

У меня в итоге примерно так и получилось. Просто я перенес рисование на начало работы приложения и ломаные (если точнее - их части) закэшировал в виде готовых старлинговских Image. Но у меня конечное число вариантов ломаных. Если бы надо было обеспечить свободное создание ломаных на лету, то это головняк.

mikhailk 20.03.2015 10:36

Появилась необходимость отрисовать ломаные линии без использования Bitmapdata и создания Image'й, т.е., как я понимаю, через Quad'ы. Не видел ли кто готовой реализации?

illuzor 20.03.2015 14:15

Есть реализация Graphics под старлинг
https://github.com/StarlingGraphics/...nsion-Graphics

mikhailk 20.03.2015 14:57

Да, этот вариант я знаю.

В общем, я решил через Quad'ы. Пока решение драфтовое (видны стыки), но там буквально 10 строк. Главное, не забывать, что rotation для старлинговых объектов не в градусах, а в радианах.

mikhailk 23.03.2015 17:10

В общем, что "Graphics под старлинг", что чистые Quad'ы при определенных углах дают такую гребенку, что хоть вешайся. В итоге делаю вариант с отрезком линии в PNG, который растягиваю и вращаю. на нужный угол. линии получаются вполне себе приемлемые, но проблема со стыками. Решил поместить по полукругу на каждый конец отрезка и так стыковать. Но пока результатом не очень удовлетворен.

YBil 23.03.2015 17:34

Цитата:

Сообщение от mikhailk (Сообщение 1180434)
В общем, что "Graphics под старлинг", что чистые Quad'ы при определенных углах дают такую гребенку, что хоть вешайся. В итоге делаю вариант с отрезком линии в PNG, который растягиваю и вращаю. на нужный угол. линии получаются вполне себе приемлемые, но проблема со стыками. Решил поместить по полукругу на каждый конец отрезка и так стыковать. Но пока результатом не очень удовлетворен.

Может вот это поможет?
http://help.adobe.com/ru_RU/FlashPlatform/reference/actionscript/3/flash/display3D/Context3D.html#configureBackBuffer%28%29 --> antiAlias

mikhailk 23.03.2015 18:46

Теоретически - да.
Но что-то в лоб не получается.
На попытку сконфигурировать буфер прилетел эксепшн
Код:

exception, information=Error: Error #3709: The depthAndStencil flag in the application descriptor must match the enableDepthAndStencil Boolean passed to configureBackBuffer on the Context3D object.
Короче, надо разбираться.

Zebestov 24.03.2015 01:54

Вложений: 1
Раз:
Вложение 31488

Два:
Код AS3:

package {
 
import context.AppContext;
import flash.geom.Point;
import starling.core.Starling;
import starling.display.Image;
import starling.events.Touch;
import starling.events.TouchEvent;
import starling.events.TouchPhase;
 
public class LineDemo {
 
        public static const THICKNESS:int = 16;
        private var _points:Array = [];
 
        public function LineDemo()
        {
                Starling.current.stage.addEventListener(TouchEvent.TOUCH, onTouch);
        }
 
        private function onTouch(event:TouchEvent):void
        {
                var touch:Touch = event.touches[0];
 
                if (touch && touch.phase == TouchPhase.BEGAN)
                {
                        var pointTo:Point = new Point(touch.globalX, touch.globalY);
 
                        var point:Image = new Image(AppContext.getInstance().assetManager.getTexture("point"));
                        point.alignPivot();
                        point.x = pointTo.x;
                        point.y = pointTo.y;
                        point.width = point.height = THICKNESS;
                        Starling.current.stage.addChild(point);
 
                        if (this._points.length)
                        {
 
                                var pointFrom:Point = this._points[this._points.length - 1];
                                var segment:Image = new Image(AppContext.getInstance().assetManager.getTexture("segment"));
                                segment.alignPivot("left", "center");
                                segment.x = pointFrom.x;
                                segment.y = pointFrom.y;
                                segment.width = Point.distance(pointFrom, pointTo);
                                segment.height = THICKNESS;
                                segment.rotation = Math.atan2(pointTo.y - pointFrom.y, pointTo.x - pointFrom.x);
                                Starling.current.stage.addChild(segment);
                        }
 
                        this._points[this._points.length] = pointTo;
                }
        }
}
}

Вот это вот AppContext.getInstance().assetManager.getTexture(…) ты уже заменишь на свой экземпляр класса AssetManager с загруженными текстурами, у меня он хранится в синглтоне AppContext.


Часовой пояс GMT +4, время: 21:02.

Copyright © 1999-2008 Flasher.ru. All rights reserved.
Работает на vBulletin®. Copyright ©2000 - 2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Администрация сайта не несёт ответственности за любую предоставленную посетителями информацию. Подробнее см. Правила.