перемещение и вращение объектов по синусоиде - PullRequest
Новая
       33

перемещение и вращение объектов по синусоиде

0 голосов
/ 27 мая 2011

Есть несколько проблем, с которыми я сталкиваюсь: во-первых, как определить, где находится конец каждой синусоиды (то есть частота), а во-вторых, как повернуть каждый из них.объект так, что он скользит вбок вдоль синусоиды

(файл заметки 800 x 600)

вот мой код: CarouselTest.as:

package  
{
    import com.greensock.easing.Sine;
    import com.greensock.TweenMax;
    import com.components.CarouselItem;
    import com.theflashblog.fp10.SimpleZSorter;
    import flash.display.Sprite;
    import flash.events.Event;
    import uk.co.thereceptacle.utils.Trig;

    public class CarouselTest extends Sprite 
    {
        public static const SPACING : int = 20;
        public static const XSPACING: int = SPACING * 5;
        public static const SPEED   : Number = .05;
        public static const XSPEED  : Number = 800 / 360 * 2;
        public static const RADIUS  : int = 400;

        private var _items:Array;
        private var _container:Sprite;
        private var _movePerItem:Number;
        private var _noOfItems:int;

        public function CarouselTest() 
        {
            _items = new Array();
            _noOfItems = 200;
            _movePerItem = 360 / _noOfItems; // my attempt at finding how much each item must move in order to bring it to the front

            _container = new Sprite();
            _container.x = 400;
            _container.y = 300;
            _container.z = 200;
            addChild(_container);

            var item:CarouselItem = new CarouselItem();
            for (var i:int = 0; i < _noOfItems; i++)
            {
                item = new CarouselItem();
                item.radius = RADIUS;
                item.angle = (i * SPACING) % 360;
                item.x = i * XSPACING - 300;
                item.speed = SPEED;
                _container.addChild(item);
                _items.push(item);
            }

            moveItems(-1 * _movePerItem);
        }

        private function moveItems(direction:int):void
        {
            TweenMax.allTo(_items, 5, { angle:direction.toString(), x:(direction * XSPACING).toString(), ease:Sine.easeInOut } );
            TweenMax.to(this, 5, { onUpdate:SimpleZSorter.sortClips, onUpdateParams:[_container] } );
        }
    }
}

CarouselItem.as

package com.components 
{
    import flash.display.Sprite;
    import flash.text.TextField;
    import uk.co.thereceptacle.components.HTMLTextField;
    import uk.co.thereceptacle.utils.Trig;

    public class CarouselItem extends Sprite
    {
        private var _angle  : Number;
        private var _prevX  : Number;
        private var _prevZ  : Number;

        public var speed    : int;
        public var radius   : Number;

        public function CarouselItem() 
        {
            graphics.beginFill(0x99ff00);
            graphics.lineStyle(1);
            graphics.drawRect( -100, -150, 200, 300);

            var tf:TextField = new HTMLTextField();
            tf.embedFonts = false;
            tf.wordWrap = false;
            tf.htmlText = "<p>THIS IS A TEST</p>";
            tf.x = -100;
            tf.y = -tf.textHeight / 2;
            addChild(tf);
        }

        public function get angle():Number { return _angle; }
        public function set angle(value:Number):void 
        {
            _angle = value;

            z = Math.sin(angle) * radius;

            var deltaX:Number = x - _prevX;
            var deltaZ:Number = z - _prevZ;
            var rotate:Number = Trig.radiansToDegrees(Math.atan2(deltaZ, deltaX));
            rotationY = rotate; <strike>// this is getting close but always rotates the item away from the center and i need it to rotate towards the center on the positive side of the sine wave</strike>
// edit: i've updated this as it's much closer but still flaky - it feels like i haven't done it right

        }

        override public function set x(value:Number):void 
        {
            _prevX = x;
            super.x = value;
        }

        override public function set z(value:Number):void 
        {
            _prevZ = z;
            super.z = value;
        }
    }
}

надеюсь, что вы можете помочь повиноваться

1 Ответ

0 голосов
/ 27 мая 2011

Я предполагаю, что вы хотите анимировать что-то вроде скейтборда на холме (или лодку в море, или что-то подобное).

Все триггеры / исчисления, которые вам нужно знать для этой задачи: линия, расположенная на кривой по вашему желанию, является касательной. Он описывается производной кривой. Производная синусоиды - это косинус. Магия исчисления: если ваша кривая a * sin (b * x), касательная равна a * b * cos (b * x). Это дает вам (встать / бежать). Если вы хотите, чтобы это было выражено в виде угла, вам понадобится атан (или атан2) этого. Обратите внимание, вы должны быть в соответствии с вашими угловыми единицами. Скорее всего, Атан дает вам радианы, а вам нужны градусы.

...