Rectangle's adaptHeightToChildren not working with InputTextArea

Bugs
, ,
1

Hello,
I have built a simple chat interface. Since it looked a bit ugly without rounded corners, I created a Rectangle encapsulating the InputTextArea. The intent was to have the Rectangle handle the design and the InputTextArea handle text entry and adapting height according to the user’s input. Unfortunately, it seems that setting rectangle.adaptHeightToChildren = true; does not work when InputTextArea’s size increases due to the users input. I have created the following playground as an example:

It feels like controls should be able to adapt to the changing height of the InputTextArea but maybe I’m using wrong components. Please let me know whether this is a bug or whether I’m doing something unexpected. Any help would be appreciated.

Kind regards.

2

Checking!

3

Ok this is because you set the inputTextArea to maxHeight = 100%. Meaning that the control cannot grow more than its parent’s height (before the parent has the opportunity to grow)

So a simple fix is to set the inputTextArea maxHeight to a pixel value:
Simple Chat Interface | Babylon.js Playground (babylonjs.com)

image
image702×320 12.5 KB

1 Like
4

Right, because the reference frame changes :man_facepalming: thanks!

1 Like