Рисуя линию, которая следует за вашим пальцем

Я создаю игру, и я пытаюсь нарисовать линию, которая следует за моим пальцем. Для этого я использую скелетную графику, и она работает очень хорошо, и вы можете увидеть, как я делаю это ниже.

if (begin) {
    _startPoint = new Point(begin.globalX, begin.globalY);
    _line.graphics.lineStyle(1, 0xffffff, 1);
    addChild(_line);
} else if (moved) {
    var width:Number = MathUtils.DistanceBetweetnTwoPoints(_startPoint.x, _startPoint.y, moved.globalX, moved.globalY);
    _currentPoint = new Point(moved.globalX, moved.globalY);
    _line.graphics.clear();
    _line.graphics.moveTo(_startPoint.x, _startPoint.y);
    _line.graphics.lineTo(_currentPoint.x, _currentPoint.y);
} else if (end) {
    _line.graphics.clear();
    _endPoint = new Point(end.globalX, end.globalY);
    addBlock(_startPoint, _endPoint);
}

Так что я хочу сделать следующее. В настоящий момент он просто следует за моим пальцем (рисует линию от начальной точки до текущей точки. Но я хочу ввести максимальную ширину. Скажем, 50. Если она пересекает длину 50, она должна просто следовать за моим пальцем по часовой стрелке. больше нет, но он отслеживает направление моего пальца и вращается к нему.

И последнее (хотя я не уверен, что это возможно) - позволить линии перейти от зеленого к красному, чем ближе она достигает максимальной длины (так что вся линия зеленая, но становится красной, тем ближе к 50)

Я понятия не имею, как достичь этого шо, было бы здорово, если бы кто-то мог указать мне правильное направление.

1 ответ

Решение

Если очков будет достаточно, то:

  1. Вы рассчитываете расстояние между точкой наблюдения и точкой касания. Если ниже вашего порога, нарисуйте полную линию.
  2. Если нет, вы вычисляете пропорцию между желаемой длиной и дельтами X и Y между точкой обзора и точкой касания, вы получите промежуточную точку, которая будет концом вашей нарисованной линии.
  3. Чтобы выбрать цвет, используйте интерполяцию HSV или RGB между зеленым и красным. Глупый пример uint(255*lineLength/50)*0x10000+uint(255*(1.0-lineLength/50))*0x100 будет делать в течение некоторого времени. lineLength здесь колеблется от 0 до 50,0.

После того, как вы рассчитаете все это, вы начнете рисовать линию, как вы это делали.

И придирки: линия "ширина" называется "толщина", которая в вашем примере равна 1 (устанавливается в lineStyle вместе с цветом).

Другие вопросы по тегам