Question

我正在尝试在bezier曲线上放置一个动态生成的文本 - 文本最长可达12个字符，因此需要调整到中心。

我无法在谷歌上找到任何尝试。

我唯一的猜测是读取一条bezier曲线xy，然后将文本字段放在那里，但我如何让Textfield适应曲线呢？

谢谢！

马库斯

Answer 1

如果您的曲线是圆弧或圆形，我会为您做正确的事：p 前段时间我做了两节课来处理这个问题：

    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;
        }

    }
}

告诉我它是否适合你...... 干杯！

在Bezier曲线上创建动态TextField - AS3

1 个答案: