Какая игровая библиотека HTML5 Canvas поддерживает наведение?

Я собираюсь создать простую игру, используя холст HTML5. Вместо того, чтобы делать все вручную, я решил использовать какую-нибудь библиотеку. Я вижу, что существует много (более 100) библиотек, и я проверил около 5-6 из них, однако ни одна из них, похоже, не поддерживает простой эффект «зависания», подобный тому, который есть у вас в браузере.

По сути, я хочу иметь набор изображений или текстовых «спрайтов», которые должны меняться при наведении курсора мыши на них, чтобы указать пользователю, что он может что-то с этим сделать. И эти элементы также должны быть интерактивными.

Пожалуйста, не предлагайте мне использовать DOM. Я хочу использовать Canvas, потому что у меня сложная графика / анимация.

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

Я бы предпочел что-то вроде подхода jQuery:

SpriteElement.hover(function() { do stuff });

libraries html5-canvas
person Milan Babuškov    schedule 07.05.2013    source источник
comment
почему бы вам тогда не использовать jQuery?   -  person nathan hayfield    schedule 07.05.2013
comment
Натан, потому что jQuery предназначен для элементов DOM, а не <canvas> графики.   -  person Elliot Bonneville    schedule 07.05.2013

Ответы (2)


arrow_upward
3
arrow_downward

Я установил, протестировал и прочитал документацию. Вот что я нашел:

KineticJS

element.on ("наведение указателя мыши", функция () {});

Easel.js

element.addEventListener ("наведение курсора", функция () {});

Кроме того, Easel.js имеет приятный ButtonHelper класс, который автоматизирует использование 3 разных изображений для нормального, наведенного, нажатого состояния.

Crafty.js

element.bind ('MouseOver', ...

MelonJS

Нет автоматической поддержки. вручную это можно сделать с помощью:

input.registerMouseEvent ('перемещение мыши')

а затем повторение дочерних элементов и проверка через this.collisionBox.containsPoint (me.input.mouse.pos)

Квинтус

Очевидно, нет поддержки

Lime.js

Не удалось найти ничего в документах или в Google.

CanvasEngine

element.on ("наведение указателя мыши", функция (e) {});

Кажется, что это ошибка, хотя в Firefox 20.0 событие срабатывает только тогда, когда мышь перестает двигаться.

Cocos2D-html5

Нет автоматической поддержки, только ручное повторение дочерних элементов. Код, кажется, постоянно меняется, потому что Cocos ориентирована на сенсорные устройства, у которых нет концепции «зависания».

person Milan Babuškov    schedule 09.05.2013

arrow_upward
1
arrow_downward

То, что вы ищете, вероятно, называется наведением указателя мыши.

KineticJS поддерживает это:

https://stackoverflow.com/a/9270417/315168

person Mikko Ohtamaa    schedule 09.05.2013