Screen Formatting Issue

Support
#1

I have a StandardEditor screen using a transient entity set up as an editable table in a dialog box. Here is the XML:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="http://schemas.haulmont.com/cuba/screen/window.xsd"
        caption="msg://editorCaption"
        focusComponent="tblStates"
        messagesPack="com.paslists.rentals.web.screens.states">
    <data>
        <collection id="statesDc"
                  class="com.paslists.rentals.entity.States"
                  view="_local">
            <loader/>
        </collection>
    </data>
    <dialogMode height="600px"
                width="200px"
                modal="true"
                resizable="true"
                forceDialog="true"/>
    <layout expand="vboxStates" spacing="true">
        <vbox id="vboxStates" spacing="true" expand="tblStates">
            <table id="tblStates" dataContainer="statesDc" editable="true" height="100%">
                <buttonsPanel>
                    <button id="btnCreate" action="tblStates.create"/>
                    <button id="btnRemove" action="tblStates.remove"/>
                </buttonsPanel>
                <actions>
                    <action id="create" type="create"/>
                    <action id="remove" type="remove"/>
                </actions>
                <columns>
                    <column id="state" editable="true"/>
                </columns>
            </table>
            <hbox id="editActions" spacing="true">
                <button action="windowCommitAndClose"/>
                <button action="windowClose"/>
            </hbox>
        </vbox>
    </layout>
</window>

When I display this screen, the table overlaps the buttons:
image
What am I doing wrong?

#3

Hello @ericraskin

Could you clarify a version of CUBA that is used in your project? What browser do you use?

Please share sample project if possible, because i have no success to reproduce the issue:

image

Regards,
Daniil

#4

Hi:

I found out what it was. When you create a screen, your expand option on the layout is set to the editActions hbox. When I created mine, I mistakenly set it to the table I created. In my mind, that’s the screen object that I want to expand or contract.

Switching the expand back to editActions fixed the issue.

Maybe you can help me understand?

#5

You can expand only nested components:

vbox expand="hbox" (but not label)
    hbox expand="label"
        label
        textfield

You find more info here: Positioning of Components

#6

But code was:

<layout expand="table">
   <table id="table" ...> ... </table>
   <hbox id="editActions" ...> ... </hbox>
</layout>

Isn’t that nested at the correct level? It worked when I changed the expand at the layout level to be “editActions” instead of “table”.

#7

It’s correct. It this case working wrong?

#8

Nope - that’s what generated the screenshot I sent you. Very strange. As I said originally, I would think I want to expand the table, not the editActions. But expanding the table creates the overlap I showed in the image.

This is all just for my education, as the solution works. I’m just trying to understand why. :wink:

#9

Still cannot reproduce your case. Could you share small demo project to investigate the problem?

#10

As what I have now works, I am not sure it is worth the effort any more. I will move on to bigger and better things. :slight_smile:

Thank you for your help.