Dynamically setting Form's height

WEB TMS WEB Core
1

Hi Bruno,

I hope this message finds you well. I'm currently facing an issue related to a form within a TWebScrollbox. My initial goal was to dynamically adjust the form's height within the scrollbox during runtime. This functionality was working perfectly three months ago. However, we have recently upgraded several versions of TMS Web Core, and I've encountered an issue where it no longer functions as expected.

To illustrate this problem, I've attached a sample project here:
27. form height.zip (1.7 MB)

I created a form within a WebScrollbox by clicking the "Create New Form" button and set the form's height to 1000 using the following code:

procedure TForm2.WebButton1Click(Sender: TObject);
procedure AfterCreateDlg(AForm: TObject);
begin
Form1.height := 1000;
end;
begin

Form1 := TForm1.CreateNew(WebScrollBox1.ElementID,@AfterCreateDlg);
end;

It seems that the form's height is not being set correctly to 1000. Instead, it consistently appears slightly taller than the scrollbox, regardless of how I resize the window. Please refer to the screenshot below:

image
image1842×789 95.7 KB

I also attempted to change the form's height by clicking another button using the following code:

Form1.height := 500;

However, in this case, the scrollbox's height was modified to 500, rather than the form's height, even though the scrollbox's align property is set to alClient. Please see the screenshot below for reference:

image
image2035×1590 139 KB

I would greatly appreciate your assistance in resolving this issue. Thank you in advance for your help.

2

When a form is hosted in a control and you adapt the form's height, the height of the control in which the form is hosted is changed. This is by design as the form has in this case not really its own HTML element but uses the element of the control where it is hosted.
A possible approach is to insert a WebHTMLDiv in the scrollbox, host the form in this WebHTMLDiv and adapt this WebHTMLDiv height

3

As per your recommendation, I incorporated a WebHTMLDiv element within the scrollbox, represented by the blue background. Subsequently, I created a form, distinguishable by its yellow background, directly within the confines of this WebHTMLDiv.

procedure TForm2.WebButton1Click(Sender: TObject);
procedure AfterCreateDlg(AForm: TObject);
begin
WebHTMLDiv1.height := 1000;
end;
begin
Form1 := TForm1.CreateNew(WebHTMLDiv1.ElementID,@AfterCreateDlg);
end;

after I clicked to create the form, I saw this:

image
image2106×1323 130 KB

Please take note that in my particular case, the height of the scrollbox was set to 567. When I adjusted the WebHTMLDiv1.height property to 1000, the expectation was that the form's height would also be 1000, effectively covering the entire blue area where the scrollbox is situated. However, as evident from the accompanying screenshot, the blue area remains visible...

Next, I clicked to change the WebHTMLDiv1.height to 500:

image
image2108×1327 112 KB

From the screenshot, I still saw the scrollbar where it is not supposed to shown, since WebHTMLDiv1 is 500 and it is shorter than scollbox height (567).

Looks like though I set a WebHTMLDiv1 into scrollbox, there are still issues.

I have attached a demo file here:
27. form height V2.zip (1.7 MB)

Thanks,

4

Any progress on this, folks?

5

Sorry, I could not yet allocate sufficient time, earliest moment will be after tomorrow's webinar.

6

Workaround for now you can use:

procedure TForm2.WebButton2Click(Sender: TObject);
begin
  WebHTMLDiv1.Height := 500;
  Form1.Realign;
end;

We'll investigate further if this can be fixed to make it automatic.

7

Hi Bruno, thanks for the reply. I added 'Form1.Realign;' however, I still saw the issue as I saw in previous post.

image
image2799×1210 125 KB

Thanks,

8

I tested this here in v2.3.
I suggest to also test in v2.3 when we have released it this week.