Nifty GUI element positions in wrong order

Hello there,



I use a simple menu that contains 3 panels, aligned vertically. The GUI is defined in an XML file.

When I call the corresponding gotoScreen(String) method, I want the mouse cursor to be in the center of the bottom panel, so I wrote an effect for that and added it to the third panel. This effect uses element.getX() and Element.getY() to calculate the desired cursor position.



What actually happens when I switch to the screen is that the mouse cursor is placed on the center of the first panel instead of the third. After several hours of not finding the error, I found out that by simply adding the effect to another panel causes some weird behaviour. While the calculation and the positioning seems to be correct, I still get the following results:



effect added to : cursor appears at

top : bottom

mid : mid

bottom : top





The effect class:

[java]public void activate(Nifty nifty, Element element, EffectProperties parameters) {

int x = element.getX();

int y = element.getY();

int height = element.getHeight();

int width = element.getWidth();

int xCenter = x + width/2;

int yCenter = y + height/2;

Mouse.setCursorPosition(xCenter, yCenter);

}

[/java]

(the other methods of the effect interface are empty)



The XML file:

[xml]<nifty xmlns=“http://nifty-gui.sourceforge.net/nifty-1.3.xsd” xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance

xsi:schemaLocation=“http://nifty-gui.sourceforge.net/nifty-1.3.xsd http://nifty-gui.sourceforge.net/nifty-1.3.xsd”>





<!-- load styles and effects–>

<registerEffect name=“mouseRequest” class=“gui.MouseRequestEffect”/>





<!-- default screen -->

<screen id=“defaultScreen” controller=“gui.ScreenController”>

<layer id=“defaultLayer” childLayout=“center”></layer>

</screen>





<!-- menu screen -->

<screen id=“menuScreen” controller=“gui.ScreenController”>

<layer childLayout=“center” align=“center” valign=“center”>

<panel id=“centralMenuPanel” style=“developmentPanel” height=“200px” width=“150px” childLayout=“vertical” align=“center” valign=“center”>



<panel id=“topPanel” height=“60px” width=“140px” backgroundColor="#ff05" childLayout=“center”>

<interact onRelease=“closeMenu()”/>

<text text=“top panel” font=“aurulent-sans-16.fnt” color="#ffff" align=“center” valign=“center”/>

</panel>





<panel id=“midPanel” height=“60px” width=“140px” backgroundColor="#0ff5" childLayout=“center”>

<text text=“mid panel” font=“aurulent-sans-16.fnt” color="#ffff" align=“center” valign=“center”/>

</panel>





<panel id=“botPanel” height=“60px” width=“140px” backgroundColor="#f0f5" childLayout=“center”>

<effect>

<onStartScreen name=“mouseRequest” post=“true” />

</effect>

<text text=“bottom panel” font=“aurulent-sans-16.fnt” color="#ffff" align=“center” valign=“center”/>

</panel>



</panel>

</layer>

</screen>

</nifty>[/xml]



The called method closeMenu() switches the screen back to “defaultScreen”.



I couldn’t find out why the panels are rendered from top to bottom in the order I defined them, but their internal position seems to be the other way around. Am I doing something wrong, or is that an engine issue?

I could “fix” the problem by adding the effect to the wrong panel, but I’d rather do it properly.

Any hint is welcome.

Further testing revealed that different screen coordinate systems are in use. While jME has its (0;0) at bottom left, the NiftyGUI has its (0;0) at top left. Transforming the coordinates does the job:



[java]public void activate(Nifty nifty, Element element, EffectProperties parameters) {

int x = element.getX();

int y = element.getY();

int height = element.getHeight();

int width = element.getWidth();

int xCenter = x + width/2;

int yCenter = y + height/2;



// flip y

int screenHeight = Toolkit.getDefaultToolkit().getScreenSize().height;

yCenter = screenHeight - yCenter;



Mouse.setCursorPosition(xCenter, yCenter);

}[/java]

I assumed it’s a layout issue, but it isn’t. When I used another layout only the y-coordinate was wrong.

This is known. OpenGL’s coordinates system starts at lower-left. Pretty much the rest is top-left.