[Nifty] Draggable starting in the middle of a screen

Hello,



I try to learn how to use draggable objects.



So I began with something really simple :

[java]

<!–

Main layer

–>

<layer id=“mainLayer” childLayout=“absolute” height=“100%” width=“100%” >



<control id=“mainPanel” name=“draggable” height=“80%” width=“30%” align=“center” valign=“center” childLayout=“overlay” >

<!-- Background -->

<image height=“100%” width=“100%” filename=“classicSheetBG_1x2.png” imageMode=“normal” />

</control>

</layer>

[/java]



It works but : Since the main layout is absolute, I don’t know how to center my panel in the middle of the screen in the beginning.

( it begins on the top left corner for now )



Is there a way ?



Thanks in advance.

From a html / css background, I could suggest possibly using negative margins and a static size for your menu.



Something like:



mainPanel width 500px

left 50%

margin left -250px



I’ve just recently started delving into the Nifty experience though. So my thought’s may not work at all :slight_smile:



Just giving a bit of info on what works in the css / html space.

elements that are direct children of an element with childLayout=“absolute” will always be absolutly positioned. there is no support for other kind of alignments or layouts for these kind of elements. absolute childLayout is absolut absolut :slight_smile: you’ll need to calculate the position on your own and do the math on your own to center the element and then use setConstraintX()/setConstraintY() to position the element.

So I need to use setConstraintX()/setConstraintY() if I want to postion my panel during the start method. Good to know.



And if I want to position the origin to (200, 200) in the start.

Something like :

[java]

<panel … childLayout=“absolute” >

<control x=“200” y=“200” …/>

</panel>

[/java]

should be enough ?

I think I’ve already tried that, but perhaps I missed something. I will try again.

yes, that will work. usually you want to add “px” or “%” to values. the syntax without “px” or “%” was added only a couple of months ago and I’m not sure if the version you’re using already supports it. with more current versions x=“200” will be treated the same as x=“200px” tho.