Неправильное отображение разметки экрана

Добрый день! Подскажите, пожалуйста, в чем причина неправильного отображения разметки экрана?
В режиме конструктора отображает как необходимо, при старте приложения сдвигает все(buttons & labels) в одну сторону.
image

image

Код XML-разметки слоя
<layout expand="weekTaskEntriesDcTable">
        <hbox spacing="true">
            <lookupPickerField id="brigadeLookupPickerField" caption="msg://brigade" optionsContainer="brigadesDc"
                               required="true" nullOptionVisible="false">
                <actions>
                    <action id="lookup" type="picker_lookup"/>
                    <action id="open" type="picker_open"/>
                </actions>
            </lookupPickerField>
        </hbox>
        <groupTable id="weekTaskEntriesDcTable" dataContainer="weekTaskEntriesDc" width="100%" aggregatable="true">
            <actions>
                <action id="remove"/>
                <action id="runReport" type="runReport"/>
            </actions>
            <columns>
                <column id="manufacturingMemoLine.product.name"/>
                <column id="manufacturingMemoLine.product.code"/>
                <column id="manufacturingMemoLine.manufacturingMemo.number"/>
                <column id="manufacturingMemoLine.product.unit.name"/>
                <column id="manufacturingMemoLine.quantity"/>
                <column id="manufacturingMemoLine.quantityProduced"/>
                <column id="laboriousness">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskLaborLabelAggregation"/>
                </column>
                <column id="monday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="tuesday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="wednesday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="thursday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="friday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="saturday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
                <column id="sunday">
                    <aggregation strategyClass="com.ekom.ekomerp.web.weektask.WeekTaskDayAggregation"/>
                </column>
            </columns>
            <buttonsPanel id="buttonsPanel" width="100%" enable="false">
                <hbox spacing="true">
                    <button icon="PLUS" action="add"/>
                    <button id="removeButton"/>
                    <button id="refreshButton" invoke="onRefreshButtonClick" icon="REFRESH_ACTION"/>
                    <button id="reportButton" invoke="onReportButtonClick"
                            icon="EXCEL_ACTION" captionAsHtml="true" caption="msg://Excel"/>
                </hbox>
                <label id="weekCaption" align="MIDDLE_CENTER" stylename="h2"/>
                <hbox align="BOTTOM_RIGHT" spacing="true">
                    <button id="submitAllButton" action="submitAll" invoke="submitAll"/>
                    <linkButton id="showPreviousWeek" icon="font-icon:CHEVRON_LEFT" align="MIDDLE_RIGHT"/>
                    <linkButton id="setToday" caption="msg://today" align="MIDDLE_RIGHT"/>
                    <linkButton id="showNextWeek" icon="font-icon:CHEVRON_RIGHT" align="MIDDLE_RIGHT"/>
                    <dateField id="dateField" resolution="DAY"/>
                </hbox>
            </buttonsPanel>
        </groupTable>
    </layout>

На картинке все отображено правильно, т.е. согласно разметке, которую вы приложили.
buttonsPanel - это hBox, внутри только hBox-ы. Результат - все элементы расположены горизонтально.

Все прижато к левому краю, а должно быть растянуто по всей ширине.

Добрый день.

Начиная с версии 7.2, ButtonsPanel больше не hBox, а flowBox (см. https://github.com/cuba-platform/cuba/issues/178), поэтому атрибут align не работает. Чтобы добиться необходимой разметки нужно написать свои CSS стили.

Глеб

1 Симпатия

В качестве альтернативы, можно не использовать buttonsPanel, а воспользоваться hBox, который разместить над таблицей.

Извиняюсь, я вообще смотрел только на верхнюю картинку.

спасибо!