actionscript-3 - ActionScript 3 中的圆形滑块

我希望在 ActionScript 中加入一个圆形滑块，与 this page 显示的非常相似:

它最终会改变对象的色调(返回 CMY 值)，但是如果它只是吐出程度，我可以完全使用它。如果您知 Prop 有此功能的任何资源、教程、伪代码或片段，我将不胜感激。谢谢!

最佳答案

下面是我对这个问题的解决方案。

值得注意的是，Flash 中的角度是在 radians 中处理的，而不是度数，这就是为什么您会注意到代码中的转换方法。就我个人而言，我发现以度为单位设置角度更容易可视化和理解，这就是 CircleSlider 构造函数接受以度为单位的值以及 CircleSliderEvent 类调度度和弧度的原因。

用例:

var circleSlider:CircleSlider = new CircleSlider(100, 270);
circleSlider.x = stage.stageWidth / 2;
circleSlider.y = stage.stageHeight / 2;
circleSlider.addEventListener(CircleSliderEvent.CHANGE, circleSliderEventHandler);

addChild(circleSlider);

function circleSliderEventHandler(event:CircleSliderEvent):void
{
    trace(event.degrees, event.radians);
}

CircleSlider 类:

package
{
    //Imports
    import flash.display.Sprite;
    import flash.display.Shape;
    import flash.events.Event;
    import flash.events.MouseEvent;

    //Class
    public class CircleSlider extends Sprite
    {
        //Properties
        private var mRadius:uint;
        private var mAngle:Number;
        private var mThumb:Sprite;

        //Constructor
        public function CircleSlider(radius:uint, degrees:Number)
        {
            mRadius = radius;
            mAngle = degrees;

            init();
        }

        //Init
        private function init():void
        {
            createCircle();
            createThumb();
            positionThumb(degreesToRadians(mAngle));
        }

        //Create Circle
        private function createCircle():void
        {
            var circle:Shape = new Shape();
            circle.graphics.lineStyle(4.0, 0xFFDDDD, 1.0);
            circle.graphics.drawCircle(0, 0, mRadius);

            addChild(circle);
        }

        //Create Thumb
        private function createThumb():void
        {
            mThumb = new Sprite();
            mThumb.graphics.beginFill(0xFF2222, 1.0);
            mThumb.graphics.drawCircle(0, 0, 10);
            mThumb.graphics.endFill();

            mThumb.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownEventHandler);

            addChild(mThumb);
        }

        //Mouse Down Event Handler
        private function mouseDownEventHandler(event:MouseEvent):void
        {
            mThumb.addEventListener(Event.ENTER_FRAME, enterFrameEventHandler);

            stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpEventHandler);
            stage.addEventListener(Event.MOUSE_LEAVE, mouseUpEventHandler);
        }

        //Enter Frame Event Handler
        private function enterFrameEventHandler(event:Event):void
        {
            positionThumb(Math.atan2(mouseY, mouseX));
        }

        //Mouse Up Event Handler
        private function mouseUpEventHandler(event:MouseEvent):void
        {
            mThumb.removeEventListener(Event.ENTER_FRAME, enterFrameEventHandler);

            stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpEventHandler);
            stage.removeEventListener(Event.MOUSE_LEAVE, mouseUpEventHandler);
        }

        //Position Thumb
        private function positionThumb(radians:Number):void
        {
            mThumb.x = Math.cos(radians) * mRadius;
            mThumb.y = Math.sin(radians) * mRadius;

            mAngle = radiansToDegrees(radians);

            dispatchEvent(new CircleSliderEvent(CircleSliderEvent.CHANGE, mAngle, radians));
        }

        //Degrees To Radians
        private function degreesToRadians(degrees:Number):Number
        {
            return degrees * Math.PI / 180;
        }

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

        //Set Angle
        public function set angle(degrees:Number):void
        {
            positionThumb(degreesToRadians(degrees));
        }

        //Get Angle
        public function get angle():Number
        {
            return mAngle;
        }
    }
}

CircleSliderEvent 类:

package
{
    //Imports
    import flash.events.Event;

    //Class
    public class CircleSliderEvent extends Event
    {
        //Constants
        public static const CHANGE:String = "change";

        //Properties
        public var degrees:Number;
        public var radians:Number;

        //Constructor
        public function CircleSliderEvent (type:String, degrees:Number = NaN, radians:Number = NaN)
        {
            super(type);

            this.degrees = degrees;
            this.radians = radians;
        }

        //Clone
        public override function clone():Event
        {
            return new CircleSliderEvent (type, degrees, radians);
        }

        //To String
        public override function toString():String
        {
            return formatToString("CircleSliderEvent", "type", "degrees", "radians");
        }
    }
}

关于actionscript-3 - ActionScript 3 中的圆形滑块，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13220832/