Question

我有一个精灵（例如纸飞机）。我想让它像下面的图片一样移动。我可以使用大量MoveTo和RotateBy操作来按点定义路径，但对我来说这似乎不太好。如何实施？

enter image description here

Answer 1

我认为发布一个答案可能会很好，这个答案显示了如果你明确控制精灵，更新将如何工作的基础知识。

我不确定您使用的是Cocos2d还是Cocos2d-X，但该技术适用于任何一种情况。代码在C ++中使用Cocos2d-x。

这个想法是，基于时间，你（手动）更新精灵的位置。精灵在任何时间的位置由动画开始后的秒数决定。该线名义上遵循从（x0，y0）到（x1，y0）的直线路径。然后，您可以使用某些三角函数将线投影到以任意角度绘制的直线上。这使得能够沿任何方向具有正弦路径。

这是基本代码（主要工作在UpdateAnimation（）中完成）：

// This assumes the frame rate is relatively constant
// at 60 fps.
const double SECONDS_PER_TICK = 1.0/60;
const double DURATION = 8.0;     // Seconds for total animation.
const double X_START = 100;      // Pixels
const double Y_START = 200;      // Pixels
const double X_STOP = 800;      // Pixels
const double X_SPEED = (X_STOP-X_START)/DURATION;
const double Y_PERIOD = 4.0;     // Seconds for y cycle.
const double Y_HEIGHT = 100;
const double LAUNCH_ANGLE = M_PI/4; // Angle for line.
const CCPoint ANCHOR(X_START,Y_START);

CCPoint RotatePointAboutAnchor(const CCPoint& pt,double theta,const CCPoint& anchor)
{
   double xPrime = cos(theta) * (pt.x-anchor.x) - sin(theta) * (pt.y-anchor.y) + anchor.x;
   double yPrime = sin(theta) * (pt.x-anchor.x) + cos(theta) * (pt.y-anchor.y) + anchor.y;

   return CCPoint(xPrime,yPrime);
}


void HelloWorld::InitAnimation()
{
   _ticks = 0;
   _ticksTotal = DURATION/SECONDS_PER_TICK;
}

void HelloWorld::UpdateAnimation()
{
   if(_ticks <= _ticksTotal)
   {
      double seconds = _ticks*SECONDS_PER_TICK;
      double xPos = X_START + seconds*X_SPEED;
      double yPos = Y_START + Y_HEIGHT*sin(seconds*2*M_PI/Y_PERIOD);
      CCPoint pos = RotatePointAboutAnchor(CCPoint(xPos,yPos), LAUNCH_ANGLE, ANCHOR);
      // Set the position of the sprite
      _sprite->setPosition(pos);

      CCLOG("Tick: %d, Seconds: %5.2f, Position: (%f,%f)",_ticks,seconds,pos.x,pos.y);
      if(_ticks%10 == 0)
      {  // Add a trail
         CCSprite* marker = CCSprite::create("Icon-72.png");
         marker->setScale(0.1);
         marker->setPosition(_sprite->getPosition());
         marker->setZOrder(50);
         addChild(marker);
      }
      // Increment the ticks count for next time.
      _ticks++;
   }
}

void HelloWorld::draw()
{
   CCLayer::draw();
   CCPoint start;
   CCPoint stop;

   start = RotatePointAboutAnchor(CCPoint(X_START,Y_START), LAUNCH_ANGLE, ANCHOR);
   stop = RotatePointAboutAnchor(CCPoint(X_STOP,Y_START), LAUNCH_ANGLE, ANCHOR);
   ccDrawLine(start,stop);

   start = RotatePointAboutAnchor(CCPoint(X_START,Y_START+Y_HEIGHT), LAUNCH_ANGLE, ANCHOR);
   stop = RotatePointAboutAnchor(CCPoint(X_STOP,Y_START+Y_HEIGHT), LAUNCH_ANGLE, ANCHOR);
   ccDrawLine(start,stop);

   start = RotatePointAboutAnchor(CCPoint(X_START,Y_START-Y_HEIGHT), LAUNCH_ANGLE, ANCHOR);
   stop = RotatePointAboutAnchor(CCPoint(X_STOP,Y_START-Y_HEIGHT), LAUNCH_ANGLE, ANCHOR);
   ccDrawLine(start,stop);
}

void HelloWorld::onEnterTransitionDidFinish()
{
   InitAnimation();
   scheduleUpdate();
}

void HelloWorld::onExitTransitionDidStart()
{
   unscheduleUpdate();
}

void HelloWorld::update(float dt)
{
   UpdateAnimation();
}

我画了一些标记来显示路径，并绘制线条＆＃34;周围＆＃34;应该遵循的道路。这是它的样子：

enter image description here

您可以根据需要更改LAUNCH_ANGLE，使其沿不同角度移动。

显然这不是生产代码，但它确实证明了您可以在任何方向上遵循正弦路径。您应该将其封装到更符合您应用程序的内容中。

整个代码库为available on git hub。

还有更多关于此类in this blog等内容的帖子。

Answer 2

有一个动作可以沿路径移动精灵并定向到路径。不是在我的电脑ATM上，但会尝试找到它。

