Как я могу использовать событие keydown в группе? - PullRequest
Новая
       12

Как я могу использовать событие keydown в группе?

1 голос
/ 25 марта 2019

Я работаю над группой, образованной с помощью ректов и трансформаторов, теперь нужно перемещать ее не мышью, а другими способами.Используя контейнеры, я могу перемещать его с помощью клавиш со стрелками, но с группой функция Keydown не работает, я уже безуспешно пытался использовать group.on.

Мне бы хотелось, чтобы при нажатии стрелки начинали работатьгруппа, перемещающая это.

1 Ответ

0 голосов
/ 26 марта 2019

Вы не можете прослушивать событие клавиатуры на узлах холста (например, Group или Shape) с Konva.Но вы можете легко эмулировать его.

Вы можете сделать Stage фокусируемый узел и прослушивать события клавиатуры на нем.Затем выполните необходимые действия в обработчике событий. 

   var container = stage.container();

    // make it focusable

    container.tabIndex = 1;
    // focus it
    // also stage will be in focus on its click
    container.focus();


    const DELTA = 4;

    container.addEventListener('keydown', function (e) {
      if (e.keyCode === 37) {
        circle.x(circle.x() - DELTA);
      } else if (e.keyCode === 38) {
        circle.y(circle.y() - DELTA);
      } else if (e.keyCode === 39) {
        circle.x(circle.x() + DELTA);
      } else if (e.keyCode === 40) {
        circle.y(circle.y() + DELTA);
      } else {
        return;
      }
      e.preventDefault();
      layer.batchDraw();
    });

Демо: https://konvajs.org/docs/events/Keyboard_Events.htm

...