How can I expand vertically?

Im still confused over why widgets when set height 100% only show up on a fraction of the screen. Ive set the parent container to expand and I am still unable to have this display in all the screen. If i hardcode pixels then I can have a bigger map… Can someone please explain why expanding components is so odd?

Thank you !


wizardStep1.xml (2.9 KB)

Maybe you need to add expand="mapStep1" in the vbox holding the map?

            <vbox id="cntMap" spacing="true" width="100%" height="100%" expand="mapStep1">
                <mapViewer id="mapStep1" mapType="terrain" width="100%" height="100%"/>

Thank you for your response… I tried that. and it makes no change at all… I’m really having problems figuring out how to expand things in this UI designer its very inconsistent and unpredictable especially when putting things in fragments.


<layout expand="cntMain" stylename="align-center">
    <label value="msg://IntroducirCoordenadas" width="100%" stylename="align-center"/>
    <label value="msg://coordenadaInfo" width="100%"/>
    <hbox id="cntMain" spacing="true" width="100%" expand="cntMap">
        <vbox id="cntCoords" spacing="true" height="100%" width="300">
            <hbox spacing="true" width="100%" expand="lblIntroducirCoordenadas">
                <label id="lblIntroducirCoordenadas" value="msg://IntroducirCoordenadas"/>
                <button id="btnRemoveCoordenada" icon="MINUS" align="MIDDLE_CENTER"/>
                <button id="btnAddCoordenada" icon="PLUS" align="MIDDLE_CENTER"/>
                <button id="btnClear" icon="PICKERFIELD_CLEAR" align="MIDDLE_CENTER"/>
            <form id="coordenadaForm" dataContainer="coordenadaDc" width="300">
                <column width="350px">
                    <textField id="xField" property="latitud" align="MIDDLE_CENTER" width="100%"/>
                    <textField id="yField" property="longitud" align="MIDDLE_CENTER" width="100%"/>
            <table id="tblCoordenadas" dataContainer="coordenadasDc" width="100%"
                   align="MIDDLE_CENTER" height="400px">
                    <column id="latitud"/>
                    <column id="longitud"/>
            <hbox spacing="true" expand="uplCoordenada" width="100%">
                <upload id="uplCoordenada" uploadButtonIcon="UPLOAD" align="BOTTOM_CENTER"
                <button id="btnMapaPlantilla" icon="DOWNLOAD" align="MIDDLE_CENTER"
                <button id="btnCargarInfo" icon="QUESTION_CIRCLE" align="MIDDLE_CENTER"/>
        <vbox id="cntMap" spacing="true" width="100%" height="100%" expand="map">
            <mapViewer id="map" mapType="terrain" width="100%" height="100%"/>

is this a bug?


Been trying to figure this out for a couple of days,… im really having issues expanding things vertically.
Can anyone please tell me what is wrong with this xml?

<layout expand="cntMain" stylename="align-center">
   <!-- other stuff -->
   <hbox id="cntMain" spacing="true" width="100%" height="100%" expand="cntMap">
	<vbox id="cntMap" spacing="true" width="100%" height="100%" expand="map">
            <mapViewer id="map" mapType="terrain" width="100%" height="100%"/>

I have also noticed putting height % on the map widget does nothing… only px work… is this a bug?

As I can see you create a fragment screen for displaying maps, could you please share an XML of the screen that uses this fragment? Do you expand the fragment in the screen? Which version of platform and maps addon do you use?

Hello and thank you for your reply. The page with the fragment is a simple one.
I believe there is a bug here… I copied the contents of the layout into a blank page and it works as expected. I reached the conclusion that the vertical expand % is being ignored if its inside a fragment.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns=""
<layout expand="cntFragment" height="100%" width="100%">
    <hbox id="cntButton" spacing="true" width="100%" height="64">
    <hbox id="cntFragment" spacing="true" width="100%" height="100%"/>
    <hbox id="cntFooter" spacing="true" width="100%" height="32" expand="vbox">
        <vbox id="vbox" spacing="true"/>
        <button id="btnPrevious" caption="msg://Previous"/>
        <button id="btnNext" caption="msg://Next"/>
        <button id="btnFinish" caption="msg://Finish"/>

I think i hacked my way into something that produced this odd behaviour.

components are mounting on each other

components dissapearing in the tab sheet


Im using an hbox as some sort of fragment container. i have a set of buttons and these clean the hbox and create a fragment and put it in there.

                ScreenFragment screenFragment = fragments.create(this, "FRAGMENT NAME");

There is no “fragmentContainer” just “fragment” on the container pallete.
This “hack” Works but its really producing an odd behavior on component visibility, size and borders.
Is there a better way to switch fragments on a container on demmand using buttons??

ive been tinkering a while…
im trying to do this

If I put the contents on a vbox… didnt work… but a
groupbox… works better… not perfect… any idea why?

You probably need to expand your fragment vertically after you programmatically add it to the parent layout (if parent layout is a vbox or vertical groupBox). Otherwise fragment won’t take 100% of available space.


                ScreenFragment screenFragment = fragments.create(this, "FRAGMENT NAME");

Thank you very much for your response Mr. Budarov.
I tried this and it doesn’t work. .the fragment does extend but the behavior of some widgets is weird if i use vbox… so far the groupbox has least issues.