LockHorizontal does not work

I am newbie in xojo and I use 2020r1.2.

I want to center a WebContainer in the page. The documentation says to use LockHorizontal and LockVertical, but in my code it does not work and I am obliged to use LockLeft and LockTop in Shown Webpage event and I have to calculate the left position in Resized event.

Here my code in Shown event

Var cws as new CntWeatherStation
dim PosLeft as Integer

cws.LockLeft = True
cws.LockRight = False
cws.LockTop = True
cws.LockBottom = false
cws.LockVertical = false
cws.LockHorizontal = true
PosLeft = (Self.width - cws.Width)/2
cws.EmbedWithin(self, PosLeft, 0, cws.Width, cws.Height)

MasterContainer = cws

And in Resized

dim PosLeft as Integer
If MasterContainer = Nil then
end If

PosLeft = (Self.width - MasterContainer.Width)/2
MasterContainer.Left = PosLeft

It works but the repositon of the container during the resize is not flowing and it would be better if LockHorizontal and LockVertical work.

Can you just have lockleft false and lockright false?

That should center it horizontally.
It could be that the left and top are not given, i noticed that on some parts since they where a percentage instead of pixels

If I set lockleft false and lockright false the container is placed on the right side and the browser shows an horizontal scroll bar.

In the documentation:

LockHorizontal overrides LockLeft and LockRight. It allows you to proportionally lock a control’s position to the center of its parent control (or web page).

So if LockHorizontal is true the values of LockLeft and LockRight are overrided,

1 Like

Should be the same output.

There are 2 embedwithin methods:

Tried using the one worhout the left and top?

Or you could try and set the postion locks after the embedwithin call…

If I use the one without left and top I receive a runtime exception UnsupportedOperationException
“You must specify X and Y when the parent view’s layout type is Fixed”.

If I set LockHorizontal and LockVertical after embedwithin the behaviour does not change and the issue is still present.

If I set also LockLeft and LockTop after embedwithin the container is not centered but is on the left side.

At the end the only solution I found was to redesign my application: instead of having all the components inside a web container I put only a few components and the others inside the web page