Forums » Help » Ui Elements

Hi

I have just started using impact and would like to ask some advice on the best why to setup ui elements.

I have not been able to workout how to fix the position entities so the position is static regardless of map position. To get round this I have started to use html elements that overlay the canvas. Is this something that is ok to do or is it better to have everything contained within impact?

Any advice would be greatly appreciated

Thanks

Ian

If you are planning to export your game with Ejecta or CocoonJS to Android/iOS in the future, I think the best way to handle UI Elements is by using entities.

The easy solution to your question,
* Create an entity to be an UI element

Add this code to the class definition of your entity to keep it fixed regardless of screen position (code not tested but should work)

isAnchored : true,
draw: function() {
	if (this.isAnchored && this.currentAnim) {
        	this.currentAnim.draw(
		this.pos.x - this.offset.x /*- ig.game._rscreen.x*/,
 		this.pos.y - this.offset.y /*- ig.game._rscreen.y*/
		);
        } else {
            this.parent();
        }
},

However, as you write your code you'll see that you'll have many other problems to solve about UI elements. Like how to make sure that when an element is pressed, the click doesn't propagate to the underlying entities, how to handle pop-ups, etc..

If you feel like it, there is a complete suite of additional features to impact here : http://collinhover.github.io/impactplusplus/

It also includes an UI system but the code is big and it takes some time to understand and use it.

Thank you for the advice I will check out impact++