Controls Sizes

[itg-assistant]

Cris asked 2016-06-14 20:25:10 UTC

Hi,

In Theme Builder, I set combobox's default.properties.height to 30. When I dropped it in a form, the Size property defaults to 30, which is what I expected, but it is cutoff as shown in image. I can only see it in full if I set the size manually to 32.

Also, take note of the controls' sizes at design-time and runtime. It seems the controls' sizes change at runtime. In WinForms, controls' sizes don't change as also shown in the image.

Thanks,

Cris

[itg-assistant]

Luca answered 2016-06-14 20:43:16 UTC

Thank you. Logged as WJ-7347.

The size doesn't change at runtime. The difference that you see is that at design time the panting rectangle is cropped to the size of the control while at runtime a control can render its HTML outside of the element. At design time we actually paint the control from the rendered HTML while at runtime it's only HMTL.

This allows you to use rotations and transformations without having to recalculate the size of the control.

Best,

Luca

[itg-assistant]

Luca answered 2016-06-14 21:27:09 UTC

Actually from your screenshot the controls did indeed change size. Can you send me the test project? Chrome or IE? I can't reproduce. See my screenshot below.

Best,

Luca

[itg-assistant]

Cris answered 2016-06-15 03:09:44 UTC

Hi Luca,

You are correct that size doesn't change at runtime. The runtime screenshot was taken from Chrome zoomed at 125%. Didn't know and notice that it was set like that. Sorry for the false alarm

But the issue for combobox (logged as WJ-7347) is still the same.

Regards,

Cris

[itg-assistant]

Luca answered 2016-06-16 15:54:14 UTC

Hello Cris,

What is the font of the page/form? I found a potential problem in the calculation of the preferred height but I can't reproduce this specific issue.

This is how the system calculates the height of controls:

• When AutoSize=false, the  height set by the code is preserved. We added AutoSize to all editable controls to let developers set the height of the fields to design moder looking apps. Changing the theme won't change the height since it's set in th code.

• When AutoSize=true, the height is set using a combination of the theme and the font. The system calculates the height of the font (adds 25%, the potential problem I mentioned is that it always added 7 pixels) adds the insets (size of the border if any, read from the theme) and then compares with the height in the theme. It will return the biggest of the two.

The problem you are seeing means that the theme height is bigger than the control's height, which is impossible since the property PreferredHeight always returns the biggest height and that is what is used when AutoSize = true.

The only way I can reproduce this  problem is by setting AutoSize=false and a height that is smaller than the height set in the theme.

Can you please check if you have AutoSize=false and also the font please?

Thanks,

Luca

[itg-assistant]

Luca answered 2016-06-16 15:56:47 UTC

Actually no, let me correct my last statement. Even if AutoSize=false and the height is smaller than the theme height, Wisej resizes the control correctly. The bottom part gets truncated only if the height is smaller than the internal elements, in the combobox case it's the button which has a minimum height.

[itg-assistant]

Cris answered 2016-06-16 18:00:17 UTC

Hi Luca,

When I drop the combobox, the default properties are:

AutoSize = True
Font = @default, 13px, Regular
Size.Height = 30

At runtime, the height looks bigger than the textbox to the right of the combobox. Please see the attached project I am playing with.

By the way, I've also noticed something about Label when adding a Height property in the Theme Builder. I'll send it later.

Regards,

Cris