bubamara Posted October 26, 2013 Share Posted October 26, 2013 Hi, I'm trying to have clickable bitmapText - without success.Is there a way how to interact with bitmapText? Or any plans to future? Thanks in advance Link to comment Share on other sites More sharing options...
rich Posted October 27, 2013 Share Posted October 27, 2013 Yeah I need to redo BitmapText a bit to allow for things like this - it would make a lot more sense if it just extended Sprite and then you could do all the usual things with it. I'll add it to the roadmap. For now you'll need to place a blank 'hit sprite' over the top, or just use a Rectangle object and Rectangle.contains to check the input x/y against it. Link to comment Share on other sites More sharing options...
bubamara Posted October 27, 2013 Author Share Posted October 27, 2013 Thanks for reply. For those interested, here is little demo on that :<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="phaser.js"></script> <title>Clickable bitmapText</title> </head> <body> <script> var text, clickArea; var _isDown = false; var _game = new Phaser.Game(480, 320, Phaser.AUTO, '', { preload: preload, create: create, update: update }); function preload() { _game.load.bitmapFont('Desyrel', 'desyrel.png', 'desyrel.xml'); } function create() { var style = { font: '70px Desyrel', align: 'center'}; text = _game.add.bitmapText(_game.world.centerX, _game.world.centerY, 'Click me', style); text.anchor.setTo(0.5, 0.5); clickArea = new Phaser.Rectangle(text.x - text.width / 2, text.y - text.height / 2, text.width, text.height); } function update() { if (_game.input.activePointer.isDown) { if (Phaser.Rectangle.contains(clickArea, _game.input.x, _game.input.y) && !_isDown) { _isDown = true; onClickFunction(); } } if (_game.input.activePointer.isUp) { onReleaseFunction(); _isDown = false; } } function onClickFunction() { text.scale.x = text.scale.y = 0.9; } function onReleaseFunction() { text.scale.x = text.scale.y = 1; } </script> </body></html>EDIT : changed input.mousePointer to input.activePointer & check for "down" state plicatibu 1 Link to comment Share on other sites More sharing options...
Recommended Posts