你去...... https://developer.apple.com/library/ios/documentation/SpriteKit/Reference/SKAction_Ref/Reference/Reference.html#//apple_ref/doc/uid/TP40013017-CH1-SW3

实际上，你可能可以将一个重复的序列连接在一起，向上和向下移动一个前进动作并以此方式创建正弦运动。

Answer 3

感谢您的提问！下面的正弦cocos2d动作:)



class NDActionSineMoveBy : public ActionInterval
{
public:
    static NDActionSineMoveBy* create(float duration, float sines, float sineSize, const Vec2& deltaPosition);

    //
    // Overrides
    //
    virtual NDActionSineMoveBy* clone() const override;
    virtual NDActionSineMoveBy* reverse() const  override;
    virtual void startWithTarget(Node *target) override;
    /**
    * @param time in seconds
    */
    virtual void update(float time) override;

CC_CONSTRUCTOR_ACCESS:
    NDActionSineMoveBy() {}
    virtual ~NDActionSineMoveBy() {}

    /** initializes the action */
    bool initWithDuration(float duration, float sines, float sineSize, const Vec2& deltaPosition);

protected:
    Vec2 rotate(const Vec2 & point, float angle, const Vec2 & anchor);

protected:
    float _sines;
    float _sineSize;
    float _baseAngle;
    Vec2  _positionDelta;
    Vec2  _startPosition;
    Vec2  _previousPosition;

    float _currentAngle;
    float _distance;

private:
    CC_DISALLOW_COPY_AND_ASSIGN(NDActionSineMoveBy);
};

class NDActionSineMoveBy : public ActionInterval { public: static NDActionSineMoveBy* create(float duration, float sines, float sineSize, const Vec2& deltaPosition); // // Overrides // virtual NDActionSineMoveBy* clone() const override; virtual NDActionSineMoveBy* reverse() const override; virtual void startWithTarget(Node *target) override; /** * @param time in seconds */ virtual void update(float time) override; CC_CONSTRUCTOR_ACCESS: NDActionSineMoveBy() {} virtual ~NDActionSineMoveBy() {} /** initializes the action */ bool initWithDuration(float duration, float sines, float sineSize, const Vec2& deltaPosition); protected: Vec2 rotate(const Vec2 & point, float angle, const Vec2 & anchor); protected: float _sines; float _sineSize; float _baseAngle; Vec2 _positionDelta; Vec2 _startPosition; Vec2 _previousPosition; float _currentAngle; float _distance; private: CC_DISALLOW_COPY_AND_ASSIGN(NDActionSineMoveBy); };

NDActionSineMoveBy* NDActionSineMoveBy::create(float duration, float sines, float sineSize, const Vec2& deltaPosition)
{
    NDActionSineMoveBy *ret = new (std::nothrow) NDActionSineMoveBy();

    if (ret && ret->initWithDuration(duration, sines, sineSize, deltaPosition))
    {
        ret->autorelease();
        return ret;
    }

    delete ret;
    return nullptr;
}

bool NDActionSineMoveBy::initWithDuration(float duration, float sines, float sineSize, const Vec2& deltaPosition)
{
    bool ret = false;
    if (ActionInterval::initWithDuration(duration))
    {
        _sines = sines;
        _sineSize = sineSize;
        _positionDelta = deltaPosition;

        _baseAngle = atan2f(_positionDelta.y, _positionDelta.x);
        _currentAngle = _sines * (M_PI * 2);

        ret = true;
    }
    return ret;
}

NDActionSineMoveBy* NDActionSineMoveBy::clone() const
{
    // no copy constructor
    return NDActionSineMoveBy::create(_duration, _sines, _sineSize, _positionDelta);
}

void NDActionSineMoveBy::startWithTarget(Node *target)
{
    ActionInterval::startWithTarget(target);
    _previousPosition = _startPosition = target->getPosition();
    _distance = _positionDelta.length();
}

NDActionSineMoveBy* NDActionSineMoveBy::reverse() const
{
    return NDActionSineMoveBy::create(_duration, _sines, _sineSize, -_positionDelta);
}

void NDActionSineMoveBy::update(float t)
{
    if (_target)
    {
        Vec2 newPos;
        newPos.x = _distance * t;
        newPos.y = sin(_currentAngle * t) * _sineSize;
        newPos = rotate(newPos, _baseAngle, Vec2::ZERO);

#if CC_ENABLE_STACKABLE_ACTIONS
        Vec2 currentPos = _target->getPosition();
        Vec2 diff = currentPos - _previousPosition;
        _startPosition = _startPosition + diff;

        newPos += _startPosition;

        _target->setPosition(newPos);
        _previousPosition = newPos;
#else
        newPos += _startPosition;
        _target->setPosition(newPos);
#endif // CC_ENABLE_STACKABLE_ACTIONS
    }
}

Vec2 NDActionSineMoveBy::rotate(const Vec2& point, float angle, const Vec2& anchor)
{
    Vec2 res;
    res.x = cos(angle) * (point.x - anchor.x) - sin(angle) * (point.y - anchor.y) + anchor.x;
    res.y = sin(angle) * (point.x - anchor.x) + cos(angle) * (point.y - anchor.y) + anchor.y;
    return res;
};

如何让精灵在cocos2d中以正弦曲线移动？

3 个答案: