I have created two apps and both has the same content.
App 1 is created with Flexbile Column Layout:
App 2 without:
As you recognized, UI components on App 2 are bigger than on App 1.
I am using the same controls on both:
<Page id="page" title="{i18n>title}">
<FlexBox alignItems="Start" justifyContent="Center">
<l:Grid containerQuery="true" defaultSpan="XL12 L12 M12 S12">
<Label text=""/>
<Text text="Hello Kitty"/>
<Input placeholder="Enter your email address" id="email" type="Email" value="{confirm>/email}" liveChange="onHandleLiveChangeEmail"/>
<Button type="Accept" enabled="{confirm>/enable}" text="Hello" press=".handlePressAuthorization" width="100%" />
</l:Grid>
</FlexBox>
</Page>
Unfortunately, I could not figure out where the differences are except App 1 runs with Flexible Column Layout.
Both apps are hosted on GitHub:
question from:
https://stackoverflow.com/questions/65845634/why-are-heights-of-some-ui-components-smaller-than-usual 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…