actionscript-3 - ベジエ曲線で動的 TextField を作成する - AS3

Question

動的に生成されたテキストをベジエ曲線に配置しようとしています。テキストは最大 12 文字の長さにできるため、中央に調整する必要があります。

Googleでこれを行う試みが見つかりません。

私の唯一の推測は、ベジエ曲線 xy を読み取り、その上にテキストフィールドを配置することですが、どのようにしてテキストフィールドを曲線に合わせることができますか?

ありがとう！

マーカス

Answer 1

あなたの曲線が円弧または円である場合、私はあなたにぴったりのものを持っています:pこれを処理するために、以前に2つのクラスを作成しました:

    package com.display{

    import flash.display.Sprite;

    import utils.Utils;

    public class PathText extends Sprite
    {
        private var _text:String;
        private var _chars:Array;
        private var _startAngle:Number;
        private var _stopAngle:Number;
        private var _radius:Number;


        public function PathText(__text:String, __radius:Number)
        {
            super();

            this.mouseChildren = false;
            this.mouseEnabled = false;
            _text = __text;

            _startAngle = 0;
            _radius = __radius;
            _chars = new Array();

            init();

        }

        private function init():void
        {
            for(var i:int = 0; i < _text.length; i++)
            {
                var char:Char = new Char(_text.charAt(i));
                _chars.push(char);
            }
            drawArc(_radius);
        }

        public function drawArc(rad:Number):void
        {
            var lastAngle:Number = 0;
            for(var i:int = 0; i < _chars.length; i++)
            {
                var angle:Number = 2 * Math.sin((_chars[i].width/2)/rad);

                _chars[i].rotation = radiansToDegrees(lastAngle) + 90;
                _chars[i].x = rad * Math.cos(lastAngle);
                _chars[i].y = rad * Math.sin(lastAngle);
                lastAngle += angle;
                addChild(_chars[i]);
            }

            _stopAngle = radiansToDegrees(lastAngle);
        }

        public function destroy():void
        {
            for(var i:int = _chars.length; i >= 0; i--) 
            {
                removeChild(_chars[i]);
                _chars.pop().destroy();
            }
        }

        public function get startAngle():Number
        {
            return _startAngle;
        }

        public function set startAngle(value:Number):void
        {
            _startAngle = value;
        }

        public function get stopAngle():Number
        {
            return _stopAngle;
        }

        public function set stopAngle(value:Number):void
        {
            _stopAngle = value;
        }

        private function radiansToDegrees(radians:Number):Number
        {
            return radians * 180 / Math.PI;
        }

    }
}

そして Char クラス:

package com.display
{
    import flash.display.Sprite;
    import flash.text.TextField;
    import flash.text.TextFieldAutoSize;
    import flash.text.TextFormat;

    public class Char extends Sprite
    {
        private var _str:String;

        public function Char(__str:String)
        {
            super();

            _str = __str;
            this.mouseChildren = false;
            this.mouseEnabled = false;
            init();
        }

        private function init():void
        {
            var _tf:TextField       = new TextField();
            _tf.defaultTextFormat   = new TextFormat("Some Font here", 15, 0xffffff);
            _tf.embedFonts          = true;
            _tf.mouseEnabled        = false;
            _tf.selectable          = false;
            _tf.text                = _str;
            _tf.autoSize            = TextFieldAutoSize.LEFT;
            _tf.width               = _tf.textWidth;
            addChild(_tf);
        }

        public function destroy():void
        {
            this.removeChildAt(0);
        }

        public function get str():String
        {
            return _str;
        }

        public function set str(value:String):void
        {
            _str = value;
        }

    }
}

それがうまくいくかどうか教えてください...乾杯！