HTML5 Canvas üzerinde oyun geliştirmeye çalışırken karşılaştığım bir soruna Gold Fire Stüdyoları oldukça güzel bir çözüm bulmuş. Oyunun akışı içerisinde kullanıcıdan girdi almak istediğinizde canvasın dışına çıkmak istemiyorsanız biraz uğraşmanız gerekebiliyor. Gold Fire Stüdyoları da aynı sorunla karşılaşmış ve CanvasInput'u üretmişler.
Öncelikle linkleri vereyim. CanvasInput Github,
Web sayfasında ve githubdaki açıklamalarda da görebileceğiniz gibi HTML Input tagi ile aynı işlevi görecek ama tamamen canvas içinde kullanılacak bir kullanıcı girişi deneyimi sağlamak.
Kullanımı çok basit. CanvasInput.min.js include edildikten sonra aşağıdaki kod bloğu ile en basit haliyle bir input oluşturulabiliyor.
<canvas id="canvas" width="200" height="50"></canvas>var input = new CanvasInput({
canvas: document.getElementById('canvas')
});